| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <style> |
| .styled { |
| background-color: red; |
| width: 0; |
| height: 100px; |
| } |
| </style> |
| <script src="../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p>This test requires testRunner and window.internals.</p> |
| <div id="test" class="styled"></div> |
| <script> |
| function test() |
| { |
| if (!window.testRunner) |
| return; |
| testRunner.dumpAsText(); |
| window.testElement = document.getElementById("test"); |
| shouldBe("getComputedStyle(testElement).backgroundColor", "'rgb(255, 0, 0)'"); |
| shouldBe("testElement.offsetWidth", "0"); |
| |
| if (!window.internals) |
| return; |
| |
| // The author style above should override this user style. |
| internals.insertUserCSS("body .styled { background-color: green; width: 100px; }"); |
| shouldBe("getComputedStyle(testElement).backgroundColor", "'rgb(255, 0, 0)'"); |
| shouldBe("testElement.offsetWidth", "0"); |
| |
| // Since this style is more specific, it should override the original author style above. |
| internals.insertAuthorCSS("body .styled { background-color: green; width: 100px; }"); |
| shouldBe("getComputedStyle(testElement).backgroundColor", "'rgb(0, 128, 0)'"); |
| shouldBe("testElement.offsetWidth", "100"); |
| } |
| |
| test(); |
| </script> |
| </body> |
| </html> |