| <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> |
| <link rel="stylesheet"> |
| <script> |
| |
| function insertStyleSheet() |
| { |
| var link = document.querySelector("link"); |
| link.setAttribute("href", "resources/test-ssp-editing.css"); |
| } |
| |
| function test() |
| { |
| var sourceCode; |
| Runtime.experiments.enableForTest("liveSASS"); |
| InspectorTest.evaluateInPage("insertStyleSheet()", onStyleSheet); |
| |
| function onStyleSheet() |
| { |
| InspectorTest.waitForScriptSource("test-ssp-editing.scss", onSASS); |
| } |
| |
| function onSASS(sc) |
| { |
| sourceCode = sc; |
| InspectorTest.selectNodeAndWaitForStyles("inspected", step1); |
| } |
| |
| function step1() |
| { |
| var treeElement = InspectorTest.getMatchedStylePropertyTreeItem("color"); |
| treeElement.startEditing(treeElement.valueElement); |
| treeElement.valueElement.textContent = "blue"; |
| treeElement.valueElement.dispatchEvent(InspectorTest.createKeyEvent("Enter")); |
| InspectorTest.waitForStyleApplied(step2); |
| } |
| |
| function step2() |
| { |
| InspectorTest.addResult(sourceCode.workingCopy()); |
| InspectorTest.completeTest(); |
| } |
| } |
| |
| </script> |
| </head> |
| |
| <body onload="runTest()"> |
| <p> |
| Tests that editing a CSS property value results in updated SASS file. |
| </p> |
| |
| <div id="inspected"></div> |
| </body> |
| </html> |
