From 22dad3ba6d860f6f6c9b3734f5e896db3a31cabd Mon Sep 17 00:00:00 2001
From: Carl Chen <71313168+cc-hearts@users.noreply.github.com>
Date: Fri, 8 Nov 2024 10:17:22 +0800
Subject: [PATCH] fix[Select]: fix select losing focus issue (#7829)

---
 components/select/__tests__/index.test.js | 46 +++++++++++++++++++++++
 components/vc-select/BaseSelect.tsx       |  8 ++++
 2 files changed, 54 insertions(+)

diff --git a/components/select/__tests__/index.test.js b/components/select/__tests__/index.test.js
index e169e107f..46ee2e46f 100644
--- a/components/select/__tests__/index.test.js
+++ b/components/select/__tests__/index.test.js
@@ -159,6 +159,52 @@ describe('Select', () => {
     }, 500);
   });
 
+  it('The select trigger should be blur when the panel is closed.', async () => {
+    const wrapper = mount(
+      {
+        render() {
+          return (
+            <Select
+              dropdownRender={() => {
+                return <input id="dropdownRenderInput" />;
+              }}
+            />
+          );
+        },
+      },
+      {
+        sync: false,
+        attachTo: 'body',
+      },
+    );
+    await asyncExpect(async () => {
+      await wrapper.find('.ant-select-selector').trigger('mousedown');
+      await wrapper.find('.ant-select-selection-search-input').trigger('focus');
+    });
+
+    await asyncExpect(async () => {
+      const el = wrapper.find('.ant-select');
+
+      expect(el.classes()).toContain('ant-select-focused');
+      $$('#dropdownRenderInput')[0].focus();
+
+      expect(el.classes()).toContain('ant-select-focused');
+
+      document.body.dispatchEvent(
+        new MouseEvent('mousedown', {
+          bubbles: true,
+          cancelable: true,
+          view: window,
+        }),
+      );
+    }, 100);
+
+    await asyncExpect(async () => {
+      const el = wrapper.find('.ant-select');
+      expect(el.classes()).not.toContain('ant-select-focused');
+    }, 200);
+  });
+
   describe('Select Custom Icons', () => {
     it('should support customized icons', () => {
       const wrapper = mount({
diff --git a/components/vc-select/BaseSelect.tsx b/components/vc-select/BaseSelect.tsx
index ca3b4e15d..72f50d840 100644
--- a/components/vc-select/BaseSelect.tsx
+++ b/components/vc-select/BaseSelect.tsx
@@ -343,6 +343,14 @@ export default defineComponent({
       if (mergedOpen.value !== nextOpen && !props.disabled) {
         setInnerOpen(nextOpen);
         props.onDropdownVisibleChange && props.onDropdownVisibleChange(nextOpen);
+
+        if (!nextOpen && popupFocused.value) {
+          popupFocused.value = false;
+          setMockFocused(false, () => {
+            focusRef.value = false;
+            blurRef.value = false;
+          });
+        }
       }
     };