| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| div { |
| border: 2px solid red; |
| padding: 12px; |
| line-height: 1.66666667; |
| width: 140px; |
| } |
| </style> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| </head> |
| <body> |
| <div contenteditable id="test1"> |
| The caret height |
| should <span id="line2">be the same for each line.</span> |
| </div> |
| <div contenteditable id="test2"> |
| The <span id="large_font" style="font-size: 150%">caret</span> height should be obtained from a font of character before caret for LTR. |
| </div> |
| <div contenteditable id="test3" style="direction: RTL">גובה<span id="large_font_rtl" style="font-size: 150%">עבו</span> תו יש לקבל תו אחרי תו עבור RTL |
| </div> |
| <script> |
| test(function () { |
| let editor = document.getElementById('test1'); |
| editor.focus(); |
| |
| assert_not_equals(window.internals, undefined, 'This test requires window.internals'); |
| let caretHeight1 = internals.absoluteCaretBounds().height; |
| let sel = window.getSelection(); |
| sel.collapse(line2, 0); |
| let caretHeight2 = internals.absoluteCaretBounds().height; |
| |
| assert_equals(caretHeight1, caretHeight2); |
| }, 'The caret height should be the same in every line'); |
| |
| test(function () { |
| let editor = document.getElementById('test2'); |
| editor.focus(); |
| |
| assert_not_equals(window.internals, undefined, 'This test requires window.internals'); |
| let caretHeight1 = internals.absoluteCaretBounds().height; |
| let sel = window.getSelection(); |
| sel.collapse(large_font, 0); |
| let caretHeight2 = internals.absoluteCaretBounds().height; |
| |
| assert_equals(caretHeight1, caretHeight2); |
| }, 'The caret height at the front of word(150%) should be the same as the caret height in other words(100%).'); |
| |
| test(function () { |
| let editor = document.getElementById('test2'); |
| editor.focus(); |
| |
| assert_not_equals(window.internals, undefined, 'This test requires window.internals'); |
| let sel = window.getSelection(); |
| sel.collapse(large_font, 0); |
| sel.modify('move', 'right', 'character'); |
| let caretHeight1 = internals.absoluteCaretBounds().height; |
| sel.collapse(large_font, 1); |
| let caretHeight2 = internals.absoluteCaretBounds().height; |
| |
| assert_equals(caretHeight1, caretHeight2); |
| }, 'The caret height at the end of word should be the same as the caret height in the word.'); |
| |
| test(function () { |
| let editor = document.getElementById('test3'); |
| editor.focus(); |
| |
| assert_not_equals(window.internals, undefined, 'This test requires window.internals'); |
| let caretHeight1 = internals.absoluteCaretBounds().height; |
| let sel = window.getSelection(); |
| sel.collapse(large_font_rtl, 0); |
| let caretHeight2 = internals.absoluteCaretBounds().height; |
| |
| assert_equals(caretHeight1, caretHeight2); |
| }, 'In case of RTL, the caret height at the front of word(150%) should be the same as the caret height in other words(100%).'); |
| |
| test(function () { |
| let editor = document.getElementById('test3'); |
| editor.focus(); |
| |
| assert_not_equals(window.internals, undefined, 'This test requires window.internals'); |
| let sel = window.getSelection(); |
| sel.collapse(large_font_rtl, 0); |
| sel.modify('move', 'left', 'character'); |
| let caretHeight1 = internals.absoluteCaretBounds().height; |
| sel.collapse(large_font_rtl, 1); |
| let caretHeight2 = internals.absoluteCaretBounds().height; |
| |
| assert_equals(caretHeight1, caretHeight2); |
| }, 'In case of RTL, the caret height at the end of word should be the same as the caret height in the word.'); |
| </script> |
| </body> |
| </html> |
