| <!DOCTYPE html> |
| |
| <style> |
| iframe { |
| margin: 10px; |
| padding: 10px; |
| border: solid; |
| width: 200px; |
| height: 200px; |
| float: left; |
| } |
| </style> |
| |
| <p>This test checks that selection of linebreaks works as expected with the different directions and writing modes.</p> |
| <p>The test passes if you can visually see the linebreaks selection in the different examples.</p> |
| |
| <iframe srcdoc=" |
| <h3>Default</h3> |
| <div id='target' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
| |
| <iframe srcdoc=" |
| <h3>RTL</h3> |
| <div id='target' style='direction: rtl;' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
| |
| <iframe srcdoc=" |
| <h3>vertical-lr</h3> |
| <div id='target' style='writing-mode: vertical-lr;' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
| |
| <iframe srcdoc=" |
| <h3>vertical-lr & RTL</h3> |
| <div id='target' style='writing-mode: vertical-lr; direction: rtl;' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
| |
| <iframe srcdoc=" |
| <h3>vertical-rl</h3> |
| <div id='target' style='writing-mode: vertical-rl;' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
| |
| <iframe srcdoc=" |
| <h3>vertical-rl & RTL</h3> |
| <div id='target' style='writing-mode: vertical-rl; direction: rtl;' contenteditable>foo<br><br><br><br>bar</div> |
| <script> |
| window.getSelection().setBaseAndExtent(target.firstChild, 2, target.lastChild, 2); |
| </script> |
| "></iframe> |
