From e53399fae4d2ea336ccb8e12150bcaab73a513bf Mon Sep 17 00:00:00 2001
From: E66 <E66_Crisp@163.com>
Date: Thu, 19 Feb 2026 21:46:17 +0800
Subject: [PATCH] fix(components): [select/select-v2] prevent empty input from
 causing unnecessary line breaks (#23394)

* fix(components): [select] prevent empty input from taking space

* fix(components): [select-v2] prevent empty input from taking space

* test(components): Supplement related test cases

* test: update test case
---
 .../select-v2/__tests__/select.test.ts        | 58 +++++++++++++++++++
 packages/components/select-v2/src/select.vue  |  7 ++-
 .../select/__tests__/select.test.ts           | 50 ++++++++++++++++
 packages/components/select/src/select.vue     |  7 ++-
 4 files changed, 120 insertions(+), 2 deletions(-)

diff --git a/packages/components/select-v2/__tests__/select.test.ts b/packages/components/select-v2/__tests__/select.test.ts
index d747f65bbb..0e408fd1c4 100644
--- a/packages/components/select-v2/__tests__/select.test.ts
+++ b/packages/components/select-v2/__tests__/select.test.ts
@@ -2869,4 +2869,62 @@ describe('Select', () => {
     await input.trigger('click')
     expect((select.vm as any).expanded).toBe(true)
   })
+
+  describe('input-wrapper in multiple mode', () => {
+    it('should hide input-wrapper when empty and not focused', async () => {
+      const wrapper = createSelect({
+        data: () => ({
+          multiple: true,
+          filterable: true,
+        }),
+      })
+      await nextTick()
+      const select = wrapper.findComponent(Select)
+      const inputWrapper = select.find('.el-select__input-wrapper')
+      const input = select.find('input')
+
+      // When input is empty and not focused, input-wrapper should have hidden class
+      expect(inputWrapper.classes()).toContain('is-hidden')
+
+      // Focus the input
+      await input.trigger('focus')
+
+      // When focused, input-wrapper should not have hidden class
+      expect(inputWrapper.classes()).not.toContain('is-hidden')
+
+      // Blur the input
+      await input.trigger('blur')
+
+      // When blurred and empty, input-wrapper should have hidden class again
+      expect(inputWrapper.classes()).toContain('is-hidden')
+    })
+
+    it('should show input-wrapper when input has value', async () => {
+      const wrapper = createSelect({
+        data: () => ({
+          multiple: true,
+          filterable: true,
+        }),
+      })
+      await nextTick()
+      const select = wrapper.findComponent(Select)
+      const inputWrapper = select.find('.el-select__input-wrapper')
+      const input = select.find('input')
+
+      // Initially empty, should be hidden
+      expect(inputWrapper.classes()).toContain('is-hidden')
+
+      // Set input value
+      await input.setValue('test')
+
+      // When input has value, input-wrapper should not have hidden class
+      expect(inputWrapper.classes()).not.toContain('is-hidden')
+
+      // Clear input
+      await input.setValue('')
+
+      // When empty again, should be hidden
+      expect(inputWrapper.classes()).toContain('is-hidden')
+    })
+  })
 })
diff --git a/packages/components/select-v2/src/select.vue b/packages/components/select-v2/src/select.vue
index 1b25080774..b616e9e3b1 100644
--- a/packages/components/select-v2/src/select.vue
+++ b/packages/components/select-v2/src/select.vue
@@ -173,7 +173,12 @@
               :class="[
                 nsSelect.e('selected-item'),
                 nsSelect.e('input-wrapper'),
-                nsSelect.is('hidden', !filterable || selectDisabled),
+                nsSelect.is(
+                  'hidden',
+                  !filterable ||
+                    selectDisabled ||
+                    (!states.inputValue && !isFocused)
+                ),
               ]"
             >
               <input
diff --git a/packages/components/select/__tests__/select.test.ts b/packages/components/select/__tests__/select.test.ts
index 9908d5e710..34b359e0a0 100644
--- a/packages/components/select/__tests__/select.test.ts
+++ b/packages/components/select/__tests__/select.test.ts
@@ -4332,4 +4332,54 @@ describe('Select', () => {
 
     vi.useRealTimers()
   })
+
+  describe('input-wrapper in multiple mode', () => {
+    test('should hide input-wrapper when empty and not focused', async () => {
+      wrapper = getSelectVm({
+        multiple: true,
+        filterable: true,
+      })
+      const inputWrapper = wrapper.find('.el-select__input-wrapper')
+      const input = wrapper.find('input')
+
+      // When input is empty and not focused, input-wrapper should have hidden class
+      expect(inputWrapper.classes()).toContain('is-hidden')
+
+      // Focus the input
+      await input.trigger('focus')
+
+      // When focused, input-wrapper should not have hidden class
+      expect(inputWrapper.classes()).not.toContain('is-hidden')
+
+      // Blur the input
+      await input.trigger('blur')
+
+      // When blurred and empty, input-wrapper should have hidden class again
+      expect(inputWrapper.classes()).toContain('is-hidden')
+    })
+
+    test('should show input-wrapper when input has value', async () => {
+      wrapper = getSelectVm({
+        multiple: true,
+        filterable: true,
+      })
+      const inputWrapper = wrapper.find('.el-select__input-wrapper')
+      const input = wrapper.find('input')
+
+      // Initially empty, should be hidden
+      expect(inputWrapper.classes()).toContain('is-hidden')
+
+      // Set input value
+      await input.setValue('test')
+
+      // When input has value, input-wrapper should not have hidden class
+      expect(inputWrapper.classes()).not.toContain('is-hidden')
+
+      // Clear input
+      await input.setValue('')
+
+      // When empty again, should be hidden
+      expect(inputWrapper.classes()).toContain('is-hidden')
+    })
+  })
 })
diff --git a/packages/components/select/src/select.vue b/packages/components/select/src/select.vue
index 0838eb1d61..3922bf9c77 100644
--- a/packages/components/select/src/select.vue
+++ b/packages/components/select/src/select.vue
@@ -171,7 +171,12 @@
               :class="[
                 nsSelect.e('selected-item'),
                 nsSelect.e('input-wrapper'),
-                nsSelect.is('hidden', !filterable || selectDisabled),
+                nsSelect.is(
+                  'hidden',
+                  !filterable ||
+                    selectDisabled ||
+                    (!states.inputValue && !isFocused)
+                ),
               ]"
             >
               <input