<!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>
Codebase Browser
chromium