| <!doctype html> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script src="../../assert_selection.js"></script> |
| <script> |
| // Soft line break before white space |
| const kStyle = 'line-break:before-white-space; width: 100px; font: 20px monospace;'; |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">|line1 line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">|line1 line2 a line3</div>`, |
| '21-0 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">l|ine1 line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">|l^ine1 line2 a line3</div>`, |
| '21-1 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">li|ne1 line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">l|i^ne1 line2 a line3</div>`, |
| '21-2 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">lin|e1 line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">li|n^e1 line2 a line3</div>`, |
| '21-3 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line|1 line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">lin|e^1 line2 a line3</div>`, |
| '21-4 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1| line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line|1^ line2 a line3</div>`, |
| '21-5 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 |line2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1| ^line2 a line3</div>`, |
| '21-6 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 l|ine2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 |l^ine2 a line3</div>`, |
| '21-7 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 li|ne2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 l|i^ne2 a line3</div>`, |
| '21-8 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 lin|e2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 li|n^e2 a line3</div>`, |
| '21-9 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line|2 a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 lin|e^2 a line3</div>`, |
| '21-10 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2| a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line|2^ a line3</div>`, |
| '21-11 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 |a line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2| ^a line3</div>`, |
| '21-12 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a| line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 |a^ line3</div>`, |
| '21-13 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a |line3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 a| ^line3</div>`, |
| '21-14 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a l|ine3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 a |l^ine3</div>`, |
| '21-15 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a li|ne3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 a l|i^ne3</div>`, |
| '21-16 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a lin|e3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 a li|n^e3</div>`, |
| '21-17 ltr backward character'); |
| |
| selection_test( |
| `<div contenteditable dir="ltr" style="${kStyle}">line1 line2 a line|3</div>`, |
| selection => selection.modify('extend', 'backward', 'character'), |
| `<div contenteditable dir="ltr" style="line-break:before-white-space; width: 100px; font: 20px monospace;">line1 line2 a lin|e^3</div>`, |
| '21-18 ltr backward character'); |
| </script> |
