| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| * { margin: 0; padding: 0; } |
| |
| @media only screen and (min-width: 0px) { |
| body > div { |
| display: block; |
| width: 100%; |
| text-align: center; |
| } |
| } |
| </style> |
| <script src="../../http/tests/inspector/resources/inspector-test.js"></script> |
| <script> |
| function test() { |
| let nodeStyles; |
| let suite = InspectorTest.createAsyncSuite("CSS.generateCSSRuleString"); |
| |
| function validateSelectors() |
| { |
| suite.addTestCase({ |
| name: "InlineStyleString", |
| description: "Check the formatting of the generated inline style string.", |
| test(resolve, reject) { |
| InspectorTest.log(nodeStyles.inlineStyle.generateCSSRuleString()); |
| resolve(); |
| } |
| }); |
| |
| for (let i = 0; i < nodeStyles.matchedRules.length; ++i) { |
| let rule = nodeStyles.matchedRules[i]; |
| suite.addTestCase({ |
| name: "CSSRuleString" + i, |
| description: "Check the formatting of the generated string for the matched CSS rule.", |
| test(resolve, reject) { |
| InspectorTest.log(rule.style.generateCSSRuleString()); |
| resolve(); |
| } |
| }); |
| } |
| |
| suite.runTestCasesAndFinish(); |
| } |
| |
| WI.domTreeManager.requestDocument((documentNode) => { |
| WI.domTreeManager.querySelector(documentNode.id, "#test-node", (contentNodeId) => { |
| if (!contentNodeId) { |
| InspectorTest.log("DOM node not found."); |
| InspectorTest.completeTest(); |
| return; |
| } |
| |
| let domNode = WI.domTreeManager.nodeForId(contentNodeId); |
| nodeStyles = WI.cssStyleManager.stylesForNode(domNode); |
| if (nodeStyles.needsRefresh) { |
| nodeStyles.awaitEvent(WI.DOMNodeStyles.Event.Refreshed) |
| .then(validateSelectors); |
| } else |
| validateSelectors(); |
| }); |
| }); |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <p>Testing that generated CSS rule strings have proper formatting.</p> |
| |
| <div id="test-node" style="background-color: red;"></div> |
| </body> |
| </html> |
