angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.32k stars 6.73k forks source link

bug(menu)[matMenuTriggerFor]: Trigger does not update ARIA values correctly in OnPush components (Accessibility) #29041

Open kryoussef opened 4 months ago

kryoussef commented 4 months ago

Is this a regression?

The previous version in which this bug was not present was

No response

Description

It seems like the issue : 26262 has not been resolved, The Trigger does not update aria values and misbehaves in OnPush components.

Reproduction

StackBlitz link: https://stackblitz.com/edit/angular-bqrgp1-p8dplp?file=src%2Fapp%2Fmenu-overview-example.ts Steps to reproduce:

  1. use NVDA Speech viewer
  2. open the menu and select items (multiple times) screen reader

Expected Behavior

When selecting an item menu-item from the menu, the aria-label and aria-expanded should be updated correctly, From the example above, NVDA should read item2 with menu being collapsed

Actual Behavior

As shown in the screenshot, when we click on the item2, NVDA is reading item1 with the menu being expanded

Environment

crisbeto commented 4 months ago

I'm a bit confused about the setup here. It's using MatMenu even though the issue is talking about the CDK menu. Also the bindings you're mentioning are set up by your own component, not to Material/CDK ones so you'll have to call markForCheck there yourself.

kryoussef commented 4 months ago

HEllo @crisbeto , The issue is : 26262 and the fixe is 26279 I will have to update the issue description

crisbeto commented 4 months ago

I spent some time trying to reproduce it, but the aria-expanded was being updated as expected in the Stackblitz. Could there be something in your app that's interfering with it?

kryoussef commented 3 months ago

Hello, as shown in this video, the aria-label is not updated and for accessibility, it is a problem, here is what NVDA reads while clocking or pressing enter on the menu trigger. https://github.com/angular/components/assets/168361048/cef03f46-a65f-4804-baa1-3d222bd88a26

kryoussef commented 1 month ago

Hello @crisbeto , any update on this issue ?