Skip to content

Commit e2b8051

Browse files
powdercloudlutien
authored andcommitted
Bug 1966220 [wpt PR 52510] - [soft navs] Add smoke test for DOM modification support.,
Automatic update from web-platform-tests [soft navs] Add smoke test for DOM modification support. For now, this tests that we support Element.innerHTML, Node.appendChild, and Node.insertBefore, Document.importNode, Document.adoptNode, and template element. This isn't a fix for the bug mentioned here, but hopefully some baby steps towards it. :-) Bug: 328783345 Change-Id: I4be5de236acc8cf7da37a665b26c77f6f7f218ef Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6532832 Commit-Queue: Johannes Henkel <[email protected]> Reviewed-by: Michal Mocny <[email protected]> Cr-Commit-Position: refs/heads/main@{#1459667} -- wpt-commits: af1e34f8e178a17780fa230b01f4ecc13a83f107 wpt-pr: 52510 Differential Revision: https://phabricator.services.mozilla.com/D250158
1 parent 022520b commit e2b8051

File tree

1 file changed

+116
-0
lines changed
  • testing/web-platform/tests/soft-navigation-heuristics/smoke/tentative

1 file changed

+116
-0
lines changed
Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>The DOM Modification Criterion for Soft Navigation Detection.</title>
6+
<script src="/resources/testharness.js"></script>
7+
<script src="/resources/testharnessreport.js"></script>
8+
<script src="/resources/testdriver.js"></script>
9+
<script src="/resources/testdriver-vendor.js"></script>
10+
<script>
11+
// Uses Element.innerHTML to add to the DOM.
12+
// https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML
13+
function elementInnerHTML() {
14+
document.getElementById("element-inner-html").innerHTML = "<div>Hello, World.</div>";
15+
history.pushState({}, "", "/element-inner-html");
16+
}
17+
18+
// Uses Node.appendChild to add to the DOM.
19+
// https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild
20+
function nodeAppendChild() {
21+
const greeting = document.createElement("div");
22+
greeting.textContent = "Hello, World.";
23+
document.body.appendChild(greeting);
24+
history.pushState({}, "", "/node-append-child");
25+
}
26+
27+
// Uses Node.insertBefore to add to the DOM.
28+
// https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore
29+
function nodeInsertBefore() {
30+
const greeting = document.createElement("div");
31+
greeting.textContent = "Hello, World.";
32+
document.body.insertBefore(greeting, document.body.firstChild);
33+
history.pushState({}, "", "/node-insert-before");
34+
}
35+
36+
// Uses Document.importNode to add to the DOM.
37+
// https://developer.mozilla.org/en-US/docs/Web/API/Document/importNode
38+
function documentImportNode() {
39+
const iframe = document.getElementById("iframe-example");
40+
const oldNode = iframe.contentWindow.document.getElementById("import-this");
41+
const newNode = document.importNode(oldNode, true);
42+
document.body.appendChild(newNode);
43+
history.pushState({}, "", "/document-import-node");
44+
}
45+
46+
// Uses Document.adoptNode to add to the DOM.
47+
// https://developer.mozilla.org/en-US/docs/Web/API/Document/adoptNode
48+
function documentAdoptNode() {
49+
const iframe = document.getElementById("iframe-example");
50+
const oldNode = iframe.contentWindow.document.getElementById("import-this");
51+
const newNode = document.adoptNode(oldNode);
52+
document.body.appendChild(newNode);
53+
history.pushState({}, "", "/document-adopt-node");
54+
}
55+
56+
// Uses a template element to add to the DOM.
57+
// https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/template
58+
function templateElement() {
59+
const template = document.getElementById("template-example");
60+
const cloned = template.content.cloneNode(true);
61+
document.body.appendChild(cloned);
62+
history.pushState({}, "", "/template-element");
63+
}
64+
</script>
65+
</head>
66+
<body>
67+
<div id="element-inner-html" onclick="elementInnerHTML()">Click here!</div>
68+
<div id="node-append-child" onclick="nodeAppendChild()">Click here!</div>
69+
<div id="node-insert-before" onclick="nodeInsertBefore()">Click here!</div>
70+
<div id="document-import-node" onclick="documentImportNode()">Click here!</div>
71+
<div id="document-adopt-node" onclick="documentAdoptNode()">Click here!</div>
72+
<div id="template-element" onclick="templateElement()">Click here!</div>
73+
74+
<iframe id="iframe-example" srcdoc="&lt;div id='import-this'>Hello, World.&lt;/div>"></iframe>
75+
76+
<template id="template-example">
77+
<div>Hello, World.</div>
78+
</template>
79+
80+
<script>
81+
function test_template(test_id, description) {
82+
promise_test(async (t) => {
83+
let entries;
84+
new PerformanceObserver((list, observer) => {
85+
entries = list.getEntries();
86+
observer.disconnect();
87+
}).observe({ type: "soft-navigation" });
88+
if (test_driver) {
89+
test_driver.click(document.getElementById(test_id));
90+
}
91+
await t.step_wait(() => entries !== undefined, "Soft navigation event not fired.");
92+
93+
assert_equals(entries.length, 1, "Expected exactly one soft navigation.");
94+
assert_equals(
95+
entries[0].name.replace(/.*\//, ""),
96+
test_id,
97+
"URL should end with the test ID.",
98+
);
99+
}, description);
100+
}
101+
102+
test_template("element-inner-html", "Soft Navigation Detection supports Element.innerHTML.");
103+
test_template("node-append-child", "Soft Navigation Detection supports Node.appendChild.");
104+
test_template("node-insert-before", "Soft Navigation Detection supports Node.insertBefore.");
105+
test_template(
106+
"document-import-node",
107+
"Soft Navigation Detection supports Document.importNode.",
108+
);
109+
test_template(
110+
"document-adopt-node",
111+
"Soft Navigation Detection supports Document.adoptNode.",
112+
);
113+
test_template("template-element", "Soft Navigation Detection supports template elements.");
114+
</script>
115+
</body>
116+
</html>

0 commit comments

Comments
 (0)