Problem/Motivation
initially discovered here: #2977587-120: Improve block listing in Layout Builder by hiding uncommon block plugins
When jQuery UI traps focus inside a dialog, it determines the first and last focusable element, and those become the tabbing constraints.
Unfortunately, it does not identify <details> elements as focusable unless the tag includes a tabindex attribute. This tabindex attribute should not be necessary.
In the dialog, if a <details> element is followed by an element that jQuery UI considers tabbable, then <details> will be tabbable since <details> is between the constraint boundaries.
To reproduce open a dialog with <details>elements that contain no focusable elements.
<details>elements that contain no focusable elements- No focusable elements appearing after
<summary>or<details>
Proposed resolution
I submitted a PR that fixes the issue to jquery-ui https://github.com/jquery/jquery-ui/pull/1885.
If it is desirable to have this addressed before the fix is added to jquery-ui + that update is added to Drupal, this can be done. It would require overriding $.ui.focusable
Remaining tasks
Determine if its better to wait for the jquery-ui fix, or to override $.ui.focusable
User interface changes
Tabbing within a jQuery UI dialog will consistently include <details> without the need for them to be followed by other interactive elements.
API changes
NA
Data model changes
NA
Release notes snippet
NA