🐛Bug: Weird focus behavior on anchor element inside dialog

[newtonyan]

Describe the bug
When an anchor element is put inside the dialog (modal = true), the default focus ring of my browser doesn't show up when I TAB through the elements. But it can match the class focus-visible:text-red-500 and become red text.

However, if I force the :focus-visible state in the dev tool, the focus ring shows up and the text turns red.

To Reproduce
Steps to reproduce the behavior:

1. Copy the example code from https://www.radix-svelte.com/docs/dialog
2. Add <a href="/" class="focus-visible:text-red-500">Anchor</a> before the fieldset
3. Open the dialog
4. Tab through the elements

Current Behavior
The text inside the anchor elment became red but the default focus outline from the browser doesn't show up.

Expected behavior
The text inside the anchor elment should become red and the anchor element should have a default focus outline from the browser.

Desktop:

• OS: macOS Ventura 13.4
• Browser: Chrome
• Version: 114.0.5735.198