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
83
84
|
<!DOCTYPE html>
<meta charset=utf-8>
<meta name="timeout" content="long">
<title>text field selection: select()</title>
<link rel="author" title="Domenic Denicola" href="mailto:d@domenic.me">
<link rel=help href="https://html.spec.whatwg.org/multipage/#textFieldSelection">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="log"></div>
<textarea>foobar</textarea>
<input type="text" value="foobar">
<input type="search" value="foobar">
<input type="tel" value="1234">
<input type="url" value="https://example.com/">
<input type="password" value="hunter2">
<script>
"use strict";
const els = [document.querySelector("textarea"), ...document.querySelectorAll("input")];
const actions = [
{
label: "select()",
action: el => el.select()
},
{
label: "selectionStart",
action: el => el.selectionStart = 1
},
{
label: "selectionEnd",
action: el => el.selectionEnd = el.value.length - 1
},
{
label: "selectionDirection",
action: el => el.selectionDirection = "backward"
},
{
label: "setSelectionRange()",
action: el => el.setSelectionRange(1, el.value.length - 1) // changes direction implicitly to none/forward
},
{
label: "setRangeText()",
action: el => el.setRangeText("newmiddle")
}
];
els.forEach((el) => {
const elLabel = el.localName === "textarea" ? "textarea" : "input type " + el.type;
actions.forEach((action) => {
// promise_test instead of async_test is important because these need to happen in sequence (to test that events
// fire if and only if the selection changes).
promise_test(t => {
const watcher = new EventWatcher(t, el, "select");
const promise = watcher.wait_for("select").then(e => {
assert_true(e.isTrusted, "isTrusted must be true");
assert_true(e.bubbles, "bubbles must be true");
assert_false(e.cancelable, "cancelable must be false");
});
action.action(el);
return promise;
}, `${elLabel}: ${action.label}`);
promise_test(t => {
el.onselect = t.unreached_func("the select event must not fire the second time");
action.action(el);
return new Promise(resolve => {
t.step_timeout(() => {
el.onselect = null;
resolve();
}, 200);
});
}, `${elLabel}: ${action.label} a second time (must not fire select)`);
});
});
</script>
|
