| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../http/tests/inspector/resources/inspector-test.js"></script> |
| <script src="../debugger/resources/log-active-stack-trace.js"></script> |
| <script> |
| |
| function getProperty(name) { |
| let node = document.getElementById("test"); |
| return node.style.getPropertyValue(name); |
| } |
| |
| function setProperty(name, value) { |
| let node = document.getElementById("test"); |
| if (value) |
| node.style.setProperty(name, value); |
| else |
| node.style.removeProperty(name); |
| } |
| |
| function test() |
| { |
| InspectorTest.debug(); |
| |
| let suite = InspectorTest.createAsyncSuite("DOMBreakpoints.AttributeModified.Style"); |
| |
| async function checkPropertyValue(name, expectedValue) { |
| InspectorTest.log(`Getting '${name}'...`); |
| let value = await InspectorTest.evaluateInPage(`getProperty("${name}")`); |
| InspectorTest.expectEqual(value, expectedValue, `'${name}' should have the value '${expectedValue}'.`); |
| } |
| |
| function addTestCase({name, propertyName, propertyValueBefore, propertyValueAfter}) { |
| suite.addTestCase({ |
| name, |
| async test() { |
| await checkPropertyValue(propertyName, propertyValueBefore); |
| |
| let pausedPromise = WI.debuggerManager.awaitEvent(WI.DebuggerManager.Event.Paused); |
| |
| if (propertyValueAfter) |
| InspectorTest.log(`Setting '${propertyName}: ${propertyValueAfter};'...`); |
| else |
| InspectorTest.log(`Removing '${propertyName}'...`); |
| let evaluatePromise = InspectorTest.evaluateInPage(`setProperty("${propertyName}", "${propertyValueAfter}")`); |
| |
| await pausedPromise; |
| InspectorTest.pass("Paused."); |
| |
| await checkPropertyValue(propertyName, propertyValueBefore); |
| |
| await WI.debuggerManager.resume(); |
| InspectorTest.pass("Resumed."); |
| |
| await evaluatePromise; |
| |
| await checkPropertyValue(propertyName, propertyValueAfter); |
| }, |
| }); |
| } |
| |
| addTestCase({ |
| name: "DOMBreakpoints.AttributeModified.Style.Add", |
| propertyName: "display", |
| propertyValueBefore: "", |
| propertyValueAfter: "none", |
| }); |
| addTestCase({ |
| name: "DOMBreakpoints.AttributeModified.Style.ReplaceSame", |
| propertyName: "display", |
| propertyValueBefore: "none", |
| propertyValueAfter: "none", |
| }); |
| addTestCase({ |
| name: "DOMBreakpoints.AttributeModified.Style.ReplaceDifferent", |
| propertyName: "display", |
| propertyValueBefore: "none", |
| propertyValueAfter: "block", |
| }); |
| addTestCase({ |
| name: "DOMBreakpoints.AttributeModified.Style.Remove", |
| propertyName: "display", |
| propertyValueBefore: "block", |
| propertyValueAfter: "", |
| }); |
| |
| suite.addTestCase({ |
| name: "DOMBreakpoints.AttributeModified.Style.Text", |
| async test() { |
| await checkPropertyValue("display", ""); |
| |
| let pausedPromise = WI.debuggerManager.awaitEvent(WI.DebuggerManager.Event.Paused); |
| |
| InspectorTest.log(`Setting style text to ''...`); |
| let evaluatePromise = InspectorTest.evaluateInPage(`document.getElementById("test").style.cssText = "display: none;";`); |
| |
| await pausedPromise; |
| InspectorTest.pass("Paused."); |
| |
| await checkPropertyValue("display", ""); |
| |
| await WI.debuggerManager.resume(); |
| InspectorTest.pass("Resumed."); |
| |
| await evaluatePromise; |
| |
| await checkPropertyValue("display", "none"); |
| }, |
| }); |
| |
| WI.domManager.requestDocument((documentNode) => { |
| if (!documentNode) { |
| InspectorTest.fail("Missing document node"); |
| InspectorTest.completeTest(); |
| return; |
| } |
| |
| WI.domManager.querySelector(documentNode.id, "#test", async (nodeId) => { |
| let testNode = WI.domManager.nodeForId(nodeId); |
| if (!testNode) { |
| InspectorTest.fail("Missing #test node"); |
| InspectorTest.completeTest(); |
| return; |
| } |
| |
| let promise = WI.domDebuggerManager.awaitEvent(WI.DOMDebuggerManager.Event.DOMBreakpointAdded) |
| .then((event) => { |
| InspectorTest.pass("Added attribute modified breakpoint to #test."); |
| }); |
| |
| InspectorTest.log("Adding attribute modified breakpoint to #test..."); |
| WI.domDebuggerManager.addDOMBreakpoint(new WI.DOMBreakpoint(testNode, WI.DOMBreakpoint.Type.AttributeModified)); |
| await promise; |
| |
| InspectorTest.assert(!WI.debuggerManager.paused, "Should not be paused."); |
| |
| suite.runTestCasesAndFinish(); |
| }); |
| }); |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <p>Tests functionality of attribute modified DOM breakpoints when modifying the inline style attribute.</p> |
| <div id="test"></div> |
| </body> |
| </html> |
