Merge pull request #2605 from DouyinFE/fix_tooltip_dom_not_remove

fix: fix tooltip dom not remove

packages/semi-foundation/tooltip/foundation.ts

@@ -383,7 +383,8 @@ export default class Tooltip<P = Record<string, any>, S = Record<string, any>> e
 
     _togglePortalVisible(isVisible: boolean) {
         const nowVisible = this.getState('visible');
-        if (nowVisible !== isVisible) {
+        const isInsert = this.getState("isInsert");
+        if (nowVisible !== isVisible || isInsert !== isVisible) {
             this._adapter.togglePortalVisible(isVisible, () => {
                 if (isVisible) {
                     this._adapter.setInitialFocus();

packages/semi-ui/popconfirm/__test__/popconfirm.test.js

@@ -113,19 +113,48 @@ describe(`Popconfirm`, () => {
         expect(document.querySelectorAll(wrapSelector).length > 0).toBeTruthy();
 
         // click cancel button and check if hid and trigger onCancel
-        const buttons = document.querySelectorAll(`.${BASE_CLASS_PREFIX}-popconfirm-footer button`);
+        let buttons = document.querySelectorAll(`.${BASE_CLASS_PREFIX}-popconfirm-footer button`);
         const cancelButton = buttons[0];
         cancelButton.click();
 
         expect(onCancel.called).toBeTruthy();
         expect(elem.state('visible')).toBeFalsy();
+        // must reFind since document has changed
+        buttons = document.querySelectorAll(`.${BASE_CLASS_PREFIX}-popconfirm-footer button`);
+        const confirmButton = buttons[1];
+        expect(confirmButton).toBe(undefined)
+    });
 
-        // click confirm button and check if showd and trigger onConfirm
+    it(`test buttons 2`, async () => {
+        const onCancel = sinon.spy();
+        const onConfirm = sinon.spy();
+        const elem = mount(
+            <Popconfirm
+                position="bottomLeft"
+                title="确定是否要保存此修改？"
+                content="此修改将不可逆"
+                trigger={'click'}
+                onCancel={onCancel}
+                onConfirm={onConfirm}
+                defaultVisible={true}
+            >
+                <Button className={triggerCls}>Save</Button>
+            </Popconfirm>
+        );
+
+        // check if popconfirm showed or not
+        expect(document.querySelectorAll(wrapSelector).length > 0).toBeTruthy();
+
+        // click cancel button and check if hid and trigger onCancel
+        let buttons = document.querySelectorAll(`.${BASE_CLASS_PREFIX}-popconfirm-footer button`);
         const confirmButton = buttons[1];
-        elem.setState({ visible: true });
         confirmButton.click();
 
         expect(onConfirm.called).toBeTruthy();
         expect(elem.state('visible')).toBeFalsy();
+        // must reFind since document has changed
+        buttons = document.querySelectorAll(`.${BASE_CLASS_PREFIX}-popconfirm-footer button`);
+        const cancelButton = buttons[0];
+        expect(cancelButton).toBe(undefined)
     });
 });

packages/semi-ui/tooltip/index.tsx

@@ -250,8 +250,14 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
                     },
                     () => {
                         setTimeout(() => {
+                            this.setState((oldState) => {
+                                if ( oldState.transitionState === 'enter' ) {
+                                    this.eventManager.emit('portalInserted');
+                                }
+                                return {};
+                            });
                             // waiting child component mounted
-                            this.eventManager.emit('portalInserted');
+
                         }, 0);
                     }
                 );