Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that expects 4 subtest issues.
- This WPT test may be referenced by the following Test IDs:
- /trusted-types/trusted-types-event-handlers.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<meta http-equiv="Content-Security-Policy" content="require-trusted-types-for 'script'">
</head>
<body>
<script>
// The default namespace of `setAttribute` is null, see step 4 of
// Hence call `setAttributeNS` with null.
const element = document.createElement("div");
[
"onclick",
"onchange",
"onfocus",
"oNclick",
"OnClIcK"
].forEach(name => {
test(t => {
assert_throws_js(TypeError,
_ => element.setAttribute(name, "2+2"));
// `setAttributeNS` doesn't convert to lowercase, see
if (name == name.toLowerCase()) {
assert_throws_js(TypeError,
_ => element.setAttributeNS(null, name, "2+2"));
}
}, `Event handler ${name} should be blocked.`);
});
[
"one",
"oNe",
"onIcon",
"offIcon",
"blubb"
].forEach(name => {
test(t => {
element.setAttribute(name, "2+2");
element.setAttributeNS(null, name, "2+2");
}, `Non-event handler ${name} should not be blocked.`);
});
// We'd like to be sure we're not missing anything. Let's "query" an HTML
// element about which attributes it knows.
const div = document.createElement("div");
for(name in div.__proto__) {
// This captures all "on{foo}" handlers, but not "on" itself, which is an IDL
// attribute that returns an Observable.
const should_be_event_handler = name.startsWith("on") && name !== "on";
if (should_be_event_handler) {
test(t => {
assert_throws_js(TypeError,
_ => element.setAttribute(name, "2+2"));
assert_throws_js(TypeError,
_ => element.setAttributeNS(null, name, "2+2"));
}, `Event handler div.${name} should be blocked.`);
} else {
// Rather than going through all the non-event handler, we randomly choose
// a few examples to test.
if (name == "align" || name == "title" || name == "inert" || name == "draggable") {
test(t => {
element.setAttribute(name, "2+2");
}, `Non-event handler div.${name} should not be blocked.`);
}
}
}
</script>
</body>