[Webkit-unassigned] [Bug 246591] New: :focus-visible does not work after calling the event.preventDefault() of the keyboard event

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=246591

            Bug ID: 246591
           Summary: :focus-visible does not work after calling the
                    event.preventDefault() of the keyboard event
           Product: WebKit
           Version: WebKit Local Build
          Hardware: Unspecified
                OS: Linux
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: UI Events
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: weijarz at gmail.com

OS: ArchLinux/GNOME
Webkit: Lastest version

To reproduce:
1. Open below html page.
2. Click `elB` using mouse, now `elB` text color is blue and no blue border.
3. Press key 'a', now `elA` text color is blue and have a blue border.
4. Press key 'b', now `elB` text color is blue, BUT it's `:focus-visible` css rule (blue border) does not work.

It is displayed correctly in Firefox and Chrome, except for Webkit.


Html page source:
```
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<style>
#elA, #elB { margin: 1rem; height: 100px; border: 2px solid #ccc; font-size: 5rem; }
#elA:focus,
#elB:focus { color: blue; }
#elA:focus-visible,
#elB:focus-visible { outline: 2px solid blue; }
</style>

<div id="elA" tabindex="0">elA</div>
<div id="elB" tabindex="0">elB</div>

<script>
document.addEventListener('keydown', ev => {
  if (ev.key === 'a') {
    elA.focus()
  } else if (ev.key === 'b') {
    ev.preventDefault()
    elB.focus()
  }
})
</script>

```

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20221016/0ee56286/attachment.htm>