<!
DOCTYPE html>
<
meta charset=
"utf-8">
<
title>Clear disabled/readonly datetime inputs</
title>
<
script src=
"/tests/SimpleTest/SimpleTest.js"></
script>
<
script src=
"/tests/SimpleTest/EventUtils.js"></
script>
<p>Disabled inputs should be able to be cleared just as they can be set with real values</p>
<
input type=
"date" id=
"date1" value=
"2020-08-11" disabled>
<
input type=
"date" id=
"date2" value=
"2020-08-11" readonly>
<
input type=
"time" id=
"time1" value=
"07:01" disabled>
<
input type=
"time" id=
"time2" value=
"07:01" readonly>
<
script>
/* global date1, date2, time1, time2 */
function querySelectorAllShadow(parent, selector) {
const shadowRoot = SpecialPowers.wrap(parent).openOrClosedShadowRoot;
return shadowRoot.querySelectorAll(selector);
}
date1.value = date2.value =
"";
time1.value = time2.value =
"";
for (const date of [date1, date2]) {
const fields = [...querySelectorAllShadow(date,
".datetime-edit-field")];
is(fields.length,
3,
"Three numeric fields are expected");
for (const field of fields) {
is(field.getAttribute(
"value"),
"",
"All fields should be cleared");
}
}
for (const
time of [time1, time2]) {
const fields = [...querySelectorAllShadow(
time,
".datetime-edit-field")];
ok(fields.length >=
2,
"At least two numeric fields are expected");
for (const field of fields) {
is(field.getAttribute(
"value"),
"",
"All fields should be cleared");
}
}
</
script>
