blob: 6d23361e7951dfbb373f73819d67d2197a47108f [file] [log] [blame]
<html>
<head>
<script src="../../../http/tests/inspector/inspector-test.js"></script>
<script src="../../../http/tests/inspector/elements-test.js"></script>
<script>
function test()
{
InspectorTest.selectNodeAndWaitForStyles("inspected", step1);
var treeElement;
var section;
function step1()
{
InspectorTest.dumpSelectedElementStyles(true);
treeElement = InspectorTest.getElementStylePropertyTreeItem("color");
treeElement.startEditing();
treeElement.nameElement.textContent = "color";
treeElement.nameElement.dispatchEvent(InspectorTest.createKeyEvent("Enter"));
// Update incrementally, do not commit.
treeElement.valueElement.textContent = "green";
treeElement.kickFreeFlowStyleEditForTest();
// Cancel editing.
treeElement.valueElement.firstChild.select();
InspectorTest.waitForStyleApplied(onStyleApplied);
function onStyleApplied()
{
treeElement.valueElement.dispatchEvent(InspectorTest.createKeyEvent("Escape"));
InspectorTest.waitForStyleApplied(onStyleReverted);
}
function onStyleReverted()
{
InspectorTest.selectNodeWithId("other", step2);
}
}
function step2()
{
InspectorTest.selectNodeAndWaitForStyles("inspected", step3);
}
function step3()
{
InspectorTest.addResult("After append:");
InspectorTest.dumpSelectedElementStyles(true);
InspectorTest.completeTest();
}
}
</script>
</head>
<body onload="runTest()">
<p>
Tests that editing is canceled properly after incremental editing.
</p>
<div id="inspected" style="color: red">Text</div>
<div id="other"></div>
</body>
</html>