diff --git a/packages/select/__tests__/select.spec.ts b/packages/select/__tests__/select.spec.ts
index f095e2cbf9..81c71cad1d 100644
--- a/packages/select/__tests__/select.spec.ts
+++ b/packages/select/__tests__/select.spec.ts
@@ -115,6 +115,7 @@ describe('Select', () => {
afterEach(() => {
document.body.innerHTML = ''
})
+
test('create', async () => {
const wrapper = _mount(``, () => ({ value: '' }))
expect(wrapper.classes()).toContain('el-select')
@@ -166,7 +167,6 @@ describe('Select', () => {
expect(wrapper.find('.el-input__inner').element.value).toBe('双皮奶')
})
-
test('sync set value and options', async () => {
const wrapper = _mount(`
@@ -859,4 +859,68 @@ describe('Select', () => {
await nextTick()
expect(vm.value).toBe('Shanghai')
})
+
+ test('tag of disabled option is not closable', async () => {
+ const wrapper = _mount(`
+
+
+
+ `, () => ({
+ vendors: [2, 3, 4],
+ isCollapsed: false,
+ isClearable: false,
+ options: [
+ { name: 'Test 1', isDisabled: false },
+ { name: 'Test 2', isDisabled: true },
+ { name: 'Test 3', isDisabled: false },
+ { name: 'Test 4', isDisabled: true },
+ ],
+ }))
+ const vm = wrapper.vm as any
+ await vm.$nextTick()
+ const selectVm = wrapper.findComponent({ name: 'ElSelect' }).vm as any
+ expect(wrapper.findAll('.el-tag').length).toBe(3)
+ const tagCloseIcons = wrapper.findAll('.el-tag__close')
+ expect(tagCloseIcons.length).toBe(1)
+ await tagCloseIcons[0].trigger('click')
+ expect(wrapper.findAll('.el-tag__close').length).toBe(0)
+ expect(wrapper.findAll('.el-tag').length).toBe(2)
+
+ //test if is clearable
+ vm.isClearable = true
+ vm.vendors = [2, 3, 4]
+ await vm.$nextTick()
+ selectVm.inputHovering = true
+ await selectVm.$nextTick()
+ const iconClear = wrapper.find('.el-input__icon.el-icon-circle-close')
+ expect(wrapper.findAll('.el-tag').length).toBe(3)
+ await iconClear.trigger('click')
+ expect(wrapper.findAll('.el-tag').length).toBe(2)
+
+ // test for collapse select
+ vm.vendors = [1, 2, 4]
+ vm.isCollapsed = true
+ vm.isClearable = false
+ await vm.$nextTick()
+ expect(wrapper.findAll('.el-tag').length).toBe(2)
+ await wrapper.find('.el-tag__close').trigger('click')
+ expect(wrapper.findAll('.el-tag').length).toBe(2)
+ expect(wrapper.findAll('.el-tag__close').length).toBe(0)
+
+ // test for collapse select if is clearable
+ vm.vendors = [1, 2, 4]
+ vm.isCollapsed = true
+ vm.isClearable = true
+ await vm.$nextTick()
+ expect(wrapper.findAll('.el-tag__close').length).toBe(1)
+ await wrapper.find('.el-tag__close').trigger('click')
+ expect(wrapper.findAll('.el-tag').length).toBe(2)
+ expect(wrapper.findAll('.el-tag__close').length).toBe(0)
+ })
})
diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue
index d66b727e83..c312b1eaf0 100644
--- a/packages/select/src/select.vue
+++ b/packages/select/src/select.vue
@@ -31,7 +31,7 @@
>
{
option = {
value,
currentLabel: cachedOption.currentLabel,
+ isDisabled: cachedOption.isDisabled,
}
break
}
@@ -469,6 +470,11 @@ export const useSelect = (props, states: States, ctx) => {
const deleteSelected = event => {
event.stopPropagation()
const value = props.multiple ? [] : ''
+ if (typeof value !== 'string') {
+ for (const item of states.selected) {
+ if (item.isDisabled) value.push(item.value)
+ }
+ }
ctx.emit(UPDATE_MODEL_EVENT, value)
emitChange(value)
states.visible = false