Skip to content

Constrained Tabbing doesn't work reliably with all browsers #45903

@afercia

Description

@afercia

Description

Likely, this regressed with the component refactoring in #34836

Constrained Tabbing seems to work well with webkit-based browsers. However. it's broken with Firefox. To my understanding, the current implementation relies on the way browsers implement specific behaviors. Specifically, the amount of time browsers take to actually move focus when pressing the Tab key. That may also vary dependiing on a multitude of factors such as the operating system, the hardware, etc. Basically, the implementation relies on something that we don't have under control and as such is less then ideal.

Step-by-step reproduction instructions

  • Use Chrome.
  • Go to the Post editor.
  • Click the Tools button in the top bar.
  • Press the Tab key multiple times to cycle through the two buttons (Edit and Select) within the Tools popover.
  • Observe everything work as expected.
  • Test also with Shift+Tab. Everything work as expected.
  • Keep the Tab key pressed to cycle through the buttons at full speed :) This is to test that there are no timings issue with Chrome. Everything work as expected.
  • Optionally repeat the same test with the Options > Preferences modal.

Repeat the test with Firefox.

  • Observe that at some point, tabbing with the Tab key exits the Tools panel.
  • This happens randomly.
  • To force the failure, keep the Tab key pressed.
  • Repeat the test with the Options > Preferences modal.
  • Also in this case, it may happen randomly. It can be reproduced almost always by pressing Shit + Tab. At tome point, focus will go back to the Options popover.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).[Package] Compose/packages/compose[Type] BugAn existing feature does not function as intended[Type] RegressionRelated to a regression in the latest release

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions