third_party/WebKit/LayoutTests/editing/selection/select-line-break-with-opposite-directionality.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta http-equiv="content-type" content="text/html;charset=utf-8">
   5 <style type="text/css">
   6
   7 .tests {
   8     width: 250px;
   9     float: left;
  10     list-style: none;
  11 }
  12
  13 .tests div, .tests pre {
  14     border: solid 1px black;
  15     width: 200px;
  16     font-size: 13px;
  17     line-height: 13px;
  18     padding: 13px;
  19 }
  20
  21 </style>
  22 </head>
  23 <body>
  24 <p>This tests selecting LTR/RTL text that spans multiple lines in RTL/LTR block (opposite directionality).
  25 To manually test, select text in each of editable regions below by dragging mouse from one edge to another.
  26 The entire line should be selected.</p>
  27 <div id="tests">
  28 <ol class="tests">
  29 <li><div contenteditable title="0 3, 4 6">abc<br>def</div></li>
  30 <li><div contenteditable title="0 3">ابص</div></li>
  31 <li><div contenteditable dir="rtl" title="0 3">abc</div></li>
  32 <li><div contenteditable title="0 3, 4, 5 6">ابص<span dir="ltr"><br><br>a</span></div></li>
  33 <li><div contenteditable dir="rtl" title="0 3, 4, 5 6">abc<span dir="rtl"><br><br>ا</span></div></li>
  34 <li><div contenteditable title="0 3, 4, 5 6">ابص<br><br>a</div></li>
  35 <li><div contenteditable dir="rtl" title="0 3, 4, 5 6">ابص<br><br>a</div></li>
  36 </ol>
  37 <ol class="tests">
  38 <li><pre contenteditable title="0 3, 4, 5 6"><span dir="rtl">ابص
  39
  40 a</span></pre></li>
  41 <li><pre contenteditable dir="rtl" title="0 3, 4, 5 6"><span dir="ltr">abc
  42
  43 a</span></pre></li>
  44 <li><pre contenteditable dir="rtl" title="0 3, 4, 5 6">abc<span dir="rtl">
  45
  46 a</span></pre></li>
  47 </ol>
  48 </div>
  49 <pre id="log"><script>
  50
  51 function selectLineSafely(test, lineTop) {
  52     var y = test.offsetTop + lineTop + 5;
  53     eventSender.mouseMoveTo(test.offsetLeft + 5, y);
  54     eventSender.mouseDown();
  55
  56     eventSender.leapForward(200);
  57
  58     eventSender.mouseMoveTo(test.offsetLeft + test.offsetWidth - 5, y);
  59     eventSender.mouseUp();
  60 }
  61
  62 if (window.testRunner) {
  63     testRunner.dumpAsText();
  64
  65     if (!window.eventSender)
  66         document.writeln('This test requires eventSender');
  67     else {
  68         var tests = document.getElementsByTagName('li');
  69         var testNumber = 0;
  70
  71         for (var i = 0; i < tests.length; i++) {
  72             var test = tests[i].firstChild;
  73             offsets = test.title.split(', ');
  74
  75             for (var j = 0; j < offsets.length; j++) {
  76                 function log(msg) {
  77                     return document.write('TEST ' + (i + 1) + ' line ' + (j + 1) + ':' + msg + '\n');
  78                 }
  79
  80                 var start = parseInt(offsets[j].split(' ')[0]);
  81                 var afterEnd = parseInt(offsets[j].split(' ')[1]); // Might be NaN
  82                 var selection = window.getSelection();
  83
  84                 selectLineSafely(test, 13 * (j + 1));
  85
  86                 var actual = selection.toString();
  87                 var expected = test.innerText.substr(start, afterEnd);
  88                 if (actual == expected)
  89                     log('PASS');
  90                 else
  91                     log('FAIL - expected "' + expected + '" but got "' + actual + '"');
  92             }
  93         }
  94     }
  95
  96     document.getElementById('tests').style.display = 'none';
  97 } else {
  98     document.addEventListener('selectionchange', function () {
  99         var selection = window.getSelection();
 100         if (selection.isCollapsed)
 101             document.getElementById('log').innerHTML += selection.baseOffset + '\n';
 102         else
 103             document.getElementById('log').innerHTML += selection.baseOffset + ':' + selection.extentOffset + '\n';
 104     });
 105 }
 106
 107 </script></pre>
 108 </body>
 109 </html>