| <html> |
| <head> |
| <style type="text/css"> |
| .pass { color: green; } |
| .fail { color: red; } |
| </style> |
| <style type="text/css"> |
| .foo { color: black; } |
| @media screen { |
| .bar { color: blue; } |
| } |
| @keyframes name { } |
| @page { } |
| </style> |
| <script> |
| function printOut(msg) { |
| var console = document.getElementById("console"); |
| var span = document.createElement('span'); |
| span.innerHTML = msg + '<br>'; |
| console.appendChild(span); |
| } |
| |
| function resultStringifier(result) |
| { |
| if (result === "") |
| return "<b>the empty string</b>"; |
| else if (result === undefined) |
| return "<b>undefined</b>"; |
| else if (result === null) |
| return "<b>null</b>"; |
| return "the string '" + result + "'"; |
| } |
| |
| function nullTestElementAttribute(elementType, element, attr, expected) |
| { |
| element[attr] = null; |
| |
| var result; |
| if (element[attr] === expected) |
| result = "<span class='pass'>TEST SUCCEEDED:</span> The value was " + resultStringifier(expected) + "."; |
| else |
| result = "<span class='fail'>TEST FAILED:</span> The value should have been " + resultStringifier(expected) + " but was " + resultStringifier(element[attr]) + "."; |
| |
| result += " [tested " + elementType + "." + attr + "]"; |
| printOut(result); |
| } |
| |
| function runTests() { |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| var rules = document.styleSheets[1].cssRules; |
| |
| var rule = rules[0]; |
| var mediaRule = rules[1]; |
| var keyframesRule = rules[2]; |
| var pageRule = rules[3]; |
| var style = rule.style; |
| var mediaList = mediaRule.media; |
| |
| var listing = [ |
| { |
| type: 'CSSRule', |
| elementToUse: rule, |
| attributes: [ |
| // 'null' is not a valid rule, so the setter does nothing. |
| {name: 'cssText', expectedNull: '.foo { color: black; }'} |
| ] |
| }, |
| { |
| type: 'CSSKeyframesRule', |
| elementToUse: keyframesRule, |
| attributes: [ |
| {name: 'name', expectedNull: 'null'} |
| ] |
| }, |
| { |
| type: 'CSSPageRule', |
| elementToUse: pageRule, |
| attributes: [ |
| {name: 'selectorText', expectedNull: 'null'} |
| ] |
| }, |
| { |
| type: 'CSSStyleRule', |
| elementToUse: rule, |
| attributes: [ |
| {name: 'selectorText', expectedNull: 'null'} |
| ] |
| }, |
| { |
| type: 'CSSStyleDeclaration', |
| elementToUse: style, |
| attributes: [ |
| // cssText detects syntax errors, such as JS null, and sets the value to the empty string. |
| {name: 'cssText', expectedNull: ''} |
| ] |
| }, |
| { |
| type: 'MediaList', |
| elementToUse: mediaList, |
| attributes: [ |
| {name: 'mediaText', expectedNull: ''} |
| ] |
| } |
| ]; |
| |
| for (element in listing) { |
| var type = listing[element].type; |
| var elementToUse = listing[element].elementToUse; |
| var attrs = listing[element].attributes; |
| for (attr in attrs) { |
| nullTestElementAttribute(type, elementToUse, attrs[attr].name, attrs[attr].expectedNull); |
| } |
| printOut(''); |
| } |
| } |
| </script> |
| </head> |
| <body onload="runTests()"> |
| <p>This test setting various attributes of a CSSOM elements to JavaScript null.</p> |
| <div id="console"></div> |
| </body> |
| </html> |
