blob: 65ce6ff43ca1b92558c28bf1fed2787a6e90869d [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
<script>
function test()
{
let domNode;
let suite = InspectorTest.createAsyncSuite("DOM.setOuterHTML");
suite.addTestCase({
name: "OuterHTMLBefore",
description: "Log the initial outerHTML of the target element.",
test(resolve, reject) {
domNode.getOuterHTML(function(error, outerHTML) {
InspectorTest.expectNoError(error);
InspectorTest.log(outerHTML);
resolve();
});
}
});
const emptyOuterHTML = `<div id="x"></div>`;
const newOuterHTML = `
<div id="x" style="display:none; color:red">
<div class="container">
<h1>A Title</h1>
<p>A Paragraph</p>
</div>
</div>`.trim();
const modifiedOuterHTML = `
<div id="x" style="display:none; color:red">
<div class="container">
<h1>A Different Title</h1>
<p>A Paragraph</p>
</div>
</div>`.trim();
let steps = [
["RemovingElements", emptyOuterHTML],
["AddingElements", newOuterHTML],
["ModifyingElements", modifiedOuterHTML],
];
steps.forEach(function(tuple) {
let [title, replacementOuterHTML] = tuple;
suite.addTestCase({
name: `SetOuterHTML${title}`,
description: "Change the outerHTML.",
test(resolve, reject) {
domNode.setOuterHTML(replacementOuterHTML, function(error, outerHTML) {
InspectorTest.expectNoError(error);
resolve();
});
}
});
suite.addTestCase({
name: `CheckOuterHTMLAfter${title}`,
description: "Log the outerHTML of the target element after changes.",
test(resolve, reject) {
domNode.getOuterHTML(function(error, outerHTML) {
InspectorTest.expectNoError(error);
InspectorTest.expectThat(outerHTML === replacementOuterHTML, "The outerHTML should be what was just set.");
InspectorTest.log(outerHTML);
resolve();
});
}
});
});
WI.domManager.requestDocument(function(documentNode) {
WI.domManager.querySelector(documentNode.id, "#x", function(nodeId) {
domNode = WI.domManager.nodeForId(nodeId);
InspectorTest.assert(domNode, "DOMNode exists.");
suite.runTestCasesAndFinish();
});
});
}
</script>
</head>
<body onload="runTest()">
<p>Test for DOM.setOuterHTML (Edit as HTML).</p>
<div id="x" style="display:none">
<h1>Original Title</h1>
<p>Original Paragraph</p>
</div>
</body>
</html>