test_group_insertRule.html (9641B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>CSS Variables Allowed Syntax</title> 5 <link rel="author" title="L. David Baron" href="https://dbaron.org/"> 6 <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" /> 7 <link rel="help" href="http://www.w3.org/TR/css3-conditional/#the-cssgroupingrule-interface"> 8 <meta name="assert" content="requirements in definition of insertRule"> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <style id="style"> 12 @media print {} 13 </style> 14 <script id="metadata_cache">/* 15 { 16 "rule_type": {}, 17 "rule_length": {}, 18 "insert_import_throws": {}, 19 "insert_index_throws1": {}, 20 "insert_index_throws2": {}, 21 "insert_media_succeed": {}, 22 "insert_style_succeed": {}, 23 "insert_bad_media_throw": {}, 24 "insert_empty_throw": {}, 25 "insert_garbage_after_media_throw": {}, 26 "insert_garbage_after_style_throw": {}, 27 "insert_two_media_throw": {}, 28 "insert_style_media_throw": {}, 29 "insert_media_style_throw": {}, 30 "insert_two_style_throw": {}, 31 "insert_retval": {} 32 } 33 */</script> 34 </head> 35 <body onload="run()"> 36 <div id=log></div> 37 <div id="test"></div> 38 <script> 39 40 var sheet = document.getElementById("style").sheet; 41 42 var grouping_rule = sheet.cssRules[0]; 43 44 test(function() { 45 assert_equals(grouping_rule.type, CSSRule.MEDIA_RULE, 46 "Rule type of @media rule"); 47 }, 48 "rule_type"); 49 50 test(function() { 51 assert_equals(grouping_rule.cssRules.length, 0, 52 "Starting cssRules.length of @media rule"); 53 }, 54 "rule_length"); 55 56 test(function() { 57 assert_throws("HIERARCHY_REQUEST_ERR", 58 function() { 59 grouping_rule.insertRule("@import url(foo.css);", 0); 60 }, 61 "inserting a disallowed rule should throw HIERARCHY_REQUEST_ERR"); 62 }, 63 "insert_import_throws"); 64 65 test(function() { 66 assert_throws("INDEX_SIZE_ERR", 67 function() { 68 grouping_rule.insertRule("p { color: green }", 1); 69 }, 70 "inserting at a bad index throws INDEX_SIZE_ERR"); 71 }, 72 "insert_index_throws1"); 73 test(function() { 74 grouping_rule.insertRule("p { color: green }", 0); 75 assert_equals(grouping_rule.cssRules.length, 1, 76 "Modified cssRules.length of @media rule"); 77 grouping_rule.insertRule("p { color: blue }", 1); 78 assert_equals(grouping_rule.cssRules.length, 2, 79 "Modified cssRules.length of @media rule"); 80 grouping_rule.insertRule("p { color: aqua }", 1); 81 assert_equals(grouping_rule.cssRules.length, 3, 82 "Modified cssRules.length of @media rule"); 83 assert_throws("INDEX_SIZE_ERR", 84 function() { 85 grouping_rule.insertRule("p { color: green }", 4); 86 }, 87 "inserting at a bad index throws INDEX_SIZE_ERR"); 88 assert_equals(grouping_rule.cssRules.length, 3, 89 "Modified cssRules.length of @media rule"); 90 }, 91 "insert_index_throws2"); 92 93 test(function() { 94 while (grouping_rule.cssRules.length > 0) { 95 grouping_rule.deleteRule(0); 96 } 97 grouping_rule.insertRule("@media print {}", 0); 98 assert_equals(grouping_rule.cssRules.length, 1, 99 "Modified cssRules.length of @media rule"); 100 assert_equals(grouping_rule.cssRules[0].type, CSSRule.MEDIA_RULE, 101 "inserting syntactically correct media rule succeeds"); 102 }, 103 "insert_media_succeed"); 104 test(function() { 105 while (grouping_rule.cssRules.length > 0) { 106 grouping_rule.deleteRule(0); 107 } 108 grouping_rule.insertRule("p { color: yellow }", 0); 109 assert_equals(grouping_rule.cssRules.length, 1, 110 "Modified cssRules.length of @media rule"); 111 assert_equals(grouping_rule.cssRules[0].type, CSSRule.STYLE_RULE, 112 "inserting syntactically correct style rule succeeds"); 113 }, 114 "insert_style_succeed"); 115 test(function() { 116 while (grouping_rule.cssRules.length > 0) { 117 grouping_rule.deleteRule(0); 118 } 119 assert_throws("SYNTAX_ERR", 120 function() { 121 grouping_rule.insertRule("@media bad syntax;", 0); 122 }, 123 "inserting syntactically invalid rule throws syntax error"); 124 assert_equals(grouping_rule.cssRules.length, 0, 125 "Modified cssRules.length of @media rule"); 126 }, 127 "insert_bad_media_throw"); 128 test(function() { 129 while (grouping_rule.cssRules.length > 0) { 130 grouping_rule.deleteRule(0); 131 } 132 assert_throws("SYNTAX_ERR", 133 function() { 134 grouping_rule.insertRule("", 0); 135 }, 136 "inserting empty rule throws syntax error"); 137 assert_equals(grouping_rule.cssRules.length, 0, 138 "Modified cssRules.length of @media rule"); 139 }, 140 "insert_empty_throw"); 141 test(function() { 142 while (grouping_rule.cssRules.length > 0) { 143 grouping_rule.deleteRule(0); 144 } 145 assert_throws("SYNTAX_ERR", 146 function() { 147 grouping_rule.insertRule("@media print {} foo", 0); 148 }, 149 "inserting rule with garbage afterwards throws syntax error"); 150 assert_equals(grouping_rule.cssRules.length, 0, 151 "Modified cssRules.length of @media rule"); 152 }, 153 "insert_garbage_after_media_throw"); 154 test(function() { 155 while (grouping_rule.cssRules.length > 0) { 156 grouping_rule.deleteRule(0); 157 } 158 assert_throws("SYNTAX_ERR", 159 function() { 160 grouping_rule.insertRule("p { color: yellow } foo", 0); 161 }, 162 "inserting rule with garbage afterwards throws syntax error"); 163 assert_equals(grouping_rule.cssRules.length, 0, 164 "Modified cssRules.length of @media rule"); 165 }, 166 "insert_garbage_after_style_throw"); 167 test(function() { 168 while (grouping_rule.cssRules.length > 0) { 169 grouping_rule.deleteRule(0); 170 } 171 assert_throws("SYNTAX_ERR", 172 function() { 173 grouping_rule.insertRule("@media print {} @media print {}", 0); 174 }, 175 "inserting multiple rules throws syntax error"); 176 assert_equals(grouping_rule.cssRules.length, 0, 177 "Modified cssRules.length of @media rule"); 178 }, 179 "insert_two_media_throw"); 180 test(function() { 181 while (grouping_rule.cssRules.length > 0) { 182 grouping_rule.deleteRule(0); 183 } 184 assert_throws("SYNTAX_ERR", 185 function() { 186 grouping_rule.insertRule("p { color: yellow } @media print {}", 0); 187 }, 188 "inserting multiple rules throws syntax error"); 189 assert_equals(grouping_rule.cssRules.length, 0, 190 "Modified cssRules.length of @media rule"); 191 }, 192 "insert_style_media_throw"); 193 test(function() { 194 while (grouping_rule.cssRules.length > 0) { 195 grouping_rule.deleteRule(0); 196 } 197 assert_throws("SYNTAX_ERR", 198 function() { 199 grouping_rule.insertRule("@media print {} p { color: yellow }", 0); 200 }, 201 "inserting multiple rules throws syntax error"); 202 assert_equals(grouping_rule.cssRules.length, 0, 203 "Modified cssRules.length of @media rule"); 204 }, 205 "insert_media_style_throw"); 206 test(function() { 207 while (grouping_rule.cssRules.length > 0) { 208 grouping_rule.deleteRule(0); 209 } 210 assert_throws("SYNTAX_ERR", 211 function() { 212 grouping_rule.insertRule("p { color: yellow } p { color: yellow }", 0); 213 }, 214 "inserting multiple rules throws syntax error"); 215 assert_equals(grouping_rule.cssRules.length, 0, 216 "Modified cssRules.length of @media rule"); 217 }, 218 "insert_two_style_throw"); 219 220 test(function() { 221 while (grouping_rule.cssRules.length > 0) { 222 grouping_rule.deleteRule(0); 223 } 224 var res = grouping_rule.insertRule("p { color: green }", 0); 225 assert_equals(res, 0, "return value should be index"); 226 assert_equals(grouping_rule.cssRules.length, 1, 227 "Modified cssRules.length of @media rule"); 228 res = grouping_rule.insertRule("p { color: green }", 0); 229 assert_equals(res, 0, "return value should be index"); 230 assert_equals(grouping_rule.cssRules.length, 2, 231 "Modified cssRules.length of @media rule"); 232 res = grouping_rule.insertRule("p { color: green }", 2); 233 assert_equals(res, 2, "return value should be index"); 234 assert_equals(grouping_rule.cssRules.length, 3, 235 "Modified cssRules.length of @media rule"); 236 }, 237 "insert_retval"); 238 239 240 </script> 241 </body> 242 </html>