tabindex attribute does not control focus order correctly
OS: Windows 11 · Device: Desktop or Laptop Any · Browser: Edge 120.0 · Keyboard: US
Open case →Scenario
tabindex attribute does not control focus order correctly
When multiple contenteditable regions have `tabindex` attributes, the tab order may not follow the `tabindex` values correctly in Edge. The focus order may be inconsistent or incorrect.
focus
Scenario ID
scenario-tabindex-behavior
Details
When multiple contenteditable regions have tabindex attributes, the tab order may not follow the tabindex values correctly in Edge. The focus order may be inconsistent or incorrect.
References
- Web.dev: Focus - Focus order and tabindex best practices
- BBC GEL: Focus - Focus order guidelines
- Microsoft Learn: Test tab key source order viewer - Edge DevTools accessibility tools
Scenario flow
Visual view of how this scenario connects to its concrete cases and environments. Nodes can be dragged and clicked.
Variants
Each row is a concrete case for this scenario, with a dedicated document and playground.
| Case | OS | Device | Browser | Keyboard | Status |
|---|---|---|---|---|---|
| ce-0062-contenteditable-with-tabindex | Windows 11 | Desktop or Laptop Any | Edge 120.0 | US | draft |
Cases
Open a case to see the detailed description and its dedicated playground.
Related Scenarios
Other scenarios that share similar tags or category.
Tags: focus
autofocus attribute does not work on contenteditable
The autofocus attribute, which automatically focuses form inputs on page load, does not work on contenteditable elements. There is no built-in way to automatically focus a contenteditable region when a page loads.
1 case
Tags: focus
Focus is lost when clicking on certain elements within contenteditable
When a contenteditable region contains interactive elements (buttons, links, etc.), clicking on these elements causes the contenteditable to lose focus. This interrupts the editing flow and may cause the caret to disappear.
1 case
Tags: focus
Programmatic focus selects all content
In Chrome and Safari, calling focus() on a contenteditable div can select the entire content instead of placing the cursor at the beginning, as observed in Firefox and IE.
1 case
Tags: focus
Fullscreen API may affect contenteditable focus and selection
When a contenteditable element enters or exits fullscreen mode using the Fullscreen API, focus and selection may be lost. The caret position may reset, and editing may be disrupted.
1 case
Tags: focus
Nested contenteditable elements cause focus and selection issues
When a contenteditable element contains another contenteditable element, focus behavior becomes unpredictable. Clicking on the nested element may not properly focus it, and selection ranges may span across both elements incorrectly.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.