1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
|
<!DOCTYPE html>
<title>Test for bugs 1772841 and 1865885</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<link rel="stylesheet" href="/tests/SimpleTest/test.css"/>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1772841">Mozilla Bug 1772841</a> and <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1865885">Mozilla Bug 1865885</a>
<div id="content">
<!-- Disabled -->
<input type="date" id="date" disabled>
<input type="time" id="time" disabled>
<input type="datetime-local" id="datetime-local" disabled>
<fieldset id="fieldset" disabled>
<input type="date" id="fieldset-date">
<input type="time" id="fieldset-time">
<input type="datetime-local" id="fieldset-datetime-local">
</fieldset>
<!-- Dynamically disabled -->
<input type="date" id="date1">
<input type="time" id="time1">
<input type="datetime-local" id="datetime-local1">
<fieldset id="fieldset1">
<input type="date" id="fieldset-date1">
<input type="time" id="fieldset-time1">
<input type="datetime-local" id="fieldset-datetime-local1">
</fieldset>
<!-- Dynamically enabled -->
<input type="date" id="date2" disabled>
<input type="time" id="time2" disabled>
<input type="datetime-local" id="datetime-local2" disabled>
<fieldset id="fieldset2" disabled>
<input type="date" id="fieldset-date2">
<input type="time" id="fieldset-time2">
<input type="datetime-local" id="fieldset-datetime-local2">
</fieldset>
</div>
<script>
/*
* Test for bugs 1772841 and 1865885
* This test checks that when a datetime input element is disabled by itself
* or from its containing fieldset, it should not be focusable by click.
**/
add_task(async function() {
await SimpleTest.promiseFocus(window);
for (let inputId of ["time", "date", "datetime-local", "fieldset-time", "fieldset-date", "fieldset-datetime-local"]) {
testFocusState(inputId, /* isDisabled = */ true);
testDynamicChange(inputId, "1", /* isDisabling = */ true);
testDynamicChange(inputId, "2", /* isDisabling = */ false);
}
})
function testFocusState(inputId, isDisabled) {
let input = document.getElementById(inputId);
document.getElementById("content").click();
input.click();
if (isDisabled) {
isnot(document.activeElement, input, `This disabled ${inputId} input should not be focusable by click`);
} else {
// The click method won't set the focus on clicked input, thus we
// only check that the state is changed to enabled here
ok(!input.disabled, `This ${inputId} input is not disabled`);
}
document.getElementById("content").click();
synthesizeMouseAtCenter(input, {});
if (isDisabled) {
isnot(document.activeElement, input, `This disabled ${inputId} input should not be focusable by click`);
} else {
is(document.activeElement, input, `This enabled ${inputId} input should be focusable by click`);
}
}
function testDynamicChange(inputId, index, isDisabling) {
if (inputId.split("-")[0] === "fieldset") {
document.getElementById("fieldset" + index).disabled = isDisabling;
} else {
document.getElementById(inputId + index).disabled = isDisabling;
}
testFocusState(inputId + index, /* isDisabled = */ isDisabling);
}
</script>
|
