| <!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> |
| const element = document.createElement("div"); |
| |
| [ |
| "onclick", |
| "onchange", |
| "onfocus", |
| "oNclick", |
| "OnClIcK" |
| ].forEach(name => { |
| test(t => { |
| assert_throws_js(TypeError, |
| _ => element.setAttribute(name, "2+2")); |
| }, `Event handler ${name} should be blocked.`); |
| }); |
| |
| [ |
| "one", |
| "oNe", |
| "onIcon", |
| "offIcon", |
| "blubb" |
| ].forEach(name => { |
| test(t => { |
| element.setAttribute(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__) { |
| const should_be_event_handler = name.startsWith("on"); |
| if (should_be_event_handler) { |
| test(t => { |
| assert_throws_js(TypeError, |
| _ => element.setAttribute(name, "2+2")); |
| }, `Event handler div.${name} should be blocked.`); |
| } else { |
| test(t => { |
| element.setAttribute(name, "2+2"); |
| }, `Non-event handler div.${name} should not be blocked.`); |
| } |
| } |
| </script> |
| </body> |