mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(chips): fix chip list focus and keyboard behaviors (#7319)
This commit is contained in:
committed by
Andrew Seguin
parent
6b70ca6ce3
commit
f1664687a7
@@ -279,7 +279,7 @@ describe('MatChipList', () => {
|
||||
|
||||
describe('when the input has focus', () => {
|
||||
|
||||
it('should focus the last chip when press DELETE', () => {
|
||||
it('should not focus the last chip when press DELETE', () => {
|
||||
let nativeInput = fixture.nativeElement.querySelector('input');
|
||||
let DELETE_EVENT: KeyboardEvent =
|
||||
createKeyboardEvent('keydown', DELETE, nativeInput);
|
||||
@@ -292,8 +292,8 @@ describe('MatChipList', () => {
|
||||
chipListInstance._keydown(DELETE_EVENT);
|
||||
fixture.detectChanges();
|
||||
|
||||
// It focuses the last chip
|
||||
expect(manager.activeItemIndex).toEqual(chips.length - 1);
|
||||
// It doesn't focus the last chip
|
||||
expect(manager.activeItemIndex).toEqual(-1);
|
||||
});
|
||||
|
||||
it('should focus the last chip when press BACKSPACE', () => {
|
||||
@@ -786,7 +786,7 @@ describe('MatChipList', () => {
|
||||
|
||||
describe('when the input has focus', () => {
|
||||
|
||||
it('should focus the last chip when press DELETE', () => {
|
||||
it('should not focus the last chip when press DELETE', () => {
|
||||
let nativeInput = fixture.nativeElement.querySelector('input');
|
||||
let DELETE_EVENT: KeyboardEvent =
|
||||
createKeyboardEvent('keydown', DELETE, nativeInput);
|
||||
@@ -799,8 +799,8 @@ describe('MatChipList', () => {
|
||||
chipListInstance._keydown(DELETE_EVENT);
|
||||
fixture.detectChanges();
|
||||
|
||||
// It focuses the last chip
|
||||
expect(manager.activeItemIndex).toEqual(chips.length - 1);
|
||||
// It doesn't focus the last chip
|
||||
expect(manager.activeItemIndex).toEqual(-1);
|
||||
});
|
||||
|
||||
it('should focus the last chip when press BACKSPACE', () => {
|
||||
|
||||
@@ -10,7 +10,7 @@ import {FocusKeyManager} from '@angular/cdk/a11y';
|
||||
import {Directionality} from '@angular/cdk/bidi';
|
||||
import {coerceBooleanProperty} from '@angular/cdk/coercion';
|
||||
import {SelectionModel} from '@angular/cdk/collections';
|
||||
import {BACKSPACE, DELETE, LEFT_ARROW, RIGHT_ARROW, UP_ARROW} from '@angular/cdk/keycodes';
|
||||
import {BACKSPACE, LEFT_ARROW, RIGHT_ARROW} from '@angular/cdk/keycodes';
|
||||
import {startWith} from '@angular/cdk/rxjs';
|
||||
import {
|
||||
AfterContentInit,
|
||||
@@ -432,8 +432,8 @@ export class MatChipList implements MatFormFieldControl<any>, ControlValueAccess
|
||||
|
||||
let isPrevKey = (code === (isRtl ? RIGHT_ARROW : LEFT_ARROW));
|
||||
let isNextKey = (code === (isRtl ? LEFT_ARROW : RIGHT_ARROW));
|
||||
let isBackKey = (code === BACKSPACE || code == DELETE || code == UP_ARROW || isPrevKey);
|
||||
// If they are on an empty input and hit backspace/delete/left arrow, focus the last chip
|
||||
let isBackKey = code === BACKSPACE;
|
||||
// If they are on an empty input and hit backspace, focus the last chip
|
||||
if (isInputEmpty && isBackKey) {
|
||||
this._keyManager.setLastItemActive();
|
||||
event.preventDefault();
|
||||
@@ -504,8 +504,6 @@ export class MatChipList implements MatFormFieldControl<any>, ControlValueAccess
|
||||
if (focusChip) {
|
||||
focusChip.focus();
|
||||
}
|
||||
} else if (chipsArray.length === 0) {
|
||||
this._focusInput();
|
||||
}
|
||||
|
||||
// Reset our destroyed index
|
||||
|
||||
Reference in New Issue
Block a user