Cursor nav loop in contenteditable with mixed rtl and ltr text

UNCONFIRMED
Unassigned

Status

()

Core
Editor
UNCONFIRMED
2 years ago
2 years ago

People

(Reporter: Tom Wuttke, Unassigned)

Tracking

44 Branch
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: dom-triaged)

(Reporter)

Description

2 years ago
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.97 Safari/537.36

Steps to reproduce:

See http://codepen.io/anon/pen/EPeOGY

Or make a page with this html:
<!DOCTYPE html><html><head></head><body>
Focus the editable, and press right arrow over and over.
<div dir="rtl" contenteditable="true">Englishעברית</div>
</body></html>

Focus the editable, and press right arrow over and over.


Actual results:

Cursor loops over the rtl word.


Expected results:

Cursor should stop at the right edge.

Note - if you add other html before or after on the page, the bug often stops happening. Also, I have seen it happen on the first word in a rtl contenteditable. 

This was happening consistently on a complex page for me, but I was unable to determine the cause. A strange workaround that prevented it was to place a dummy <div style="inline">&nbsp;</div> node before and after the contenteditable, but that is obviously not ideal. Using a span did not work, neither did a div without the inline style, nor the &nbsp; by itself.

Updated

2 years ago
Component: Untriaged → Editor
Product: Firefox → Core
Whiteboard: dom-triaged
You need to log in before you can comment on or make changes to this bug.