2054504 - Fluent-ize the "Group my tabs" panel and complete an accessibility pass

Status: VERIFIED FIXED

(Core :: Machine Learning: Frontend, enhancement, P1)

Description

[:jlewis]

Migrate all user-facing strings in the "Group my tabs" panel and its flyout from hard-coded English to Fluent:

• Header, "Create all suggested groups", section labels ("Suggested groups", "Recent groups"), "Create group", the per-tab count, per-group "Undo", and the "Undo last group(s)" footer with correct pluralization.
• The empty state ("No suggestions right now") and loading state ("Finding groups...").

Accessibility pass:

• Appropriate roles for the panel and flyout.
• Keyboard navigation and focus management.
• A keyboard-accessible equivalent for the currently mouse-only hover flyout.
• Screen-reader labels for the color tiles and group-color dots.

Tests: browser-chrome for keyboard navigation and string presence.

Comment 1

[:jlewis]

Attachment: Bug 2054504 - Render the "Group my tabs" panel with Lit, localize it, and complete an accessibility pass

Comment 2

[Ed Lee :Mardak]

as per bug 2054501, this feature is english-only so it doesn't need localization but we should be using fluent

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/5ad97192729f
https://hg.mozilla.org/integration/autoland/rev/1a85802bb782
Render the "Group my tabs" panel with Lit, localize it, and complete an accessibility pass r=desktop-theme-reviewers,fluent-reviewers,Gijs,bolsson,jswinarton,dao

Comment 4

[amarc]

https://hg.mozilla.org/mozilla-central/rev/1a85802bb782

Comment 5

[Phabricator Automation]

firefox-beta Uplift Approval Request

• User impact if declined/Reason for urgency: Core part of Smart Window 'Auto Tab Grouping' feature.
• Code covered by automated testing?: yes
• Fix verified in Nightly?: no
• Needs manual QE testing?: yes
• Steps to reproduce for manual QE testing: 1) Set prefs to true:

browser.smartwindow.autoTabGrouping.enabled
SmartTabGroupingManager.isEnabled

2. Open Smart Window > open new Auto Tab Grouping button > verify menu opens and works as expected

• Risk associated with taking this patch: medium
• Explanation of risk level: Includes augmentation to the Auto Tab Grouping feature, but is pref gated for its v0.
• String changes made/needed?: Strings are only in locales-preview
• Is Android affected?: no

Comment 6

[:jlewis]

Attachment: Bug 2054504 - Render the "Group my tabs" panel with Lit, localize it, and complete an accessibility pass

Renders the panel and flyout as light-DOM Lit custom elements
(smartwindow-group-tabs-card / -flyout), moves the panel strings to Fluent (in
a preview/ file, since the feature is still in development), and adds an
accessibility pass:

• the card is role="dialog" with aria-labelledby; focus moves into it on open
  and returns to the toolbar button on Escape
• suggestions are focusable buttons; focusing one opens its flyout (the
  keyboard equivalent of hovering)
• decorative tiles, color dots, and the chevron are aria-hidden
• suggestion rows and the flyout expose Fluent-localized accessible names

Demo (no finalized designs yet): https://auto-tab-grouping.netlify.app sw0626

Original Revision: https://phabricator.services.mozilla.com/D312298

Comment 7

[Pulsebot]

https://github.com/mozilla-firefox/firefox/commit/950b4b288d98
https://hg.mozilla.org/releases/mozilla-beta/rev/929485a6fe0d

Comment 8

[Rares Doghi, Desktop QA]

Verified as fixed in our latest Beta 154.0b10 and our latest Nightly 155.0a1 (2026-08-12), However I did notice a few accessibility issues related to the Organize Tabs panel. I will log them separately.