Handle error recovery in @supports
[WebKit-https.git] / LayoutTests / css3 / supports-cssom.html
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <meta charset=utf8>
5 <script src="../fast/js/resources/js-test-pre.js"></script>
6 <style>
7     @supports (width: 0) {
8         s { width: 0; }
9         @supports (width: 1) {
10             s { color: #000; }
11             @import url("../fast/cssom/resources/import.css");
12             @charset "UTF-8";
13             @namespace "";
14         }
15     }
16
17     @supports  ((  (     padding: 0)    and (display: none)) or (display: rainbow))  {
18         dfn { width:0; }
19
20         @supports (width: 0) {
21             br { height:0; }
22         }
23
24         /* Rules with syntax errors should be ignored. */
25         @supports (display: none);
26         @supports (display: none)) ;
27         @supports;
28         @supports ;
29         @supports (display: none)) {}
30         @supports (display: )) {}
31         @supports ((display: none) and {}
32         @supports (display: none) {}
33         );
34         @supports ((display: none) and ;
35         @supports (display: none) {}
36         );
37
38         ol { display:none; }
39     }
40
41     @media all {
42         @supports  ( padding: 0) {
43             @page :left { top: 0 }
44         }
45     }
46
47     @supports (border: black) and (padding: 0) and (width: 0) {
48         dfn { width:0; }
49     }
50 </style>
51 </head>
52 <body>
53 <script>
54     description("Test CSSSupportRule.");
55
56
57     shouldBeDefined("CSSRule.SUPPORTS_RULE");
58
59     evalAndLog("rules = document.styleSheets[1].cssRules");
60     shouldEvaluateTo("rules.length", 4);
61     shouldBe("rules[0].type", "CSSRule.SUPPORTS_RULE");
62     shouldEvaluateTo("rules[0].cssRules.length", 2);
63     shouldBe("rules[0].cssRules[0].type", "CSSRule.STYLE_RULE");
64     shouldBe("rules[0].cssRules[1].type", "CSSRule.SUPPORTS_RULE");
65     shouldEvaluateTo("rules[0].cssRules[1].cssRules.length", 1);
66     shouldBe("rules[0].cssRules[1].cssRules[0].type", "CSSRule.STYLE_RULE");
67     shouldBeEqualToString("rules[0].conditionText", "(width: 0)");
68     shouldBeEqualToString("rules[0].cssText",
69                           "@supports (width: 0) {\n" +
70                           "  s { width: 0px; }\n" +
71                           "  @supports (width: 1) {\n" +
72                           "  s { color: rgb(0, 0, 0); }\n" +
73                           "}\n" +
74                           "}");
75
76     debug("\nInserting and deleting rules.");
77     evalAndLog("rules[0].insertRule('@media all { #s { width: 0px; } }', 2)");
78     shouldEvaluateTo("rules[0].cssRules.length", 3);
79     shouldBe("rules[0].cssRules[2].type", "CSSRule.MEDIA_RULE");
80     evalAndLog("rules[0].deleteRule(2)");
81     shouldEvaluateTo("rules[0].cssRules.length", 2);
82
83     evalAndLog("rules[0].cssRules[1].insertRule('@supports (display: rainbow) {}', 1)");
84     shouldEvaluateTo("rules[0].cssRules[1].cssRules.length", 2);
85     shouldBe("rules[0].cssRules[1].cssRules[1].type", "CSSRule.SUPPORTS_RULE");
86     evalAndLog("rules[0].cssRules[1].deleteRule(1)");
87     shouldEvaluateTo("rules[0].cssRules.length", 2);
88
89     debug("\n@charset, @namespace, @import rules are not allowed inside @supports.")
90     shouldThrow("rules[0].insertRule('@charset \"UTF-8\"', 2)");
91     shouldThrow("rules[0].insertRule('@namespace \"\"', 2)");
92     shouldThrow("rules[0].insertRule('@import url(\"../fast/cssom/resources/import.css\")', 2)");
93
94
95     debug("\nWhitespace and formatting should be preserved within the condition, whitespace outside the condition should be trimmed.");
96     shouldBeEqualToString("rules[1].conditionText", "((  (     padding: 0)    and (display: none)) or (display: rainbow))");
97
98
99     debug("\n@supports rule nested inside a media rule.");
100     shouldBe("rules[2].type", "CSSRule.MEDIA_RULE");
101     shouldEvaluateTo("rules[2].cssRules.length", 1);
102     shouldBe("rules[2].cssRules[0].type", "CSSRule.SUPPORTS_RULE");
103     shouldBeEqualToString("rules[2].cssRules[0].conditionText", "( padding: 0)");
104     shouldEvaluateTo("rules[0].cssRules[1].cssRules.length", 1);
105     shouldBe("rules[2].cssRules[0].cssRules[0].type", "CSSRule.PAGE_RULE");
106     shouldBeEqualToString("rules[2].cssText",
107                           "@media all { \n" +
108                           "  @supports ( padding: 0) {\n" +
109                           "  @page :left { top: 0px; }\n" +
110                           "}\n" +
111                           "}");
112
113
114     debug("\nNo extra parens should be added to the conditionText.");
115     shouldBeEqualToString("rules[3].conditionText", "(border: black) and (padding: 0) and (width: 0)");
116
117
118     debug("\nDeleting a top-level rule should work correctly.");
119     evalAndLog("document.styleSheets[1].deleteRule(3)");
120     shouldEvaluateTo("rules.length", 3);
121     shouldBe("rules[0].type", "CSSRule.SUPPORTS_RULE");
122     shouldEvaluateTo("rules[0].cssRules.length", 2);
123     shouldBe("rules[0].cssRules[0].type", "CSSRule.STYLE_RULE");
124     shouldBe("rules[0].cssRules[1].type", "CSSRule.SUPPORTS_RULE");
125     shouldEvaluateTo("rules[0].cssRules[1].cssRules.length", 1);
126     shouldBe("rules[0].cssRules[1].cssRules[0].type", "CSSRule.STYLE_RULE");
127
128 </script>
129 <script src="../fast/js/resources/js-test-post.js"></script>
130 </body>
131 </html>
132