JS.focus_first will not focus non-interactive elements with tabindex="0"

[jearbear]

Environment

• Elixir version (elixir -v): 1.17.3
• Phoenix version (mix deps): 1.7.18
• Phoenix LiveView version (mix deps): 1.0.1
• Operating system: Mac OS
• Browsers you attempted to reproduce this bug on (the more the merrier): Chrome
• Does the problem persist after removing "assets/node_modules" and trying again? Yes/no: Yes

Actual behavior

I have a custom select input that has a root div tag with tabindex=0 to allow it to be focused. However, it seems that JS.focus_first will not focus this since divs are not considered focusable if interactiveOnly is true.

The current implementation will only consider non interactive elements if el.tabIndex > 0, but my understanding is that using values other than 0 or -1 is discouraged. I did confirm that using tabindex="1" works, but this makes the focus order inconsistent with the element layout order. Should the check be el.tabIndex >= 0 instead?

Expected behavior

Elements with tabindex="0" set should be focused by JS.focus_first.