Phenomenon
When a contenteditable element has the CSS isolation: isolate property, it creates a new stacking context. This may affect how selection handles and IME candidate windows are positioned relative to the contenteditable.
Reproduction example
- Create a contenteditable div with
isolation: isolate. - Use an IME to compose text.
- Observe the position of the IME candidate window.
- Try to select text and observe selection handles.
- Compare with a contenteditable without isolation.
Observed behavior
- In Safari on macOS, isolation may affect IME candidate window positioning.
- Selection handles may be positioned incorrectly.
- Z-index stacking may be affected.
- Overlays may not appear correctly.
Expected behavior
- CSS isolation should not affect contenteditable UI elements.
- IME candidate windows should be positioned correctly.
- Selection handles should appear in the right place.