test_inline_style_cache.html (8246B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Tests for inline style cache</title> 5 <script src="/tests/SimpleTest/SimpleTest.js"></script> 6 <script src="/tests/SimpleTest/EventUtils.js"></script> 7 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> 8 </head> 9 <body> 10 <p id="display"></p> 11 <div id="content" style="display: none;"> 12 13 </div> 14 15 <div id="editor" contenteditable></div> 16 <pre id="test"> 17 18 <script class="testbody" type="application/javascript"> 19 SimpleTest.waitForExplicitFinish(); 20 SimpleTest.waitForFocus(function() { 21 var editor = document.getElementById("editor"); 22 editor.focus(); 23 24 document.execCommand("defaultParagraphSeparator", false, "div"); 25 26 var selection = window.getSelection(); 27 28 // #01-01 Typing something after setting some styles should insert some nodes to insert text. 29 editor.innerHTML = "beforeafter"; 30 selection.collapse(editor.firstChild, "before".length); 31 document.execCommand("bold"); 32 document.execCommand("italic"); 33 document.execCommand("strikethrough"); 34 sendString("test"); 35 36 is(editor.innerHTML, "before<b><i><strike>test</strike></i></b>after", 37 "#01-01 At typing something after setting some styles, should cause inserting some nodes to apply the style"); 38 39 // #01-02 Typing something after removing some characters after setting some styles should work as without removing some character. 40 editor.innerHTML = "beforeafter"; 41 selection.collapse(editor.firstChild, "before".length); 42 document.execCommand("bold"); 43 document.execCommand("italic"); 44 document.execCommand("strikethrough"); 45 synthesizeKey("KEY_Delete"); 46 sendString("test"); 47 48 todo_is( 49 editor.innerHTML, 50 "beforetestfter", 51 "#01-02-1 At typing something after Delete after setting style, the style should not be preserved for compatibility with the other browsers" 52 ); 53 is( 54 editor.innerHTML, 55 "before<b><i><strike>test</strike></i></b>fter", 56 "#01-02-1 At typing something after Delete after setting style, the style should not be preserved, but it's okay to do it for backward compatibility" 57 ); 58 59 editor.innerHTML = "beforeafter"; 60 selection.collapse(editor.firstChild, "before".length); 61 document.execCommand("bold"); 62 document.execCommand("italic"); 63 document.execCommand("strikethrough"); 64 synthesizeKey("KEY_Backspace"); 65 sendString("test"); 66 67 is(editor.innerHTML, "befor<b><i><strike>test</strike></i></b>after", 68 "#01-02-2 At typing something after Backspace after setting style, should cause inserting some nodes to apply the style"); 69 70 // #03-01 Replacing in <b style="font-weight: normal;"> shouldn't cause new <b>. 71 editor.innerHTML = "<b style=\"font-weight: normal;\">beforeselectionafter</b>"; 72 selection.collapse(editor.firstChild.firstChild, "before".length); 73 selection.extend(editor.firstChild.firstChild, "beforeselection".length); 74 sendString("test"); 75 76 is(editor.innerHTML, "<b style=\"font-weight: normal;\">beforetestafter</b>", 77 "#03-01 Replacing text in styled inline elements should respect the styles"); 78 79 // #03-02 Typing something after removing selected text in <b style="font-weight: normal;"> shouldn't cause new <b>. 80 editor.innerHTML = "<b style=\"font-weight: normal;\">beforeselectionafter</b>"; 81 selection.collapse(editor.firstChild.firstChild, "before".length); 82 selection.extend(editor.firstChild.firstChild, "beforeselection".length); 83 synthesizeKey("KEY_Backspace"); 84 sendString("test"); 85 86 is(editor.innerHTML, "<b style=\"font-weight: normal;\">beforetestafter</b>", 87 "#03-02 Inserting text after removing text in styled inline elements should respect the styles"); 88 89 // #03-03 Typing something after typing Enter at selected text in <b style="font-weight: normal;"> shouldn't cause new <b>. 90 editor.innerHTML = "<b style=\"font-weight: normal;\">beforeselectionafter</b>"; 91 selection.collapse(editor.firstChild.firstChild, "before".length); 92 selection.extend(editor.firstChild.firstChild, "beforeselection".length); 93 synthesizeKey("KEY_Enter"); 94 sendString("test"); 95 96 is(editor.innerHTML, "<div><b style=\"font-weight: normal;\">before</b></div><div><b style=\"font-weight: normal;\">testafter</b></div>", 97 "#03-03-1 Inserting text after typing Enter at selected text in styled inline elements should respect the styles"); 98 99 editor.innerHTML = "<p><b style=\"font-weight: normal;\">beforeselectionafter</b></p>"; 100 selection.collapse(editor.firstChild.firstChild.firstChild, "before".length); 101 selection.extend(editor.firstChild.firstChild.firstChild, "beforeselection".length); 102 synthesizeKey("KEY_Enter"); 103 sendString("test"); 104 105 is(editor.innerHTML, "<p><b style=\"font-weight: normal;\">before</b></p><p><b style=\"font-weight: normal;\">testafter</b></p>", 106 "#03-03-2 Inserting text after typing Enter at selected text in styled inline elements should respect the styles"); 107 108 // #04-01 Replacing in some styled inline elements shouldn't cause new same elements. 109 editor.innerHTML = "<strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforeselectionafter</b></i></strike>"; 110 selection.collapse(editor.firstChild.firstChild.firstChild.firstChild, "before".length); 111 selection.extend(editor.firstChild.firstChild.firstChild.firstChild, "beforeselection".length); 112 sendString("test"); 113 114 is(editor.innerHTML, "<strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforetestafter</b></i></strike>", 115 "#04-01 Replacing text in styled inline elements should respect the styles"); 116 117 // #04-02 Typing something after removing selected text in some styled inline elements shouldn't cause new same elements. 118 editor.innerHTML = "<strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforeselectionafter</b>"; 119 selection.collapse(editor.firstChild.firstChild.firstChild.firstChild, "before".length); 120 selection.extend(editor.firstChild.firstChild.firstChild.firstChild, "beforeselection".length); 121 synthesizeKey("KEY_Backspace"); 122 sendString("test"); 123 124 is(editor.innerHTML, "<strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforetestafter</b></i></strike>", 125 "#04-02 Inserting text after removing text in styled inline elements should respect the styles"); 126 127 // #04-03 Typing something after typing Enter at selected text in some styled inline elements shouldn't cause new same elements. 128 editor.innerHTML = "<strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforeselectionafter</b>"; 129 selection.collapse(editor.firstChild.firstChild.firstChild.firstChild, "before".length); 130 selection.extend(editor.firstChild.firstChild.firstChild.firstChild, "beforeselection".length); 131 synthesizeKey("KEY_Enter"); 132 sendString("test"); 133 134 is(editor.innerHTML, "<div><strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">before</b></i></strike></div><div><strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">testafter</b></i></strike></div>", 135 "#04-03-1 Inserting text after typing Enter at selected text in styled inline elements should respect the styles"); 136 137 editor.innerHTML = "<p><strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">beforeselectionafter</b></p>"; 138 selection.collapse(editor.firstChild.firstChild.firstChild.firstChild.firstChild, "before".length); 139 selection.extend(editor.firstChild.firstChild.firstChild.firstChild.firstChild, "beforeselection".length); 140 synthesizeKey("KEY_Enter"); 141 sendString("test"); 142 143 is(editor.innerHTML, "<p><strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">before</b></i></strike></p><p><strike style=\"text-decoration: none;\"><i style=\"font-style: normal;\"><b style=\"font-weight: normal;\">testafter</b></i></strike></p>", 144 "#04-03-2 Inserting text after typing Enter at selected text in styled inline elements should respect the styles"); 145 146 SimpleTest.finish(); 147 }); 148 </script> 149 </pre> 150 </body> 151 </html>