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 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153
|
<!doctype html>
<meta charset=utf-8>
<title></title>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<div id=log></div>
<form id="form"><input id="form-input" type="text" value="abc" /></form>
<script>
// * Should we test setting the dirty flag in any way that isn't
// setting the value?
// * How to simulate users typing?
test(function() {
var el = document.createElement("textarea");
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
el.defaultValue = "123";
assert_equals(el.value.length, 3);
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
}, "Setting defaultValue in a textarea should NOT move the cursor to the end");
test(function() {
var el = document.createElement("textarea");
el.value = "abcdef";
assert_equals(el.selectionStart, 6);
assert_equals(el.selectionEnd, 6);
el.defaultValue = "123";
assert_equals(el.value.length, 6);
assert_equals(el.selectionStart, 6);
assert_equals(el.selectionEnd, 6);
}, "Setting defaultValue in a textarea with a value should NOT make any difference");
test(function() {
var el = document.createElement("textarea");
el.appendChild(document.createTextNode("abcdef"));
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
el.textContent = "abcdef123456";
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
}, "Setting textContent in a textarea should NOT move selection{Start,End} to the end");
test(function() {
var el = document.createElement("textarea");
el.appendChild(document.createTextNode("abcdef"));
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
el.appendChild(document.createTextNode("123456"));
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
}, "Adding children to a textarea should NOT move selection{Start,End} to the end");
test(function() {
var el = document.createElement("textarea");
el.appendChild(document.createTextNode("abcdef"));
el.appendChild(document.createTextNode("123"));
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
el.removeChild(el.firstChild);
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
}, "Removing children from a textarea should NOT update selection{Start,End}");
test(function() {
var el = document.createElement("textarea");
el.textContent = "abcdef\nwhatevs";
el.selectionStart = 3;
el.selectionEnd = 5;
el.firstChild.data = "abcdef\r\nwhatevs";
assert_equals(el.selectionStart, 3);
assert_equals(el.selectionEnd, 5);
}, "Setting the same value (with different newlines) in a textarea should NOT update selection{Start,End}");
test(function() {
var el = document.createElement("textarea");
el.textContent = "foobar";
el.selectionStart = 3;
el.selectionEnd = 5;
el.firstChild.remove();
assert_equals(el.selectionStart, 0, 'selectionStart after node removal');
assert_equals(el.selectionEnd, 0, 'selectionEnd after node removal');
el.appendChild(document.createTextNode("foobar"));
assert_equals(el.selectionStart, 0, 'selectionStart after appendChild');
assert_equals(el.selectionEnd, 0, 'selectionEnd after appendChild');
el.selectionStart = 3;
el.selectionEnd = 5;
el.textContent = "foobar2"; // This removes the child node first.
assert_equals(el.selectionStart, 0, 'selectionStart after textContent setter');
assert_equals(el.selectionEnd, 0, 'selectionEnd after textContent setter');
el.selectionStart = 3;
el.selectionEnd = 5;
el.defaultValue = "foobar"; // Same as textContent setter.
assert_equals(el.selectionStart, 0, 'selectionStart after defaultValue setter');
assert_equals(el.selectionEnd, 0, 'selectionEnd after defaultValue setter');
}, "Removing child nodes in non-dirty textarea should make selection{Start,End} 0");
test(function() {
var el = document.createElement("textarea");
el.defaultValue = "123";
assert_equals(el.value.length, 3);
el.selectionStart = 3;
el.selectionEnd = 3;
el.value = "12";
assert_equals(el.value.length, 2);
assert_equals(el.selectionStart, 2);
assert_equals(el.selectionEnd, 2);
}, "Setting value to a shorter string than defaultValue should correct the cursor position");
test(function() {
var el = document.createElement("input");
el.type = "text";
el.value = "http://example.com ";
assert_equals(el.selectionStart, 21);
assert_equals(el.selectionEnd, 21);
el.type = "url";
assert_equals(el.selectionStart, 18);
assert_equals(el.selectionEnd, 18);
}, "Shortening value by turning the input type into 'url' should correct selection{Start,End}");
test(function() {
var el = document.createElement("input");
el.type = "text";
el.value = "#123456xx";
assert_equals(el.selectionStart, 9);
assert_equals(el.selectionEnd, 9);
el.type = "color";
el.type = "text";
// https://html.spec.whatwg.org/C/input.html#the-input-element:attr-input-type-15
// 9. If previouslySelectable is false and nowSelectable is true, set the
// element's text entry cursor position to the beginning of the text
// control, ...
assert_equals(el.selectionStart, 0);
assert_equals(el.selectionEnd, 0);
}, "Shortening value by turning the input type into 'color' and back to 'text' should correct selection{Start,End}");
test(function() {
var form = document.getElementById("form");
var el = document.getElementById("form-input");
el.value = "abcde";
assert_equals(el.value.length, 5);
form.reset();
assert_equals(el.value.length, 3);
assert_equals(el.selectionStart, 3);
assert_equals(el.selectionEnd, 3);
}, "Resetting a value to a shorter string than defaultValue should correct the cursor position");
</script>
|