Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /html/semantics/forms/constraints/form-validation-willValidate-datalist.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<title>The constraint validation API Test: element.willValidate</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="log"></div>
<datalist></datalist>
<script>
var dl = document.querySelector("datalist");
function runTest(element, name) {
test(function () {
assert_true(element.willValidate, "The willValidate attribute should be true initially.");
dl.appendChild(element);
assert_false(element.willValidate, "The willValidate attribute should be false if element has datalist parent.");
element.remove();
assert_true(element.willValidate, "The willValidate attribute should be true if element has no parent.");
let div = document.createElement("div");
div.appendChild(element);
let foo = document.createElementNS('some-random-namespace', 'foo');
foo.appendChild(div);
dl.appendChild(foo);
assert_false(element.willValidate, "The willValidate attribute should be false if element has datalist ancestor.");
foo.remove();
assert_true(element.willValidate, "The willValidate attribute should be true if element has no datalist ancestor.");
}, name);
}
var testElements = [
{
tag: "input",
types: ["text", "search", "tel", "url", "email", "password", "datetime-local", "date", "month", "week", "time", "color", "file", "submit"]
},
{
tag: "button",
types: ["submit"],
},
{
tag: "select",
types: [],
},
{
tag: "textarea",
types: [],
}
].forEach(function(testData) {
if (testData.types.length > 0) {
testData.types.forEach(function(type) {
let ele = document.createElement(testData.tag);
try {
ele.type = type;
} catch (e) {
//Do nothing, avoid the runtime error breaking the test
}
runTest(ele, `Test ${testData.tag} element with ${type} type`);
});
} else {
runTest(document.createElement(testData.tag), `Test ${testData.tag} element`);
}
});
</script>