question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MatSelect accessibility rework

See original GitHub issue

This issue tracks rework of the MatSelect component to resolve multiple accessibility issues. Based on this prototype (just the a11y behavior and API, not the visuals)

Summary:

  • New template-based syntax for options driven by data instead of ngFor (the existing syntax will remain for backwards compatibility for at least two major versions)
  • Option text will always be in the DOM, but not the option templates
  • Interaction changes from listbox to combobox

This should capture issues reported in #5220, #10292, #6382, #3587, #1670

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:19
  • Comments:43 (19 by maintainers)

github_iconTop GitHub Comments

3reactions
jelbourncommented, Nov 8, 2018

@crisbeto has been looking into it. The initial attempt at fixing this broke a huge number of unit tests inside Google, so we’re trying another approach that will be more opt-in.

2reactions
jelbourncommented, Jun 27, 2019

We’re now planning to address the issues as part of integrating the MDC Web components into Angular Material. The earlier attempts at fixing this were all just too much of a breaking change, such that it was impossible to roll out to applications in Google already using MatSelect.

Read more comments on GitHub >

github_iconTop Results From Across the Web

mat-select dropdown multiselect screen reader(NVDA) and ...
Angular Material Mat-Select dropdown with multi select along with search textbox on downarrow and uparrow key press NVDA is not reading the ...
Read more >
Migrating to MDC-based Components - Angular Material
The refactored components offer several benefits over the old implementations, including: Improved accessibility; Better adherence to the Material Design spec ...
Read more >
Improved Accessibility of Selects - Sahosoft Tutorials
<mat-select> is a form control for selecting a value from a set of options, similar to the native <select> element. You can read...
Read more >
@angular/material | Yarn - Package Manager
Designing and Implementing a CDK combobox component; Continuing to focus on improving the accessibility of Angular Material components. About the team. The ...
Read more >
Apple previews innovative accessibility features
Apple today previewed innovative software features that introduce new ways for users with disabilities to get the most out of Apple ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found