:focus styles stay around after mouse click - Implement accessibleFocus?

[justinshreve]

While implementing some :focus styles per the designs, I've noticed that the styles linger after clicking with the mouse. From doing some research, it seems like this is a quirk with chrome. In some instances this is OK, but if there is an element that should have an style applied after selection (like the activity panel), the focused style will override it until you click away.

Davide pointed me to Calypo's handling of this. accessibleFocus. It applies a class that can be used for keyboard focus only.

It seems like Gutenberg has had some discussion of this in the past and has opted to not do this.

I personally think we should do something along the lines of Calypo's handling. Focus styles are important, but for mouse navigation I think the hints from hovering work. I wanted to raise this for some discussion (and get @ryelle's input) before doing anything though.

[belcherj]

@justinshreve is this still and issue?

[Aljullu]

We could also consider the new pseudo-selector :focus-visible. Browser support is still low but there is a JS polyfill.

I have never used it, but just wanted to point out that there is a native solution before we try to implement our own.

[psealock]

I'm going to close this one because it hasn't been a priority, but please re-open if its still important.