Bug 215342

Summary:

Web Inspector: add aria-label for [>>] overflow tab picker

Product:

WebKit

Reporter:

Devin Rousso <hi>

Component:

Web Inspector

Assignee:

Patrick Angle <pangle>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

hi, inspector-bugzilla-changes, nvasilyev, pangle, webkit-bug-importer

Priority:

Keywords:

GoodFirstBug, InRadar

Version:

WebKit Nightly Build

Hardware:

All

OS:

All

Attachments:

Description	Flags
Patch	none
Patch	none

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].