Menu highlight from keyboard breaks on webkitgtk

[apicize]

Steps to reproduce

Steps:

1. Open this link (https://codesandbox.io/p/sandbox/quirky-bartik-8wk4ff?file=/src/index.tsx) in a webkitgtk browser (ex. Epiphany/Web on on GNU Linux,
   2.Click on Age Select dropdown, press cursor up/down keys, highlight appears and selection moves with keys
   3.Click on Test button (which does nothing)
2. Click on Age Select dropdown again, press cursor up/down keys, highlight no longer moves with keys, but the selection, still does, as evidenced when hitting Enter

Current behavior

When clicking the Test button and then the Age Select dropdown, the highlight does not move with cursor up/down keys

Expected behavior

The highlight should appear consistently in a Select dropdown, even if another control is clicked.

Context

Consistent highlight in Select dropdown (and menus) after another MUI control is clicked in a webkitgtk browser. Note that this issue does not appear to be an issue in Chrome or Firefox. The reason I care about webkitgtk is that it used by Tauri.

Your environment

System: OS: Linux 6.8 Linux Mint 21.3 (Virginia) Binaries: Node: 20.18.0 - /usr/bin/node npm: 10.9.0 - /usr/bin/npm pnpm: 9.5.0 - /usr/bin/pnpm Browsers: Chrome: 131.0.6778.69 npmPackages: @emotion/react: latest => 11.13.3 @emotion/styled: latest => 11.13.0 @mui/core-downloads-tracker: 6.1.7 @mui/material: latest => 6.1.7 @mui/private-theming: 6.1.7 @mui/styled-engine: 6.1.7 @mui/system: 6.1.7 @mui/types: 7.2.19 @mui/utils: 6.1.7 @types/react: latest => 18.3.12 react: latest => 18.3.1 react-dom: latest => 18.3.1 typescript: latest => 5.6.3

Issue manifests in Epiphany (Gnome Web) at https://codesandbox.io/p/sandbox/quirky-bartik-8wk4ff?file=/package.json:3,1-10,27

Search keywords: webkitgtk highlight