View Javadoc
1   /*
2    * Copyright (c) 2002-2025 Gargoyle Software Inc.
3    *
4    * Licensed under the Apache License, Version 2.0 (the "License");
5    * you may not use this file except in compliance with the License.
6    * You may obtain a copy of the License at
7    * https://www.apache.org/licenses/LICENSE-2.0
8    *
9    * Unless required by applicable law or agreed to in writing, software
10   * distributed under the License is distributed on an "AS IS" BASIS,
11   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12   * See the License for the specific language governing permissions and
13   * limitations under the License.
14   */
15  package org.htmlunit.javascript.host.css;
16  
17  import org.htmlunit.WebDriverTestCase;
18  import org.htmlunit.junit.BrowserRunner;
19  import org.htmlunit.junit.annotation.Alerts;
20  import org.htmlunit.junit.annotation.HtmlUnitNYI;
21  import org.junit.Test;
22  import org.junit.runner.RunWith;
23  
24  /**
25   * Tests for {@link CSSStyleRule}.
26   *
27   * @author Ahmed Ashour
28   * @author Ronald Brill
29   * @author Frank Danek
30   */
31  @RunWith(BrowserRunner.class)
32  public class CSSStyleRuleTest extends WebDriverTestCase {
33  
34      /**
35       * @throws Exception if an error occurs
36       */
37      @Test
38      @Alerts("TypeError")
39      public void ctor() throws Exception {
40          final String html = DOCTYPE_HTML
41              + "<html><body>\n"
42              + LOG_TEXTAREA
43              + "<script>\n"
44              + LOG_TEXTAREA_FUNCTION
45              + "try {\n"
46              + "  var rule = new CSSStyleRule();\n"
47              + "  log(rule);\n"
48              + "} catch(e) { logEx(e); }\n"
49              + "</script></body></html>";
50  
51          loadPageVerifyTextArea2(html);
52      }
53  
54      /**
55       * @throws Exception on test failure
56       */
57      @Test
58      @Alerts(DEFAULT = {"[object CSSStyleRule]", "1", "[object CSSStyleSheet]", "null", "h1", "", "10px", "", "red"},
59              FF = {"[object CSSStyleRule]", "1", "[object CSSStyleSheet]", "null", "H1", "", "10px", "", "red"},
60              FF_ESR = {"[object CSSStyleRule]", "1", "[object CSSStyleSheet]", "null", "H1", "", "10px", "", "red"})
61      public void test() throws Exception {
62          final String html = DOCTYPE_HTML
63                  + "<html><head>\n"
64                  + "<style>\n"
65                  + "  BODY { background-color: white; color: black; }\n"
66                  + "  H1 { font: 8pt Arial bold; }\n"
67                  + "  P  { font: 10pt Arial; text-indent: 0.5in; }\n"
68                  + "  A  { text-decoration: none; color: blue; }\n"
69                  + "</style>\n"
70                  + "<script>\n"
71                  + LOG_TITLE_FUNCTION
72                  + "  function test() {\n"
73                  + "    var rules;\n"
74                  + "    if (document.styleSheets[0].cssRules)\n"
75                  + "      rules = document.styleSheets[0].cssRules;\n"
76                  + "    else\n"
77                  + "      rules = document.styleSheets[0].rules;\n"
78                  + "    var r = rules[1];\n"
79                  + "    log(r);\n"
80                  + "    if (r.type) {\n"
81                  + "      log(r.type);\n"
82                  + "      log(r.parentStyleSheet);\n"
83                  + "      log(r.parentRule);\n"
84                  + "      log(r.selectorText);\n"
85                  + "    } else {\n"
86                  + "      log(r.selectorText);\n"
87                  + "    }\n"
88                  + "    log(r.style.marginTop);\n"
89                  + "    r.style.marginTop = '10px';\n"
90                  + "    log(r.style.marginTop);\n"
91                  + "    log(r.style.backgroundColor);\n"
92                  + "    r.style.backgroundColor = 'red';\n"
93                  + "    log(r.style.backgroundColor);\n"
94                  + "  }\n"
95                  + "</script>\n"
96                  + "</head><body onload='test()'>\n"
97                  + "</body></html>";
98  
99          loadPageVerifyTitle2(html);
100     }
101 
102     /**
103      * @throws Exception on test failure
104      */
105     @Test
106     @Alerts({"4px", "4px", "4px", "4px"})
107     public void styleSheet() throws Exception {
108         final String html = DOCTYPE_HTML
109                 + "<html><head>\n"
110                 + "<style>\n"
111                 + "  BODY { margin: 4px; }\n"
112                 + "</style>\n"
113                 + "<script>\n"
114                 + LOG_TITLE_FUNCTION
115                 + "  function test() {\n"
116                 + "    var rules;\n"
117                 + "    if (document.styleSheets[0].cssRules)\n"
118                 + "      rules = document.styleSheets[0].cssRules;\n"
119                 + "    else\n"
120                 + "      rules = document.styleSheets[0].rules;\n"
121                 + "    var r = rules[0];\n"
122                 + "    log(r.style.marginTop);\n"
123                 + "    log(r.style.marginRight);\n"
124                 + "    log(r.style.marginBottom);\n"
125                 + "    log(r.style.marginLeft);\n"
126                 + "  }\n"
127                 + "</script>\n"
128                 + "</head><body onload='test()'>\n"
129                 + "</body></html>";
130 
131         loadPageVerifyTitle2(html);
132     }
133 
134     /**
135      * @throws Exception on test failure
136      */
137     @Test
138     @Alerts("undefined")
139     public void readOnly() throws Exception {
140         final String html = DOCTYPE_HTML
141                 + "<html><head>\n"
142                 + "<style>\n"
143                 + "  BODY { background-color: white; color: black; }\n"
144                 + "  H1 { font: 8pt Arial bold; }\n"
145                 + "  P  { font: 10pt Arial; text-indent: 0.5in; }\n"
146                 + "  A  { text-decoration: none; color: blue; }\n"
147                 + "</style>\n"
148                 + "<script>\n"
149                 + LOG_TITLE_FUNCTION
150                 + "  function test() {\n"
151                 + "    var rules;\n"
152                 + "    if (document.styleSheets[0].cssRules)\n"
153                 + "      rules = document.styleSheets[0].cssRules;\n"
154                 + "    else\n"
155                 + "      rules = document.styleSheets[0].rules;\n"
156                 + "    var r = rules[1];\n"
157                 + "    log(r.readOnly);\n"
158                 + "  }\n"
159                 + "</script>\n"
160                 + "</head><body onload='test()'>\n"
161                 + "</body></html>";
162 
163         loadPageVerifyTitle2(html);
164     }
165 
166     /**
167      * @throws Exception on test failure
168      */
169     @Test
170     @Alerts("1")
171     public void type() throws Exception {
172         final String html = DOCTYPE_HTML
173                 + "<html><head>\n"
174                 + "<style>\n"
175                 + "  BODY { background-color: white; color: black; }\n"
176                 + "  H1 { font: 8pt Arial bold; }\n"
177                 + "  P  { font: 10pt Arial; text-indent: 0.5in; }\n"
178                 + "  A  { text-decoration: none; color: blue; }\n"
179                 + "</style>\n"
180                 + "<script>\n"
181                 + LOG_TITLE_FUNCTION
182                 + "  function test() {\n"
183                 + "    var rules;\n"
184                 + "    if (document.styleSheets[0].cssRules)\n"
185                 + "      rules = document.styleSheets[0].cssRules;\n"
186                 + "    else\n"
187                 + "      rules = document.styleSheets[0].rules;\n"
188                 + "    var r = rules[1];\n"
189                 + "    log(r.type);\n"
190                 + "  }\n"
191                 + "</script>\n"
192                 + "</head><body onload='test()'>\n"
193                 + "</body></html>";
194 
195         loadPageVerifyTitle2(html);
196     }
197 
198     /**
199      * @throws Exception on test failure
200      */
201     @Test
202     @Alerts(DEFAULT = {"body", "h1", "a.foo", ".foo", ".foo .foo2", ".myFoo", "#byId"},
203             FF = {"BoDY", "H1", "A.foo", ".foo", ".foo .foo2", ".myFoo", "#byId"},
204             FF_ESR = {"BoDY", "H1", "A.foo", ".foo", ".foo .foo2", ".myFoo", "#byId"})
205     public void selectorText() throws Exception {
206         final String html = DOCTYPE_HTML
207                 + "<html><head>\n"
208                 + "<style>\n"
209                 + "  BoDY { background-color: white; color: black; }\n"
210                 + "  H1 { font: 8pt Arial bold; }\n"
211                 + "  A.foo  { color: blue; }\n"
212                 + "  .foo  { color: blue; }\n"
213                 + "  .foo .foo2 { font: 8pt; }\n"
214                 + "  .myFoo { font: 10pt; }\n"
215                 + "  #byId { font: 8pt; }\n"
216                 + "</style>\n"
217                 + "<script>\n"
218                 + LOG_TITLE_FUNCTION
219                 + "  function test() {\n"
220                 + "    var sheet = document.styleSheets[0];\n"
221                 + "    var rules = sheet.cssRules || sheet.rules;\n"
222                 + "    for (var i = 0; i < rules.length; i++)\n"
223                 + "      log(rules[i].selectorText);\n"
224                 + "  }\n"
225                 + "</script>\n"
226                 + "</head><body onload='test()'>\n"
227                 + "</body></html>";
228 
229         loadPageVerifyTitle2(html);
230     }
231 
232     /**
233      * @throws Exception on test failure
234      */
235     @Test
236     @Alerts({"1", ""})
237     @HtmlUnitNYI(CHROME = {"1",
238                            "progid:DXImageTransform.Microsoft.AlphaImageLoader"
239                                    + "(src=rightCorner.gif, sizingMethod=crop)"},
240             EDGE = {"1",
241                     "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=rightCorner.gif, sizingMethod=crop)"},
242             FF = {"1",
243                   "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=rightCorner.gif, sizingMethod=crop)"},
244             FF_ESR = {"1",
245                       "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=rightCorner.gif, sizingMethod=crop)"})
246     public void oldIEStyleFilter() throws Exception {
247         final String html = DOCTYPE_HTML
248                 + "<html><head>\n"
249                 + "<style>\n"
250                 + "  BODY { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader"
251                 + "(src='rightCorner.gif', sizingMethod='crop'); }\n"
252                 + "</style>\n"
253                 + "<script>\n"
254                 + LOG_TITLE_FUNCTION
255                 + "function test() {\n"
256                 + "  try {\n"
257                 + "    var sheet = document.styleSheets[0];\n"
258                 + "    var rules = sheet.cssRules || sheet.rules;\n"
259                 + "    log(rules.length);\n"
260                 + "    log(rules[0].style.filter);\n"
261                 + "  } catch(e) { logEx(e); }\n"
262                 + "}\n"
263                 + "</script>\n"
264                 + "</head><body onload='test()'>\n"
265                 + "</body></html>";
266 
267         loadPageVerifyTitle2(html);
268     }
269 
270     /**
271      * @throws Exception on test failure
272      */
273     @Test
274     @Alerts({"1", "none"})
275     public void filter() throws Exception {
276         final String html = DOCTYPE_HTML
277                 + "<html><head>\n"
278                 + "<style>\n"
279                 + "  BODY { filter: none; }\n"
280                 + "</style>\n"
281                 + "<script>\n"
282                 + LOG_TITLE_FUNCTION
283                 + "function test() {\n"
284                 + "  try {\n"
285                 + "    var sheet = document.styleSheets[0];\n"
286                 + "    var rules = sheet.cssRules || sheet.rules;\n"
287                 + "    log(rules.length);\n"
288                 + "    log(rules[0].style.filter);\n"
289                 + "  } catch(e) { logEx(e); }\n"
290                 + "}\n"
291                 + "</script>\n"
292                 + "</head><body onload='test()'>\n"
293                 + "</body></html>";
294 
295         loadPageVerifyTitle2(html);
296     }
297 }