Block Toolbar: Zoom Out Tooltip is static and does not change to Zoom In when already Zoomed Out

[yogeshbhutkar]

Description

The Zoom Out toggle is expected to change its label to Zoom In once the content has been zoomed out. However, it was observed in the testing that the Zoom Out text remains static even though it was already Zoomed Out, which becomes a bottleneck for accessibility and can lead to a "not so good" UX.

There's a Trac Ticket created for this issue (https://core.trac.wordpress.org/ticket/62408) but it needs to be resolved here in the Gutenberg Repo.

Props to the respective author ( pitamdey ) for bringing this to our notice.

Step-by-step reproduction instructions

1. Go to edit a post or create a post.
2. Check the tooltip of the zoom-out toggle button, it should say zoom out.
3. Click on the button, and it will zoom out the content, now hover over the toggle, and it still shows up as Zoom Out which is misleading.

Screenshots, screen recording, code snippet

Environment info

WordPress Version: 6.7
Gutenberg Plugin: 19.6.1
OS: Mac OS ( should be independent of the OS )

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure

[Mamaduka]

I always assumed "Zoom Out" was the feature's name and button to be a toggle. Maybe we should keep it static, just like the "Block Inserter" and the "Document Overview" buttons in the header.

cc @WordPress/gutenberg-design

[yogeshbhutkar]

@Mamaduka Thanks for replying.

Probably for accessibility reasons, it makes more sense to use the correct labels. Also, It might confuse the general users making them think the tooltip is broken.

[t-hamano]

I always assumed "Zoom Out" was the feature's name and button to be a toggle. Maybe we should keep it static, just like the #65983 and the "Document Overview" buttons in the header.

I agree with this. "Zoom out" is a function name, not a verb that indicates an action. Whether the function is active can be determined by whether the button has a pressed state.

@afercia has been working on improving these labels lately, so he might know something.

[yogeshbhutkar]

I believe the tooltip should reflect on the functionality that would immediately be served by the button. When the pressed state is disabled the tooltip displays Zoom Out and when the button state becomes pressed, we are updating the state but not the tooltip that describes it.

It's probably fine in other scenarios like block inserter and all but here the tooltip completely negates the functionality. That's what I felt.

[afercia]

Labelk should not change dynamically because that would make the accessible name of a control change as well. For example, as a screen reader users I learn there is a button labeled Zoom Out. From that moment on I'd expect to find this button in the UI at any time and I may not have a clue thtat has dynamically changed to Zoom In.
Also, Zoom Out is a feature name. Anyways, there are ongoing discussion to rename the whole feature because it's not just abotu zooming. It's an editing mode for patterns.

[Mamaduka]

Thanks everyone for the feedback. I think we can close this issue and associated PR.

If/when there's a plan to change the name of the feature, it will be done separately.