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