src/third_party/WebKit/LayoutTests/editing/execCommand/justify.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <p id="description"></p>
   8 <div id="console"></div>
   9 <script>
  10
  11 description("Tests justifying paragraphs to left, right, and center.")
  12
  13 var testContainer = document.createElement("div");
  14 testContainer.contentEditable = true;
  15 document.body.appendChild(testContainer);
  16
  17 function testJustifying(selector, command, content, expected)
  18 {
  19     testContainer.innerHTML = content;
  20     var selected = selector(testContainer);
  21     document.execCommand(command, false, null);
  22     var actual = testContainer.innerHTML;
  23     var action = "execCommand('" + command + "') returned \"" + actual + '" selecting ' + selected + ' of "' + content + '"';
  24     if (!expected)
  25         expected = content;
  26     if (actual == expected)
  27         testPassed(action);
  28     else
  29         testFailed(action + ' but expected "' + expected + '"');
  30 }
  31
  32 function selectFirstPosition(container) {
  33     while (container.firstChild)
  34         container = container.firstChild;
  35     window.getSelection().collapse(container, 0);
  36     return 'first position'
  37 }
  38
  39 function selectAll(container) {
  40     window.getSelection().selectAllChildren(container);
  41     return 'all'
  42 }
  43
  44 function selectMiddleOfHelloWorld(container) {
  45     window.getSelection().collapse(container, 0);
  46     window.getSelection().modify('move', 'forward', 'character');
  47     window.getSelection().modify('move', 'forward', 'character');
  48     window.getSelection().modify('extend', 'forward', 'word');
  49     window.getSelection().modify('extend', 'forward', 'character');
  50     window.getSelection().modify('extend', 'forward', 'character');
  51     window.getSelection().modify('extend', 'forward', 'character');
  52     return '"llo wo"'
  53 }
  54
  55 debug('\nCenter');
  56 testJustifying(selectFirstPosition, 'JustifyCenter', '', '<div style="text-align: center;"><br></div>');
  57 testJustifying(selectFirstPosition, 'JustifyCenter', '<br>', '<div style="text-align: center;"><br></div>');
  58 testJustifying(selectFirstPosition, 'JustifyCenter', '<br><br>', '<div style="text-align: center;"><br></div><br>');
  59 testJustifying(selectFirstPosition, 'JustifyCenter', 'hello', '<div style="text-align: center;">hello</div>');
  60 testJustifying(selectFirstPosition, 'JustifyCenter', 'hello<p>world</p>', '<div style="text-align: center;">hello</div><p>world</p>');
  61 testJustifying(selectFirstPosition, 'JustifyCenter', '<p>hello</p>world', '<p style="text-align: center;">hello</p>world');
  62 testJustifying(selectAll, 'JustifyCenter', 'hello<blockquote>world</blockquote>', '<div style="text-align: center;">hello</div><blockquote style="text-align: center;">world</blockquote>');
  63 testJustifying(selectAll, 'JustifyCenter', '<h3>hello</h3>world', '<h3 style="text-align: center;">hello</h3><div style="text-align: center;">world</div>');
  64 testJustifying(selectFirstPosition, 'JustifyCenter', '<div style="text-align: center;">hello<br>world</div>');
  65
  66 debug('\nFull');
  67 testJustifying(selectFirstPosition, 'JustifyFull', '', '<div style="text-align: justify;"><br></div>');
  68 testJustifying(selectFirstPosition, 'JustifyFull', '<br>', '<div style="text-align: justify;"><br></div>');
  69 testJustifying(selectFirstPosition, 'JustifyFull', '<br><br>', '<div style="text-align: justify;"><br></div><br>');
  70 testJustifying(selectFirstPosition, 'JustifyFull', 'hello', '<div style="text-align: justify;">hello</div>');
  71 testJustifying(selectFirstPosition, 'JustifyFull', 'hello<p>world</p>', '<div style="text-align: justify;">hello</div><p>world</p>');
  72 testJustifying(selectFirstPosition, 'JustifyFull', '<p>hello</p>world', '<p style="text-align: justify;">hello</p>world');
  73 testJustifying(selectAll, 'JustifyFull', 'hello<blockquote>world</blockquote>', '<div style="text-align: justify;">hello</div><blockquote style="text-align: justify;">world</blockquote>');
  74 testJustifying(selectAll, 'JustifyFull', '<h3>hello</h3>world', '<h3 style="text-align: justify;">hello</h3><div style="text-align: justify;">world</div>');
  75 testJustifying(selectFirstPosition, 'JustifyFull', '<div style="text-align: justify;">hello<br>world</div>');
  76
  77 // Because the default alignment is left, we need to force a different alignment to test "left"
  78 testContainer.style.textAlign = 'center';
  79
  80 debug('\nLeft');
  81 testJustifying(selectFirstPosition, 'JustifyLeft', '', '<div style="text-align: left;"><br></div>');
  82 testJustifying(selectFirstPosition, 'JustifyLeft', '<br>', '<div style="text-align: left;"><br></div>');
  83 testJustifying(selectFirstPosition, 'JustifyLeft', '<br><br>', '<div style="text-align: left;"><br></div><br>');
  84 testJustifying(selectFirstPosition, 'JustifyLeft', 'hello', '<div style="text-align: left;">hello</div>');
  85 testJustifying(selectFirstPosition, 'JustifyLeft', 'hello<p>world</p>', '<div style="text-align: left;">hello</div><p>world</p>');
  86 testJustifying(selectFirstPosition, 'JustifyLeft', '<p>hello</p>world', '<p style="text-align: left;">hello</p>world');
  87 testJustifying(selectAll, 'JustifyLeft', 'hello<blockquote>world</blockquote>', '<div style="text-align: left;">hello</div><blockquote style="text-align: left;">world</blockquote>');
  88 testJustifying(selectAll, 'JustifyLeft', '<h3>hello</h3>world', '<h3 style="text-align: left;">hello</h3><div style="text-align: left;">world</div>');
  89 testJustifying(selectFirstPosition, 'JustifyLeft', '<div style="text-align: left;">hello<br>world</div>');
  90
  91 debug('\nRight');
  92 testJustifying(selectFirstPosition, 'JustifyRight', '', '<div style="text-align: right;"><br></div>');
  93 testJustifying(selectFirstPosition, 'JustifyRight', '<br>', '<div style="text-align: right;"><br></div>');
  94 testJustifying(selectFirstPosition, 'JustifyRight', '<br><br>', '<div style="text-align: right;"><br></div><br>');
  95 testJustifying(selectFirstPosition, 'JustifyRight', 'hello', '<div style="text-align: right;">hello</div>');
  96 testJustifying(selectFirstPosition, 'JustifyRight', 'hello<p>world</p>', '<div style="text-align: right;">hello</div><p>world</p>');
  97 testJustifying(selectFirstPosition, 'JustifyRight', '<p>hello</p>world', '<p style="text-align: right;">hello</p>world');
  98 testJustifying(selectAll, 'JustifyRight', 'hello<blockquote>world</blockquote>', '<div style="text-align: right;">hello</div><blockquote style="text-align: right;">world</blockquote>');
  99 testJustifying(selectAll, 'JustifyRight', '<h3>hello</h3>world', '<h3 style="text-align: right;">hello</h3><div style="text-align: right;">world</div>');
 100 testJustifying(selectFirstPosition, 'JustifyRight', '<div style="text-align: right;">hello<br>world</div>');
 101
 102 document.body.removeChild(testContainer);
 103
 104 </script>
 105 </body>
 106 </html>