1711057 - :focus-visible does not match for programmatic keyboard focus after mouse click

Status: VERIFIED FIXED

(Core :: DOM: UI Events & Focus Handling, defect, P3)

Description

[Nolan Lawson]

Attachment: Repro HTML file

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:88.0) Gecko/20100101 Firefox/88.0

Steps to reproduce:

1. Go to https://bl.ocks.org/nolanlawson/raw/0a0f8531087f9031d219028532d4054a/
2. Click the button with the mouse
3. Press the arrow down key on the keyboard

Actual results:

A red focus outline is not visible.

Expected results:

A red focus outline should be visible on the first item in the feed list.

This issue is only reproducible in Firefox (including Nightly 90.0a1). It does not repro in Chrome or in Safari Technology Preview 14.2 with the ":focus-visible pseudo-class" runtime flag set.

The issue seems to be that Firefox's :focus-visible heuristics do not treat programmatic keyboard focus the same as the Tab key. On this same page, you can click the button with the mouse and press Tab, and the focus outline is shown.

Real-world use case: in my social media app (https://pinafore.social), I implement keyboard shortcuts to change focus for articles in the feed. But if the user is a mixed mouse-keyboard user who clicks on something with the mouse and then attempts to use keyboard shortcuts, then the focus outline is not shown.

Comment 1

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

The Bugbug bot thinks this bug should belong to the 'Core::DOM: UI Events & Focus Handling' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1711057 - Consider programmatic focus during keyboard input as key focus. r=smaug

Comment 3

[Emilio Cobos Álvarez (:emilio)]

Seems reasonable.

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/fb2578c42229
Consider programmatic focus during keyboard input as key focus. r=smaug

Comment 5

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/29017 for changes under testing/web-platform/tests

Comment 6

[Andreea Pavel [:apavel]]

https://hg.mozilla.org/mozilla-central/rev/fb2578c42229

Comment 7

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot

Comment 8

[Giorgia Nichita, Release Desktop QA]

I have reproduced this on an affected Nightly build 90.0a1 (2021-05-13).

Confirming this issue as verified fixed on Win 10x64, Ubuntu 20.04 and macOS 10.15, using Firefox 90.0b5 (2021-06-08).
Thanks!