Bug 215342 - Web Inspector: add aria-label for [>>] overflow tab picker
Summary: Web Inspector: add aria-label for [>>] overflow tab picker
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: WebKit Nightly Build
Hardware: All All
: P2 Normal
Assignee: Patrick Angle
URL:
Keywords: GoodFirstBug, InRadar
Depends on:
Blocks:
 
Reported: 2020-08-10 15:51 PDT by Devin Rousso
Modified: 2020-08-14 11:24 PDT (History)
5 users (show)

See Also:


Attachments
Patch (1.90 KB, patch)
2020-08-14 08:31 PDT, Patrick Angle
no flags Details | Formatted Diff | Diff
Patch (1.87 KB, patch)
2020-08-14 10:51 PDT, Patrick Angle
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Devin Rousso 2020-08-10 15:51:28 PDT
# STEPS TO REPRODUCE
1. inspect any page
2. detach/undock Web Inspector
3. make the Web Inspector window very small horizontally/width-wis
4. hover over the [>>] overflow tab picker
  => [>>] overflow tab picker has no tooltip
Comment 1 Radar WebKit Bug Importer 2020-08-10 15:51:47 PDT
<rdar://problem/66804113>
Comment 2 Nikita Vasilyev 2020-08-10 15:55:22 PDT
On Big Sur, Safari and Finder both show ">>" icon for their toolbars and it doesn't have a tooltip.
Comment 3 Nikita Vasilyev 2020-08-13 16:49:20 PDT
When VoiceOver is enabled, it reads "More toolbar items".
I think we should add aria-label with "More tab items" or, perhaps, "More tabs".
Comment 4 Devin Rousso 2020-08-13 17:06:07 PDT
(In reply to Nikita Vasilyev from comment #2)
> On Big Sur, Safari and Finder both show ">>" icon for their toolbars and it doesn't have a tooltip.

Regardless of whether the rest of the system has a tooltip, I think we should have one.  Our tab bar is different enough from the rest of the system that we should be as clear as possible wherever we can be.
Comment 5 Patrick Angle 2020-08-14 08:31:29 PDT
Created attachment 406593 [details]
Patch
Comment 6 Devin Rousso 2020-08-14 10:11:23 PDT
Comment on attachment 406593 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=406593&action=review

> Source/WebInspectorUI/ChangeLog:9
> +        * UserInterface/Views/PinnedTabBarItem.js: `displayName` is now used to set the `aria-label` for pinned tabs

This is going to "clash" with the Search Tab and Settings Tab which already have `title` attributes.  I think a simpler solution would just be to provide a `title` argument when creating the overflow tab picker:
```diff
-this._tabPickerTabBarItem = new WI.PinnedTabBarItem(tabPickerRepresentedObject, "Images/TabPicker.svg", WI.UIString("Show hidden tabs"));
+const tabPickerDisplayName = null;
+this._tabPickerTabBarItem = new WI.PinnedTabBarItem(tabPickerRepresentedObject, "Images/TabPicker.svg", tabPickerDisplayName, WI.UIString("Show hidden tabs"));
```
Comment 7 Patrick Angle 2020-08-14 10:51:39 PDT
Created attachment 406607 [details]
Patch
Comment 8 Devin Rousso 2020-08-14 10:57:50 PDT
Comment on attachment 406607 [details]
Patch

r=me, thanks for iterating :)
Comment 9 Nikita Vasilyev 2020-08-14 11:10:09 PDT
Comment on attachment 406607 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=406607&action=review

> Source/WebInspectorUI/ChangeLog:3
> +        Web Inspector: add aria-label for [>>] overflow tab picker

This doesn't correspond to the actual change. Please retitle the bug in Bugzilla before generating the changelog going forward.
Comment 10 EWS 2020-08-14 11:24:59 PDT
Committed r265682: <https://trac.webkit.org/changeset/265682>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 406607 [details].