Skip to content

Commit ee3958d

Browse files
authored
fix(list): incorrectly selecting items when moving focus using shift + arrow key in single selection mode (#18579)
The functionality that allows selecting items while moving focus using shift + arrow key is currently always enabled, however it should only apply in multi selection mode.
1 parent b2d08df commit ee3958d

File tree

2 files changed

+39
-1
lines changed

2 files changed

+39
-1
lines changed

src/material/list/selection-list.spec.ts

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -999,6 +999,44 @@ describe('MatSelectionList without forms', () => {
999999
expect(listOptions.every(option => !option.componentInstance.selected)).toBe(true);
10001000
});
10011001

1002+
it('should focus, but not toggle, the next item when pressing SHIFT + UP_ARROW in single ' +
1003+
'selection mode', () => {
1004+
const manager = selectionList.componentInstance._keyManager;
1005+
const upKeyEvent = createKeyboardEvent('keydown', UP_ARROW);
1006+
Object.defineProperty(upKeyEvent, 'shiftKey', {get: () => true});
1007+
1008+
dispatchFakeEvent(listOptions[3].nativeElement, 'focus');
1009+
expect(manager.activeItemIndex).toBe(3);
1010+
1011+
expect(listOptions[1].componentInstance.selected).toBe(false);
1012+
expect(listOptions[2].componentInstance.selected).toBe(false);
1013+
1014+
selectionList.componentInstance._keydown(upKeyEvent);
1015+
fixture.detectChanges();
1016+
1017+
expect(listOptions[1].componentInstance.selected).toBe(false);
1018+
expect(listOptions[2].componentInstance.selected).toBe(false);
1019+
});
1020+
1021+
it('should focus, but not toggle, the next item when pressing SHIFT + DOWN_ARROW ' +
1022+
'in single selection mode', () => {
1023+
const manager = selectionList.componentInstance._keyManager;
1024+
const downKeyEvent = createKeyboardEvent('keydown', DOWN_ARROW);
1025+
Object.defineProperty(downKeyEvent, 'shiftKey', {get: () => true});
1026+
1027+
dispatchFakeEvent(listOptions[0].nativeElement, 'focus');
1028+
expect(manager.activeItemIndex).toBe(0);
1029+
1030+
expect(listOptions[1].componentInstance.selected).toBe(false);
1031+
expect(listOptions[2].componentInstance.selected).toBe(false);
1032+
1033+
selectionList.componentInstance._keydown(downKeyEvent);
1034+
fixture.detectChanges();
1035+
1036+
expect(listOptions[1].componentInstance.selected).toBe(false);
1037+
expect(listOptions[2].componentInstance.selected).toBe(false);
1038+
});
1039+
10021040
});
10031041
});
10041042

src/material/list/selection-list.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -557,7 +557,7 @@ export class MatSelectionList extends _MatSelectionListMixinBase implements CanD
557557
}
558558
}
559559

560-
if ((keyCode === UP_ARROW || keyCode === DOWN_ARROW) && event.shiftKey &&
560+
if (this.multiple && (keyCode === UP_ARROW || keyCode === DOWN_ARROW) && event.shiftKey &&
561561
manager.activeItemIndex !== previousFocusIndex) {
562562
this._toggleFocusedOption();
563563
}

0 commit comments

Comments
 (0)