From 9c4ff389f0513dca8d8f086cc5876e22dee22c19 Mon Sep 17 00:00:00 2001 From: chenc Date: Thu, 20 Jan 2022 00:18:11 +0800 Subject: [PATCH 1/3] fix(module:select): fix keyboard event error when option data is null --- components/select/select.component.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/components/select/select.component.ts b/components/select/select.component.ts index 8858312961..cd2a89b0b1 100644 --- a/components/select/select.component.ts +++ b/components/select/select.component.ts @@ -400,6 +400,10 @@ export class NzSelectComponent implements ControlValueAccessor, OnInit, AfterCon const activatedIndex = listOfFilteredOptionNotDisabled.findIndex(item => this.compareWith(item.nzValue, this.activatedValue) ); + // check option value is exist + if (!listOfFilteredOptionNotDisabled.length) { + return; + } switch (e.keyCode) { case UP_ARROW: e.preventDefault(); From a99b47625e1d9e4b3b59d2332721435d3f811744 Mon Sep 17 00:00:00 2001 From: chenc Date: Wed, 16 Feb 2022 17:00:30 +0800 Subject: [PATCH 2/3] chore: move the logic place --- components/select/select.component.ts | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/components/select/select.component.ts b/components/select/select.component.ts index cd2a89b0b1..2634f78c15 100644 --- a/components/select/select.component.ts +++ b/components/select/select.component.ts @@ -400,21 +400,17 @@ export class NzSelectComponent implements ControlValueAccessor, OnInit, AfterCon const activatedIndex = listOfFilteredOptionNotDisabled.findIndex(item => this.compareWith(item.nzValue, this.activatedValue) ); - // check option value is exist - if (!listOfFilteredOptionNotDisabled.length) { - return; - } switch (e.keyCode) { case UP_ARROW: e.preventDefault(); - if (this.nzOpen) { + if (this.nzOpen && listOfFilteredOptionNotDisabled.length > 0) { const preIndex = activatedIndex > 0 ? activatedIndex - 1 : listOfFilteredOptionNotDisabled.length - 1; this.activatedValue = listOfFilteredOptionNotDisabled[preIndex].nzValue; } break; case DOWN_ARROW: e.preventDefault(); - if (this.nzOpen) { + if (this.nzOpen && listOfFilteredOptionNotDisabled.length > 0) { const nextIndex = activatedIndex < listOfFilteredOptionNotDisabled.length - 1 ? activatedIndex + 1 : 0; this.activatedValue = listOfFilteredOptionNotDisabled[nextIndex].nzValue; } else { From 229e168eb165242d2bb5947657c6974a446bd481 Mon Sep 17 00:00:00 2001 From: chenc Date: Wed, 16 Feb 2022 17:01:31 +0800 Subject: [PATCH 3/3] test(module:select): add test case --- components/select/select.spec.ts | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/components/select/select.spec.ts b/components/select/select.spec.ts index f8cd6f7217..3754913788 100644 --- a/components/select/select.spec.ts +++ b/components/select/select.spec.ts @@ -331,6 +331,24 @@ describe('select', () => { expect(component.openChange).toHaveBeenCalledWith(false); expect(component.openChange).toHaveBeenCalledTimes(3); })); + + it('should not throw error with keydown up arrow and down arrow event when listOfOption is empty', fakeAsync(() => { + const flushChanges = (): void => { + fixture.detectChanges(); + flush(); + fixture.detectChanges(); + }; + component.listOfOption = []; + component.nzOpen = true; + flushChanges(); + const inputElement = selectElement.querySelector('input')!; + dispatchKeyboardEvent(inputElement, 'keydown', UP_ARROW, inputElement); + flushChanges(); + dispatchKeyboardEvent(inputElement, 'keydown', DOWN_ARROW, inputElement); + flushChanges(); + expect(component.valueChange).toHaveBeenCalledTimes(0); + })); + it('should mouseenter activated option work', fakeAsync(() => { const flushChanges = (): void => { fixture.detectChanges();