2050846 - Double border on keyboard navigation for Search Engine Switcher engines in Alpenglow theme

Status: VERIFIED FIXED

(Toolkit :: Themes, defect, P2)

Description

[Petruta Horea [:phorea]]

Attachment: double border

Notes
Reproduces also when Nova is enabled.

Found in

• Firefox 154.0a1

Affected versions

• Firefox Nightly 154.0a1;
• Firefox 153 beta 4;
• Firefox 152.0.3 RC.

Tested platforms

• Affected platform: Windows 11, Ubuntu 24, macOS 15;
• Unaffected platforms: N/A;

Steps to reproduce

1. Go to about:addons > Themes and enable Alpenglow theme
2. Open Search Engine Switcher from address bar
3. Use Down arrow to navigate between the listed search engines

Expected result

• Uncertain what the expected result is: Before bug 1998985, hover and keyboard navigation on search engines from Search Mode Switcher had the same visual effect. Now, the keyboard navigation displays a border. If this is expected, Alpenglow should not have a double border. Otherwise, keyboard selection should have the same effect as hover, with a slightly different color.

Actual result

• Alpenglow theme for all platforms and System Default theme - Ubuntu display a double border on keyboard selection.

Regression range

• Pushlog

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

:mbeier, since you are the author of the regressor, bug 1998985, could you take a look? Also, could you set the severity field?

For more information, please visit BugBot documentation.

Comment 2

[Daisuke Akatsuka (:daisuke)]

Hi Dão!

I looked into this one. The focus ring here is shown via :focus-visible. In panel-item.css we only set outline-offset and none of the other outline properties, so outline-style ends up as auto.
https://searchfox.org/firefox-main/rev/a07b2cb8ff33387a81968a7ed9d59ebdc4dad607/toolkit/content/widgets/panel-list/panel-item.css#47-49

For auto, Theme intentionally draws a two-tone double ring (PaintAutoStyleOutline: an inner 2px stroke plus an outer 1px stroke).
https://searchfox.org/firefox-main/rev/a07b2cb8ff33387a81968a7ed9d59ebdc4dad607/widget/Theme.cpp#1323-1332

It uses the accent color, but Alpenglow doesn't specify one, so the default colors are used (primary: blue, secondary: white). That's why it shows up like this here.
So, this might not really be a bug, but rather intentional behavior. How do you think we should handle it?
FWIW, setting outline-style to solid gives single white line border with this theme.

Comment 3

[Moritz Beier [:mbeier]]

Thanks Daisuke, I also just looked into it but could not figure out why it didn't respect the outline-color property.

Comment 4

[Dão Gottwald [:dao]]

(In reply to Daisuke Akatsuka (:daisuke) from comment #2)

Hi Dão!

I looked into this one. The focus ring here is shown via :focus-visible. In panel-item.css we only set outline-offset and none of the other outline properties, so outline-style ends up as auto.
https://searchfox.org/firefox-main/rev/a07b2cb8ff33387a81968a7ed9d59ebdc4dad607/toolkit/content/widgets/panel-list/panel-item.css#47-49

auto is a safe default for the web, erring on the side of making sure it's visible. We don't need that here. I think outline: var(--focus-outline); outline-offset: var(--focus-outline-inset); should do the trick?

Comment 5

[Daisuke Akatsuka (:daisuke)]

Thank you very much, Moritz and Dão!

(In reply to Dão Gottwald [:dao] from comment #4)

I think outline: var(--focus-outline); outline-offset: var(--focus-outline-inset); should do the trick?

Okay, I will try it.

Comment 6

[Daisuke Akatsuka (:daisuke)]

Attachment: Bug 2050846 - Set outline style explicitly for :focus-visible in panel-item

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/159f9ad11f36
https://hg.mozilla.org/integration/autoland/rev/93510f4e5ae6
Set outline style explicitly for :focus-visible in panel-item r=desktop-theme-reviewers,dao

Comment 8

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/93510f4e5ae6

Comment 9

[BugBot [:suhaib / :marco/ :calixte]]

The patch landed in nightly and beta is affected.
:daisuke, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
  • See https://wiki.mozilla.org/Release_Management/Requesting_an_Uplift for documentation on how to request an uplift.
• If no, please set status-firefox153 to wontfix.

For more information, please visit BugBot documentation.

Comment 10

[Dão Gottwald [:dao]]

Attachment: Bug 2050846 - Set outline style explicitly for :focus-visible in panel-item

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

Comment 11

[Phabricator Automation]

firefox-beta Uplift Approval Request

• User impact if declined/Reason for urgency: Recent cosmetic regression from bug 1998985
• Code covered by automated testing?: no
• Fix verified in Nightly?: yes
• Needs manual QE testing?: yes
• Steps to reproduce for manual QE testing: see comment 0
• Risk associated with taking this patch: low
• Explanation of risk level: Trivial CSS fix
• String changes made/needed?: none
• Is Android affected?: no

Comment 12

[Pulsebot]

https://github.com/mozilla-firefox/firefox/commit/cd888e52f513
https://hg.mozilla.org/releases/mozilla-beta/rev/2c01e0b40ad5

Comment 13

[Ardelean Oana, Desktop Test Engineering [:oardelean]]

Reproducible on a 2026-06-26 Firefox Nightly build on Windows 11.

Verified as fixed on Firefox Nightly 154.0a1 on Windows 11, macOS 13, Ubuntu 24.

Comment 14

[Ardelean Oana, Desktop Test Engineering [:oardelean]]

Verified as fixed on Firefox 153.0b13 (treeherder build) on Windows 11, macOS 13, Ubuntu 22.