<slot> element with tabindex="-1" causes slotted elements that are usually focusable to not be focusable.

[KonnorRogers]

What is the issue with the HTML Standard?

When creating a Web Component and using a <slot> element in the shadow DOM, if you use a <slot tabindex="-1"> any focusable slotted elements will no longer be focusable.

This can be observed in all 3 browsers here:

https://codepen.io/paramagicdev/pen/mdvzgQY

Tested with the following browsers:

Chrome: 119
Firefox: 120
Safari: 16.4

OS: MacOS Venture 13.3

I'm not sure if this is a gap in the spec, expected behavior, or a "bug".

I stumbled on it today and I was recommended to report it here by @keithamus

Additional notes

This feels unintended because parents with a tabindex should not affect their children, unlike inert.

Note that applying tabindex="-1" to an element doesn't affect its children;

https://web.dev/articles/control-focus-with-tabindex