| <!DOCTYPE html> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <textarea dir="auto" style="font-size: 20px; width: 20ex"></textarea> |
| <script> |
| // Tests various scenarios for caret position when direction is auto. |
| // Since Hebrew letters are not covered by Ahem font, we can't test the caret |
| // positions at exact pixels. We test their relative ordering instead. |
| |
| const textarea = document.querySelector('textarea'); |
| textarea.value = '\u05d0!\nhello\u05d1\u05d2bye '; |
| textarea.focus(); |
| |
| // <textarea> looks like: |
| // +-----------------+ |
| // | !A| |
| // |helloCBbye_ | |
| // +-----------------+ |
| |
| const length = textarea.value.length; |
| const caretPositions = []; |
| |
| test(() => { |
| assert_not_equals( |
| window.internals, undefined, 'This test requires textInputController'); |
| for (let i = 0; i <= length; ++i) { |
| textarea.setSelectionRange(i, i); |
| caretPositions.push(internals.absoluteCaretBounds()); |
| } |
| }, '0. Get all caret positions'); |
| |
| test(() => { |
| assert_equals(caretPositions.length, 15); |
| const firstLineY = caretPositions[0].y; |
| const secondLineY = caretPositions[3].y; |
| assert_less_than(firstLineY, secondLineY); |
| assert_equals(caretPositions[0].y, firstLineY, '1-0'); |
| assert_equals(caretPositions[1].y, firstLineY, '1-1'); |
| assert_equals(caretPositions[2].y, firstLineY, '1-2'); |
| assert_equals(caretPositions[3].y, secondLineY, '1-3'); |
| assert_equals(caretPositions[4].y, secondLineY, '1-4'); |
| assert_equals(caretPositions[5].y, secondLineY, '1-5'); |
| assert_equals(caretPositions[6].y, secondLineY, '1-6'); |
| assert_equals(caretPositions[7].y, secondLineY, '1-7'); |
| assert_equals(caretPositions[8].y, secondLineY, '1-8'); |
| assert_equals(caretPositions[9].y, secondLineY, '1-9'); |
| assert_equals(caretPositions[10].y, secondLineY, '1-10'); |
| assert_equals(caretPositions[11].y, secondLineY, '1-11'); |
| assert_equals(caretPositions[12].y, secondLineY, '1-12'); |
| assert_equals(caretPositions[13].y, secondLineY, '1-13'); |
| assert_equals(caretPositions[14].y, secondLineY, '1-14'); |
| }, '1. Caret positions are in the correct lines'); |
| |
| test(() => { |
| assert_equals(caretPositions.length, 15); |
| const firstLineLeftmostX = caretPositions[2].x; |
| |
| // caretPositions[2] is at the left side of '!' in the first line |
| // before the line break, illustrated as below: |
| // +-----------------+ |
| // | |!A| |
| // |helloCBbye_ | |
| // +-----------------+ |
| |
| assert_greater_than(caretPositions[0].x, firstLineLeftmostX, '2-0'); |
| assert_greater_than(caretPositions[1].x, firstLineLeftmostX, '2-1'); |
| assert_less_than(caretPositions[3].x, firstLineLeftmostX, '2-3'); |
| assert_less_than(caretPositions[4].x, firstLineLeftmostX, '2-4'); |
| assert_less_than(caretPositions[5].x, firstLineLeftmostX, '2-5'); |
| assert_less_than(caretPositions[6].x, firstLineLeftmostX, '2-6'); |
| assert_less_than(caretPositions[7].x, firstLineLeftmostX, '2-7'); |
| assert_less_than(caretPositions[8].x, firstLineLeftmostX, '2-8'); |
| assert_less_than(caretPositions[9].x, firstLineLeftmostX, '2-9'); |
| assert_less_than(caretPositions[10].x, firstLineLeftmostX, '2-10'); |
| assert_less_than(caretPositions[11].x, firstLineLeftmostX, '2-11'); |
| assert_less_than(caretPositions[12].x, firstLineLeftmostX, '2-12'); |
| assert_less_than(caretPositions[13].x, firstLineLeftmostX, '2-13'); |
| assert_less_than(caretPositions[14].x, firstLineLeftmostX, '2-14'); |
| }, '2. LTR line caret positions are to the left of RTL line caret positions'); |
| |
| test(() => { |
| assert_equals(caretPositions.length, 15); |
| assert_greater_than(caretPositions[0].x, caretPositions[1].x, '3-1'); |
| assert_greater_than(caretPositions[1].x, caretPositions[2].x, '3-2'); |
| }, '3. First line caret position ordering'); |
| |
| test(() => { |
| assert_equals(caretPositions.length, 15); |
| assert_less_than(caretPositions[3].x, caretPositions[4].x, '4-3'); |
| assert_less_than(caretPositions[4].x, caretPositions[5].x, '4-4'); |
| assert_less_than(caretPositions[5].x, caretPositions[6].x, '4-5'); |
| assert_less_than(caretPositions[6].x, caretPositions[7].x, '4-6'); |
| if (!internals.runtimeFlags.bidiCaretAffinityEnabled) { |
| assert_less_than(caretPositions[7].x, caretPositions[8].x, '4-7'); |
| assert_less_than(caretPositions[8].x, caretPositions[9].x, '4-8'); |
| assert_less_than(caretPositions[9].x, caretPositions[10].x, '4-9'); |
| } else { |
| // The downstream caret positions are at: |
| // h e l l o C B b y e _ |
| // 3 4 5 6 7 X 9 8&10 11 12 13 |
| assert_less_than(caretPositions[7].x, caretPositions[9].x, '4-7'); |
| assert_less_than(caretPositions[9].x, caretPositions[8].x, '4-9'); |
| assert_less_than_equal(caretPositions[8].x, caretPositions[10].x, '4-8'); |
| } |
| assert_less_than(caretPositions[10].x, caretPositions[11].x, '4-10'); |
| assert_less_than(caretPositions[11].x, caretPositions[12].x, '4-11'); |
| assert_less_than(caretPositions[12].x, caretPositions[13].x, '4-12'); |
| assert_less_than(caretPositions[13].x, caretPositions[14].x, '4-13'); |
| }, '4. Second line caret position ordering'); |
| </script> |