| <html> |
| <head> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| |
| function testLtrCaretPosition(elementId, caretPosition) { |
| test(() => { |
| assert_own_property(window, 'textInputController'); |
| e = document.getElementById(elementId); |
| e.focus(); |
| var caretRect = textInputController.firstRectForCharacterRange(0, 0); |
| assert_equals(caretRect[0], caretPosition); |
| }, `${elementId} ${caretPosition}`); |
| } |
| |
| function testRtlCaretPosition(elementId, caretPosition) { |
| test(() => { |
| assert_own_property(window, 'textInputController'); |
| e = document.getElementById(elementId); |
| e.focus(); |
| // Asserts the visual location of the text's right edge, whose logical |
| // offset differs with the bidi caret affinity flag. |
| var caretOffset = internals.runtimeFlags.bidiCaretAffinityEnabled ? 1 : 0; |
| var caretRect = textInputController.firstRectForCharacterRange(caretOffset, 0); |
| assert_equals(caretRect[0], caretPosition); |
| }, `${elementId} ${caretPosition}`); |
| } |
| |
| function runTest() { |
| test(() => { |
| assert_own_property(window, 'textInputController'); |
| var e = document.getElementById("right-align-div"); |
| e.focus(); |
| document.execCommand('selectAll'); |
| document.execCommand('insertText', false, 'x'); |
| var caretRect = textInputController.firstRectForCharacterRange(1, 0); |
| assert_equals(caretRect[0], 208); |
| }, 'right-align-div 208 after typing'); |
| |
| testRtlCaretPosition("rtl-div", 208); |
| testRtlCaretPosition("0-right-padding-rtl-textarea", 206); |
| testLtrCaretPosition("ltr-div", 9); |
| testLtrCaretPosition("ltr-textarea", 10); |
| testLtrCaretPosition("no-wrapping-right-align-div", 208); |
| testRtlCaretPosition("no-wrapping-rtl-div", 208); |
| testRtlCaretPosition("no-wrapping-0-right-padding-rtl-textarea", 206); |
| testLtrCaretPosition("no-wrapping-ltr-div", 9); |
| testLtrCaretPosition("no-wrapping-ltr-textarea", 10); |
| } |
| |
| </script> |
| </head> |
| <body> |
| <br> |
| Right aligned div. |
| <br> |
| <div CONTENTEDITABLE id="right-align-div" style="text-align: right; width:200px; border: solid thin;"></div> |
| <br> |
| RTL div. |
| <br> |
| <div CONTENTEDITABLE id="rtl-div" style="direction: rtl; width:200px; border: solid thin; ">a</div> |
| <br> |
| 0px right padding RTL textarea. |
| <br> |
| <textarea id="0-right-padding-rtl-textarea" style="direction:rtl; padding: 1px 0px 1px 1px; width:200px">a</textarea> |
| <br> |
| LTR div and textarea. |
| <br> |
| <div CONTENTEDITABLE id="ltr-div" style="width:200px; border: solid thin; ">a</div> |
| <br> |
| <textarea id="ltr-textarea" style="padding: 1px 0px 1px 1px; width:200px">a</textarea> |
| <br> |
| NO WRAPPING |
| <br> |
| No wrapping right aligned div. |
| <br> |
| <div CONTENTEDITABLE id="no-wrapping-right-align-div" style="white-space:nowrap; text-align: right; width:200px; border: solid thin;"></div> |
| <br> |
| No wrapping RTL div. |
| <br> |
| <div CONTENTEDITABLE id="no-wrapping-rtl-div" style="white-space:nowrap; direction: rtl; width:200px; border: solid thin; ">a</div> |
| <br> |
| No wrapping 0px right padding RTL textarea. |
| <br> |
| <textarea id="no-wrapping-0-right-padding-rtl-textarea" style="white-space:nowrap; direction:rtl; padding: 1px 0px 1px 1px; width:200px">a</textarea> |
| <br> |
| No wrapping LTR div and textarea. |
| <br> |
| <div CONTENTEDITABLE id="no-wrapping-ltr-div" style="white-space:nowrap; width:200px; border: solid thin; ">a</div> |
| <br> |
| <textarea id="no-wrapping-ltr-textarea" style="white-space:nowrap; padding: 1px 0px 1px 1px; width:200px">a</textarea> |
| <br> |
| <ul id="console"></ul> |
| </body> |
| <script> runTest(); </script> |
| </html> |
