| <html> |
| <head> |
| <script src="../../http/tests/inspector/inspector-test.js"></script> |
| <script src="../../http/tests/inspector/elements-test.js"></script> |
| <script src="../../http/tests/inspector/debugger-test.js"></script> |
| <script> |
| |
| function test() |
| { |
| var inspectorResource; |
| |
| WebInspector.showPanel("elements"); |
| InspectorTest.selectNodeAndWaitForStyles("inspected", step1); |
| |
| function step1(node) |
| { |
| WebInspector.cssModel.addRule(node.id, "#inspected", successCallback, failureCallback); |
| |
| function successCallback() |
| { |
| // setTimwout is needed here because showScriptSource callback is triggered by uiSourceCode addRevision handling |
| // and we need to wait until the code flow exits StyleFile.addRevision. |
| InspectorTest.showScriptSource("inspector-stylesheet", setTimeout.bind(this, step2, 0)); |
| } |
| function failureCallback() |
| { |
| InspectorTest.addResult("Failed to add rule."); |
| InspectorTest.completeTest(); |
| } |
| } |
| |
| function step2(sourceFrame) |
| { |
| var uiSourceCode = sourceFrame._uiSourceCode; |
| InspectorTest.addResult("Inspector stylesheet URL: " + uiSourceCode.displayName()); |
| uiSourceCode.requestContent(printContent()); |
| |
| InspectorTest.addResult("\nSetting new content"); |
| uiSourceCode.setWorkingCopy("#inspected { background-color: green; }"); |
| uiSourceCode.commitWorkingCopy(step3.bind(this, uiSourceCode)); |
| } |
| |
| function step3(uiSourceCode) |
| { |
| uiSourceCode.requestContent(printContent(selectNode)); |
| function selectNode() |
| { |
| InspectorTest.selectNodeAndWaitForStyles("inspected", dumpStyles); |
| } |
| |
| function dumpStyles() |
| { |
| InspectorTest.dumpSelectedElementStyles(true, false, true); |
| InspectorTest.completeTest(); |
| } |
| } |
| |
| function printContent(next) |
| { |
| function result(content) |
| { |
| InspectorTest.addResult("Inspector stylesheet content:"); |
| InspectorTest.addResult(content); |
| if (next) |
| next(); |
| } |
| return result; |
| } |
| } |
| </script> |
| </head> |
| |
| <body onload="runTest()"> |
| <p> |
| Tests that adding a new rule creates inspector stylesheet resource and allows its live editing. |
| </p> |
| |
| <div id="inspected">Text</div> |
| |
| </body> |
| </html> |
