Skip to content

Commit ce48852

Browse files
committed
fix(material/chips): proviie ability to edit for all screen readers with a click on already focused chip
1 parent 50a9a9b commit ce48852

File tree

2 files changed

+20
-0
lines changed

2 files changed

+20
-0
lines changed

goldens/material/chips/index.api.md

+4
Original file line numberDiff line numberDiff line change
@@ -416,13 +416,17 @@ export class MatChipRemove extends MatChipAction {
416416
export class MatChipRow extends MatChip implements AfterViewInit {
417417
constructor(...args: unknown[]);
418418
// (undocumented)
419+
_alreadyFocused: boolean;
420+
// (undocumented)
419421
protected basicChipAttrName: string;
420422
contentEditInput?: MatChipEditInput;
421423
defaultEditInput?: MatChipEditInput;
422424
// (undocumented)
423425
editable: boolean;
424426
readonly edited: EventEmitter<MatChipEditedEvent>;
425427
// (undocumented)
428+
_handleClick(event: MouseEvent): void;
429+
// (undocumented)
426430
_handleDoubleclick(event: MouseEvent): void;
427431
_handleFocus(): void;
428432
// (undocumented)

src/material/chips/chip-row.ts

+16
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ export interface MatChipEditedEvent extends MatChipEvent {
6060
'[attr.aria-description]': 'null',
6161
'[attr.role]': 'role',
6262
'(focus)': '_handleFocus()',
63+
'(click)': '_handleClick($event)',
6364
'(dblclick)': '_handleDoubleclick($event)',
6465
},
6566
providers: [
@@ -93,6 +94,7 @@ export class MatChipRow extends MatChip implements AfterViewInit {
9394
@ContentChild(MatChipEditInput) contentEditInput?: MatChipEditInput;
9495

9596
_isEditing = false;
97+
_alreadyFocused = false;
9698

9799
constructor(...args: unknown[]);
98100

@@ -104,6 +106,14 @@ export class MatChipRow extends MatChip implements AfterViewInit {
104106
if (this._isEditing && !this._editStartPending) {
105107
this._onEditFinish();
106108
}
109+
this._alreadyFocused = false;
110+
});
111+
this._onFocus.pipe(takeUntil(this.destroyed)).subscribe(() => {
112+
if (!this._isEditing && !this.disabled) {
113+
this._ngZone.runOutsideAngular(() => {
114+
setTimeout(() => (this._alreadyFocused = true), 100);
115+
});
116+
}
107117
});
108118
}
109119

@@ -135,6 +145,12 @@ export class MatChipRow extends MatChip implements AfterViewInit {
135145
}
136146
}
137147

148+
_handleClick(event: MouseEvent) {
149+
if (!this.disabled && this.editable && !this._isEditing && this._alreadyFocused) {
150+
this._startEditing(event);
151+
}
152+
}
153+
138154
_handleDoubleclick(event: MouseEvent) {
139155
if (!this.disabled && this.editable) {
140156
this._startEditing(event);

0 commit comments

Comments
 (0)