fix(material/chips): provide ability to edit for all screen readers with a click on already focused chip #30983
Conversation
adolgachev
added
the
dev-app preview
|
Deployed dev-app for c0bd1c1 to: https://ng-dev-previews-comp--pr-angular-components-30983-dev-9kax7hje.web.app Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt. |
adolgachev
changed the title
adolgachev
changed the title
adolgachev
added
the
requires: TGP
adolgachev
requested review from
mmalerba,
andrewseguin and
crisbeto
and removed request for
a team
adolgachev
added
the
action: review
src/material/chips/chip-row.ts
Outdated
| if (!this._isEditing && !this.disabled) { | ||
| // Need a timeout to ensure flag not set while handling the first click. | ||
| this._ngZone.runOutsideAngular(() => { | ||
| setTimeout(() => (this._alreadyFocused = true), 100); |
There was a problem hiding this comment.
I think we can do this without the timeout by checking whether the chip is focused on the mousedown.
There was a problem hiding this comment.
Great idea! That works well and actually handles the long press better as well. Well, I could have argued that a long press to edit is a feature, but I won't now.
Only thing is then the spec needs to have a mousedown as well.
src/material/chips/chip-row.ts
Outdated
| * edit mode on a subsequent click. Otherwise, the chip appears focused when handling the | ||
| * first click event. | ||
| */ | ||
| _alreadyFocused = false; |
There was a problem hiding this comment.
Should we make this private? Also maybe something more descriptive like _wasFocusedOnLastClick?
There was a problem hiding this comment.
I'll make it private. I think name is okay though, as the main point is that it has already been focused via a previous click or tab. I think with the comments and only used internally, that works. Else it would have to be really long.
src/material/chips/chip-row.ts
Outdated
| @@ -135,6 +147,17 @@ export class MatChipRow extends MatChip implements AfterViewInit { | |||
| } | |||
| } | |||
|
|
|||
| /** Sets _alreadyFocused (ahead of click) when chip already has focus. */ | |||
| _handleMouseDown(event: MouseEvent) { | |||
| this._alreadyFocused = this._hasFocus(); | |||
There was a problem hiding this comment.
Might be worth binding this outside the NgZone.
adolgachev
added
action: global presubmit
…ith a click on already focused chip
Some screen readers have difficulty with allowing users to say double click or enter with voice control, preventing them from being able to edit a chip which currently requires a double click or an enter key event.
Single click conflicts with other behaviors, but allowing a click when the chips has already been focused is a natural way to edit the chip and does not affect other current behaviors.
Fixes b/290806246.