Navigation block: Change aria-haspopup to dialog

[alexstine]

What?

Changes the aria-haspopup="true" to aria-haspopup="dialog" for the navigation block mobile menu trigger.

Why?

The trigger opens a menu but it is actually a dialog.

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup

The availability and type of popup the interactive element will trigger should be identified with the aria-haspopup state.

Since the trigger always opens a dialog and a menu is contained within the dialog, I think it is more correct to say the button opens a dialog, not a menu.

How?

Changes the attribute.

Testing Instructions

1. Start a screen reader.
2. Create and insert a navigation block.
3. View the front-end.
4. Zoom in until you reach mobile view.
5. Check the mobile menu button to see if it contains aria-haspopup="dialog".
6. Screen reader should announce that the button opens a dialog vs. a menu.

Testing Instructions for Keyboard

No keyboard change.

Notes

Interested in gathering other Accessibility Team opinions to make sure I'm not totally off base here.

[github-actions]

Flaky tests detected in d8a369e.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/6567273657
📝 Reported issues:

• [Flaky Test] should partially select with shift + click (@webkit) #53524 in /test/e2e/specs/editor/various/multi-block-selection.spec.js

[SantosGuillamot]

It looks good to me, although I'd prefer if the Accessibility Team takes a look as well 🙂

[joedolson]

It's better than using aria-haspopup="menu"; dialog is more appropriate than menu, I agree. The dialog value is pretty widely supported by AT/browser combinations - it's not fully supported in Narrator/Edge or in Talkback/Chrome, but in both cases it just falls back to more generic behavior, announcing a popup, which is sufficient to convey action.

[jeryj]

Thanks for the fix, @alexstine and thanks for the further a11y spec info, @joedolson!