Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /html/webappapis/dynamic-markup-insertion/html-unsafe-methods/setHTMLUnsafe.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<link rel=author href="mailto:jarhar@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<body>
<script>
for (const containerType of ['Element', 'ShadowRoot']) {
const createContainer = () => {
if (containerType == 'ShadowRoot') {
return document.createElement('div').attachShadow({mode: 'open'});
} else if (containerType == 'Element') {
return document.createElement('div');
}
};
test(() => {
const container = createContainer();
container.setHTMLUnsafe('<span title=hello>world</span>');
assert_equals(container.children.length, 1, 'Only one child node should be created.');
assert_equals(container.firstChild.tagName, 'SPAN', 'The child element should be a span.');
assert_equals(container.firstChild.getAttribute('title'), 'hello',
'The title attribute should be set to hello.');
assert_equals(container.firstChild.childNodes.length, 1,
'The span should have one child.');
assert_true(container.firstChild.childNodes[0] instanceof Text,
'The spans child should be a text node.');
assert_equals(container.firstChild.textContent, 'world',
'The spans textContent should be world.');
}, `${containerType}: setHTMLUnsafe with no shadowdom.`);
test(() => {
const container = createContainer();
container.setHTMLUnsafe(`<div><template shadowrootmode=open><div>hello</div></template></div>`);
assert_equals(container.children.length, 1, 'One child should be created in the container.');
const shadowRoot = container.firstChild.shadowRoot;
assert_true(!!shadowRoot, 'The containers child should have a ShadowRoot.');
assert_equals(shadowRoot.children.length, 1, 'One child should be created in the ShadowRoot.');
assert_equals(shadowRoot.firstChild.textContent, 'hello',
'The ShadowRoots childs textContent should be hello.');
}, `${containerType}: setHTMLUnsafe with shadowdom.`);
}
test(() => {
const template = document.createElement('template');
template.setHTMLUnsafe('<div>hello world</div>');
assert_equals(template.children.length, 0, 'template should not have any child nodes.');
assert_equals(template.content.children.length, 1, 'template content should have a child div.');
assert_equals(template.content.children[0].textContent, 'hello world', 'text content should be set.');
}, 'template.setHTMLUnsafe() should modify template content fragment rather than actual children.');
</script>