| <!doctype html> |
| <meta charset=utf-8> |
| <title></title> |
| <script src=/resources/testharness.js></script> |
| <script src=/resources/testharnessreport.js></script> |
| <div id=log></div> |
| <div id=target></div> |
| <script> |
| var target = document.getElementById("target"); |
| var sometext = "something"; |
| var shorttext = "abc"; |
| var elemData = [ |
| { |
| desc: "textarea not in body", |
| factory: () => document.createElement("textarea"), |
| }, |
| { |
| desc: "input not in body", |
| factory: () => document.createElement("input"), |
| }, |
| { |
| desc: "textarea in body", |
| factory: () => document.body.appendChild(document.createElement("textarea")), |
| }, |
| { |
| desc: "input in body", |
| factory: () => document.body.appendChild(document.createElement("input")), |
| }, |
| { |
| desc: "textarea in body with parsed default value", |
| factory: () => { |
| target.innerHTML = "<textarea>abcdefghij</textarea>" |
| return target.querySelector("textarea"); |
| }, |
| }, |
| { |
| desc: "input in body with parsed default value", |
| factory: () => { |
| target.innerHTML = "<input value='abcdefghij'>" |
| return target.querySelector("input"); |
| }, |
| }, |
| { |
| desc: "focused textarea", |
| factory: () => { |
| var t = document.body.appendChild(document.createElement("textarea")); |
| t.focus(); |
| return t; |
| }, |
| }, |
| { |
| desc: "focused input", |
| factory: () => { |
| var i = document.body.appendChild(document.createElement("input")); |
| i.focus(); |
| return i; |
| }, |
| }, |
| { |
| desc: "focused then blurred textarea", |
| factory: () => { |
| var t = document.body.appendChild(document.createElement("textarea")); |
| t.focus(); |
| t.blur(); |
| return t; |
| }, |
| }, |
| { |
| desc: "focused then blurred input", |
| factory: () => { |
| var i = document.body.appendChild(document.createElement("input")); |
| i.focus(); |
| i.blur() |
| return i; |
| }, |
| }, |
| ]; |
| |
| for (var data of elemData) { |
| test(function() { |
| var el = data.factory(); |
| this.add_cleanup(() => el.remove()); |
| el.defaultValue = sometext; |
| assert_true(sometext.length > 8, |
| "sometext too short, test won't work right"); |
| el.selectionStart = 4; |
| el.selectionEnd = 6; |
| el.setRangeText("xyz"); |
| el.defaultValue = "set range text"; |
| assert_equals(el.value, sometext.slice(0, 4) + "xyz" + sometext.slice(6), |
| "Calling setRangeText should set the value dirty flag"); |
| }, `value dirty flag behavior after setRangeText on ${data.desc}`); |
| } |
| |
| for (var tag of ['input', 'textarea']) { |
| test(function() { |
| var el = document.createElement(tag); |
| document.body.appendChild(el); |
| this.add_cleanup(() => el.remove()); |
| |
| for (let val of ["", "foo", "foobar"]) { |
| el.value = val; |
| assert_equals(el.selectionStart, val.length, |
| "element.selectionStart should be value.length"); |
| assert_equals(el.selectionEnd, val.length, |
| "element.selectionEnd should be value.length"); |
| } |
| }, `selection is collapsed to the end after changing values on ${tag}`); |
| |
| test(function() { |
| var el = document.createElement(tag); |
| document.body.appendChild(el); |
| this.add_cleanup(() => el.remove()); |
| |
| el.value = "foobar" |
| el.selectionStart = 2 |
| el.selectionEnd = 4 |
| el.value = "foobar" |
| |
| assert_equals(el.selectionStart, 2, |
| "element.selectionStart should be unchanged"); |
| assert_equals(el.selectionEnd, 4, |
| "element.selectionEnd should be unchanged"); |
| }, `selection is not collapsed to the end when value is set to its existing value on ${tag}`); |
| } |
| |
| </script> |