W3C home > Mailing lists > Public > public-css-archive@w3.org > December 2020

Re: [csswg-drafts] [css-selectors-4] browser focus styles and focus-visible, example 38 (#4278)

From: Manuel Rego Casasnovas via GitHub <sysbot+gh@w3.org>
Date: Mon, 28 Dec 2020 09:32:31 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-751649328-1609147950-sysbot+gh@w3.org>
I believe that the problem might be that Chromium has implemented something different than what the initial idea was, and that's why this confusion arise. Maybe I'm wrong but let's me explain my thoughts next.

The [spec says](https://drafts.csswg.org/selectors/#the-focus-visible-pseudo):
> The :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the user agent determines via heuristics that the focus should be made evident on the element.

So let's use again a very simple example:
<div tabindex="1">Click me!</div>

When you click on that element Chromium (and WebKit) shows an outline, however in Chromium it doesn't match `:focus-visible`. This seems to be a contradiction to the initial text on the spec.
In Firefox it doesn't show any outline, so `:focus-visible` doesn't match either, but that seems to be the expected behavior.

I guess Chromium is implementing this other part of the spec:
> If the user interacts with the page via a pointing device, such that the focus is moved to a new element which does not support user input, the newly focused element should not match :focus-visible.

So if Chromium decides to change the UA sheet to use `:focus-visible` there'll be a change of behavior in those cases, when you click an element like the one in the example the outline would be gone after the change in the UA sheet.
Maybe that's what we want in order to look for interoperability in when the focus ring is shown or not.

It'd be nice to understand why Chromium did this and why the UA sheet is still not using `:focus-visible`.

GitHub Notification of comment by mrego
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4278#issuecomment-751649328 using your GitHub account

Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Monday, 28 December 2020 09:32:33 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:24 UTC