Bug 258987

Summary:	Clicking a button, then calling `.focus()` on another button via JS causes `:focus-visible` to not fire.
Product:	WebKit	Reporter:	Konnor Rogers <konnor5456>
Component:	CSS	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Normal	CC:	akeerthi, cory, fotis.papadogeorgopoulos, koivisto, rego, webkit-bug-importer
Priority:	P2	Keywords:	InRadar
Version:	Safari 16
Hardware:	Mac (Apple Silicon)
OS:	macOS 13

Description Konnor Rogers 2023-07-07 10:48:27 PDT

## Problem

When implementing a focus-trap by using programmatic `.focus()` calls on elements, `:focus-visible` pseudo-selectors don't propagate to the element. Only `:focus` and `:focus-within`.

`:focus-visible` disappears after clicking a <button> and then calling `.focus()` in Safari 16.4

The above works as expected in Chrome 114.0.5735.198, Edge 114.0.1823.67, and Firefox 114.0.2 

## Reproduction

https://codepen.io/paramagicdev/pen/xxQXWbq?editors=1111

## Similar bugs

I think this may be a duplicate of: https://bugs.webkit.org/show_bug.cgi?id=246591

Based on the above bug, the issue may also have something to do with `e.preventDefault()`

Comment 1 Radar WebKit Bug Importer 2023-07-14 10:49:23 PDT

<rdar://problem/112276014>