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

bug(MatMenu): With NVDA enabled, keyboard focus doesn't show up #21947

Closed
calebegg opened this issue Feb 18, 2021 · 7 comments · Fixed by #21987 or ToWipf/jasmarty#155
Closed

bug(MatMenu): With NVDA enabled, keyboard focus doesn't show up #21947

calebegg opened this issue Feb 18, 2021 · 7 comments · Fixed by #21987 or ToWipf/jasmarty#155
Labels
Accessibility This issue is related to accessibility (a11y) area: material/menu G This is is related to a Google internal issue P2 The issue is important to a large percentage of users, with a workaround

Comments

@calebegg
Copy link
Member

calebegg commented Feb 18, 2021

Repros on https://material.angular.io/components/menu/overview

Everything works fine when NVDA is disabled

Environment: NVDA version - 2019.2.1 - Firefox Version 83.0 - Windows 10 Enterprise (64-bit)

image

@calebegg calebegg added the needs triage This issue needs to be triaged by the team label Feb 18, 2021
@jelbourn jelbourn added Accessibility This issue is related to accessibility (a11y) area: material/menu G This is is related to a Google internal issue needs: clarification The issue does not contain enough information for the team to determine if it is a real bug and removed needs triage This issue needs to be triaged by the team labels Feb 19, 2021
@jelbourn
Copy link
Member

@calebegg I just tried this with NVDA 2020.3 and Firefox 85 and I don't see any difference between the focus treatment with and without NVDA enabled. Could have been an issue with an older browser + screen-reader combination?

@calebegg
Copy link
Member Author

Still repros consistently for me with those versions (2020.3 and 85.0.2). My specific repro steps

  1. start nvda
  2. start firefox (order might matter?)
  3. go to test page
  4. tab to menu trigger
  5. press enter

I have video if it would help? Github won't let me upload it here.

@crisbeto
Copy link
Member

I just tried it with NVDA + Firefox and I wasn't able to reproduce it either.

@calebegg
Copy link
Member Author

Could I trouble one of you for a video call to see if we can figure out what we're doing differently then? Our a11y tester and I are having trouble with this and it's going to block a launch if I can't figure it out.

@crisbeto
Copy link
Member

Sure, are you on the Angular Slack?

@calebegg
Copy link
Member Author

Yep. I'm calebegg on there too.

crisbeto added a commit to crisbeto/material2 that referenced this issue Feb 23, 2021
We currently have handling for the case where a `mousedown` event is thrown off by a
fake `mousedown` listener that may be dispatched by a screen reader when an element
is activated. It turns out that if the device has touch support, screen readers may dispatch
a fake `touchstart` event instead of a fake `mousedown`.

These changes add another utility function that allows us to distinguish the fake events
and fix some issues where keyboard focus wasn't being shown because of the fake
`touchstart` events.

Fixes angular#21947.
@crisbeto crisbeto added has pr P2 The issue is important to a large percentage of users, with a workaround and removed needs: clarification The issue does not contain enough information for the team to determine if it is a real bug labels Feb 23, 2021
crisbeto added a commit to crisbeto/material2 that referenced this issue Feb 23, 2021
We currently have handling for the case where a `mousedown` event is thrown off by a
fake `mousedown` listener that may be dispatched by a screen reader when an element
is activated. It turns out that if the device has touch support, screen readers may dispatch
a fake `touchstart` event instead of a fake `mousedown`.

These changes add another utility function that allows us to distinguish the fake events
and fix some issues where keyboard focus wasn't being shown because of the fake
`touchstart` events.

Fixes angular#21947.
crisbeto added a commit to crisbeto/material2 that referenced this issue Feb 23, 2021
We currently have handling for the case where a `mousedown` event is thrown off by a
fake `mousedown` listener that may be dispatched by a screen reader when an element
is activated. It turns out that if the device has touch support, screen readers may dispatch
a fake `touchstart` event instead of a fake `mousedown`.

These changes add another utility function that allows us to distinguish the fake events
and fix some issues where keyboard focus wasn't being shown because of the fake
`touchstart` events.

Fixes angular#21947.
andrewseguin pushed a commit that referenced this issue Feb 25, 2021
)

We currently have handling for the case where a `mousedown` event is thrown off by a
fake `mousedown` listener that may be dispatched by a screen reader when an element
is activated. It turns out that if the device has touch support, screen readers may dispatch
a fake `touchstart` event instead of a fake `mousedown`.

These changes add another utility function that allows us to distinguish the fake events
and fix some issues where keyboard focus wasn't being shown because of the fake
`touchstart` events.

Fixes #21947.
andrewseguin pushed a commit that referenced this issue Feb 25, 2021
)

We currently have handling for the case where a `mousedown` event is thrown off by a
fake `mousedown` listener that may be dispatched by a screen reader when an element
is activated. It turns out that if the device has touch support, screen readers may dispatch
a fake `touchstart` event instead of a fake `mousedown`.

These changes add another utility function that allows us to distinguish the fake events
and fix some issues where keyboard focus wasn't being shown because of the fake
`touchstart` events.

Fixes #21947.

(cherry picked from commit c7edf03)
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Mar 28, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.