Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(material-experimental/mdc-chips): don't use button element if chip row isn't editable #25327

Merged
merged 1 commit into from
Jul 25, 2022

Commits on Jul 22, 2022

  1. fix(material-experimental/mdc-chips): don't use button element if chi…

    …p row isn't editable
    
    Currently we always use a `button` element inside the `mat-chip-row` which can be confusing for users if the row isn't editable, because the button won't do anything.
    
    These changes switch to using a `span` whose `role` we toggle based on whether it's editable.
    
    The change ended up trickier than expected, because:
    1. The focus behavior of the `span` is slightly different from the button we had before.
    2. The focus restoration after an edit is finished is currently working by accident. When editing starts, we set `isInteractive = false` on the primary action which clears its `tabindex`. When editing is finished, we reset the flag, but change detection hasn't had the chance to run so the element won't actually have a `tabindex` at the moment when we try to restore focus. It worked by accident because a `button` is still focusable even without a `tabindex`.
    
    An alternative approach I was testing out was to swap between a `span` and `button` element based on the `editable` input, but that didn't work, because we have a `ViewChild` query for the primary action which wasn't being updated by the framework.
    crisbeto committed Jul 22, 2022
    Configuration menu
    Copy the full SHA
    54ef8a0 View commit details
    Browse the repository at this point in the history