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

Site Editor: drill-down menu 'Back' button focus color and missing tooltips #48211

Open
afercia opened this issue Feb 17, 2023 · 1 comment
Open
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Package] Edit Site /packages/edit-site [Type] Bug An existing feature does not function as intended

Comments

@afercia
Copy link
Contributor

afercia commented Feb 17, 2023

Description

In the Site Editor, the'drill-down' on the left has now a 'Back' button that shows on all the levels.

  • Visually, the button contains only an icon. As such, at the very least it should expose its accessible name in a tooltip. This is the standard for all the icon-only buttons.
  • Ideally, the button accessible name should not change depending on the level, as the button visuals doesn't change.
  • When the button is focused, the arrow color becomes dark blue and it's barely visible. This appears to happen only on the first level.

First level:

  • The button icon becomes dark blue 😞
  • The button does show a tooltip with text 'Dashboard' 👍
  • Under the hood, the button accessible name doesn't match the visible tooltip text and it's Navigate to the Dashboard 😞 This is a barrier for speech recognition software users.

Screenshot 2023-02-17 at 09 47 20

Second level:

  • The button icon stays white 👍
  • The button does not show a tooltip 😞
  • Under the hood, the button accessible name changed to 'Back' 😞 (note: 'Back' is a good, short name. The point here is that it dynamically changed from the previous 'Navigate to the Dashboard' to 'Back'). This isn't great for speech recognition software users.

Screenshot 2023-02-17 at 09 48 23

Third level:
Same as the second level.

Screenshot 2023-02-17 at 09 49 34

Step-by-step reproduction instructions

  • Go to the Site Editor.
  • Navigate through the levels in the 'drill-down' menu.
  • Check the icon color and inspect the source to confirm the issues described above.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

@afercia afercia added [Type] Bug An existing feature does not function as intended [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Package] Edit Site /packages/edit-site labels Feb 17, 2023
@t-hamano
Copy link
Contributor

First level:
The button icon becomes dark blue 😞

This point will be resolved by #48134. However, the tests fail, probably due to problems with the performance tests themselves, so they have not yet been merged.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Package] Edit Site /packages/edit-site [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

3 participants