third_party/WebKit/LayoutTests/editing/spelling/inline-spelling-markers-hidpi.html

   1 <html>
   2 <head>
   3 <script src="../../resources/js-test.js"></script>
   4 <script src="../../editing/editing.js"></script>
   5 <style>
   6 body { overflow:hidden; }
   7
   8 .testDiv {
   9     width: 200px;
  10     height: 20px;
  11     border: 1px solid black;
  12     white-space: nowrap;
  13     overflow: hidden;
  14 }
  15
  16 .forcertl {
  17     direction: rtl;
  18     unicode-bidi: bidi-override;
  19 }
  20
  21 .ellipses {
  22     text-overflow:ellipsis;
  23 }
  24
  25 </style>
  26 </head>
  27 <body>
  28
  29 <script>
  30 description("This tests the correct placement of inline spelling and grammar "
  31     + "markers in text. Spelling markers should line up exactly under misspelled "
  32     + "words in all cases.");
  33
  34 jsTestIsAsync = true;
  35
  36 if (window.internals) {
  37     internals.settings.setUnifiedTextCheckerEnabled(true);
  38     internals.settings.setAsynchronousSpellCheckingEnabled(true);
  39 }
  40 </script>
  41
  42 LTR
  43 <div id="testLTR" class="testDiv" contenteditable="true">the the adlj adaasj sdklj. there there</div>
  44
  45 RTL
  46 <div id="testRTL" class="testDiv forcertl" contenteditable="true">the the adlj adaasj sdklj. there there</div>
  47
  48 LTR (text-overflow:ellipses)
  49 <div id="testLTREllipses" class="testDiv ellipses" contenteditable="true">the the adlj adaasj sdklj. there there</div>
  50
  51 RTL (text-overflow:ellipses)
  52 <div id="testRTLEllipses" class="testDiv forcertl ellipses" contenteditable="true">the the adlj adaasj sdklj. there there</div>
  53
  54 <script>
  55 function moveCursorOverAllWords(id)
  56 {
  57     div = document.getElementById(id);
  58     div.focus();
  59
  60     debug(id + ":");
  61     // Move cursor over all words so inline spellchecking is activated for all.
  62     for (var i = 0; i < div.innerHTML.length; i++)
  63         moveSelectionForwardByWordCommand();
  64
  65     verifyMarkers();
  66 }
  67
  68 function verifyMarkers()
  69 {
  70     if (!window.internals)
  71         return done();
  72
  73     // Take care of spelling markers first.
  74     shouldBecomeEqual('internals.hasSpellingMarker(document, 8, 4)', 'true', function() { // Verifies 'adlj'.
  75         shouldBecomeEqual('internals.hasSpellingMarker(document, 13, 6)', 'true', function() { // Verifies 'adaasj'.
  76             shouldBecomeEqual('internals.hasSpellingMarker(document, 20, 5)', 'true', verifyGrammarMarkers) // Verifies 'sdklj'.
  77         })
  78     });
  79
  80     function verifyGrammarMarkers() {
  81         shouldBecomeEqual('internals.hasGrammarMarker(document, 4, 3)', 'true', function() { // Verifies second 'the'.
  82             shouldBecomeEqual('internals.hasGrammarMarker(document, 33, 5)', 'true', function() { // Verifies second 'there'.
  83                 // Markers of next element can not be found after modification selection without blur event.
  84                 div.blur();
  85                 done();
  86             })
  87         });
  88     }
  89 }
  90
  91 var tests = [ function() { moveCursorOverAllWords('testLTR'); },
  92               function() { moveCursorOverAllWords('testRTL'); },
  93               function() { moveCursorOverAllWords('testLTREllipses'); },
  94               function() { moveCursorOverAllWords('testRTLEllipses'); } ];
  95
  96 function done()
  97 {
  98     var next = tests.shift();
  99     if (next)
 100         return window.setTimeout(next, 0);
 101
 102     finishJSTest();
 103 }
 104
 105 if (window.testRunner) {
 106     testRunner.dumpAsTextWithPixelResults();
 107     testRunner.setBackingScaleFactor(2, function () {
 108         done();
 109     });
 110 }
 111 </script>
 112 </body>
 113 </html>