third_party/WebKit/LayoutTests/editing/style/script-tests/inline-style-container.js

   1 description('Test to make sure WebKit adds style to the appropriate container.');
   2
   3 var testContainer = document.createElement("div");
   4 testContainer.contentEditable = true;
   5 document.body.appendChild(testContainer);
   6
   7 var styleWithCSS = false;
   8 function testSingleToggle(toggleCommand, value, initialContents, expectedContents)
   9 {
  10     testContainer.innerHTML = initialContents;
  11     window.getSelection().selectAllChildren(testContainer);
  12     document.execCommand('styleWithCSS', false, styleWithCSS);
  13     document.execCommand(toggleCommand, false, value);
  14     var action = toggleCommand + '(' + value + ') on all of "' + initialContents + '" yields "' + testContainer.innerHTML + '"';
  15     if (testContainer.innerHTML == expectedContents)
  16         testPassed(action);
  17     else
  18         testFailed(action + ', expected "' + expectedContents + '"');
  19 }
  20
  21 debug('styleWithCSS = false');
  22 testSingleToggle("fontSize", 3, '<font size="3">hello <font size="4">world</font></font>', '<font size="3">hello world</font>');
  23 testSingleToggle("fontSize", 4, '<font face="Arial">hello</font>', '<font face="Arial" size="4">hello</font>');
  24 testSingleToggle("fontSize", 4, '<font color="blue"><font face="Arial">hello</font></font>', '<font color="blue"><font face="Arial" size="4">hello</font></font>');
  25 testSingleToggle("fontSize", 4, '<b><font face="Arial">hello</font></b>', '<b><font face="Arial" size="4">hello</font></b>');
  26 testSingleToggle("fontSize", 4, '<font face="Arial"><i>hello</i></font>', '<font face="Arial" size="4"><i>hello</i></font>');
  27 testSingleToggle("fontName", "Arial", '<b><font face="Arial">hello</font></b> world', '<font face="Arial"><b>hello</b> world</font>');
  28 testSingleToggle("fontName", "Arial", '<font color="blue">hello</font> world', '<font face="Arial"><font color="blue">hello</font> world</font>');
  29 testSingleToggle("fontName", "Arial", '<b><u>hello</u> world</b>', '<b><font face="Arial"><u>hello</u> world</font></b>');
  30 testSingleToggle("foreColor", 'blue', '<font><u style="color:red;">hello</u></font>', '<font color="#0000ff"><u>hello</u></font>');
  31 testSingleToggle("foreColor", 'rgba(0, 50, 100, 0.4)', '<font><u style="color:red;">hello</u></font>', '<font color="rgba(0, 50, 100, 0.4)"><u>hello</u></font>');
  32 testSingleToggle("bold", null, '<u><strike>hello</strike> <strike>world</strike></u>', '<u><b><strike>hello</strike> <strike>world</strike></b></u>');
  33 testSingleToggle("bold", null, '<i>hello</i> <b>world</b>', '<b><i>hello</i> world</b>');
  34 testSingleToggle("bold", null, '<strike><i><u>hello <b>world</b></u></i> webkit</strike>', '<strike><b><i><u>hello world</u></i> webkit</b></strike>');
  35 testSingleToggle("bold", null,
  36     '<b contenteditable="false"><span style="font-weight: normal;">hello</span> world</b> world',
  37     '<b contenteditable="false"><span style="font-weight: normal;">hello</span> world</b><b> world</b>');
  38 testSingleToggle("bold", null,
  39     '<i>hello</i> <b contenteditable="false">world</b>',
  40     '<b><i>hello</i> </b><b contenteditable="false">world</b>');
  41 testSingleToggle("strikeThrough", null, '<i>hello</i> <b><strike>world</strike></b> WebKit', '<strike><i>hello</i> <b>world</b> WebKit</strike>');
  42 testSingleToggle("strikeThrough", null, '<b><i>hello <strike>world</strike></i> WebKit</b>', '<b><strike><i>hello world</i> WebKit</strike></b>');
  43
  44 debug('')
  45 debug('styleWithCSS = true')
  46 styleWithCSS = true;
  47 testSingleToggle("fontSize", 4, '<font face="Arial">hello</font>', '<font face="Arial" style="font-size: large;">hello</font>');
  48 testSingleToggle("fontSize", 4, '<font face="Arial"><b>hello</b></font>', '<font face="Arial"><b style="font-size: large;">hello</b></font>');
  49 testSingleToggle("fontSize", 4, '<i><b>hello</b></i>', '<i><b style="font-size: large;">hello</b></i>');
  50 testSingleToggle("fontSize", 4, '<i><b>hello</b> world</i>', '<i style="font-size: large;"><b>hello</b> world</i>');
  51 testSingleToggle("fontSize", 4, '<font color="blue"><b>hello</b></font>', '<font color="blue"><b style="font-size: large;">hello</b></font>');
  52 testSingleToggle("bold", null, '<span style="font-style: italic;">hello</span>', '<span style="font-style: italic; font-weight: bold;">hello</span>');
  53 testSingleToggle("underline", null, '<span style="font-style: italic;"><b>hello</b></span>', '<span style="font-style: italic; text-decoration-line: underline;"><b>hello</b></span>');
  54 testSingleToggle("underline", null,
  55     '<span style="color: blue;"><i><span style="font-size: large;"><b>hello</b> world</span></i></span>',
  56     '<span style="color: blue;"><i><span style="font-size: large; text-decoration-line: underline;"><b>hello</b> world</span></i></span>');
  57
  58 document.body.removeChild(testContainer);
  59 var successfullyParsed = true;