summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/fast/forms/text/input-text-paste-maxlength.html
blob: 6ccbf4d04bf70342f631a84918762e12906edf1b (plain)
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
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>

<div id=container>
<input type="text" id="f" size="5" maxlength="4">
<input type="text" id="e" size="5" maxlength="4">
<input type="text" id="d" size="5">
<input type="text" id="c" size="5">
<input type="text" id="j" size="5" maxlength="4">
<input type="text" id="i" size="5" maxlength="4">
<input type="text" id="h" size="5">
<input type="text" id="g" size="5">
<input type="text" id="k-max5" size="5" maxlength="5">
<input type="text" id="l" size="5" maxlength="0">
<input type="text" id="m" size="5" maxlength="">
<input type="text" id="n" size="5" maxlength="invalid">
<input type="text" id="huge" size="5" maxlength="9999999999">
</div>

<script>
function domValueOf(id) {
    return document.getElementById(id).value;
}
function visibleValueOf(id) {
    var el = document.getElementById(id);
    el.focus();
    document.execCommand('SelectAll');
    return document.getSelection().toString();
}

var fancyX = "x" + String.fromCharCode(0x305) + String.fromCharCode(0x332);
// u10000 is one character consisted of a surrogate pair.
var u10000 = "\ud800\udc00";

debug("set value attribute that violates maxlength (with pasted value)");
document.getElementById("f").focus();
document.execCommand("InsertHTML", false, "123");
document.getElementById("f").setAttribute('value', '12345');
shouldBe("domValueOf('f')", "'123'");  // setAttribute() doesn't change the value because the value is dirty.
shouldBe("visibleValueOf('f')", "'123'");

debug("set value property that violates maxlength (with pasted value)");
document.getElementById("e").focus();
document.execCommand("InsertHTML", false, "123");
document.getElementById("e").value = '12345';
shouldBe("domValueOf('e')", "'12345'");  // Unlike setAttribute(), .value property changes the value.
shouldBe("visibleValueOf('e')", "'12345'");

debug("set maxlength attribute that is smaller than pasted value");
document.getElementById("d").focus();
document.execCommand("InsertHTML", false, "12345");
document.getElementById("d").setAttribute('maxlength', 4);
shouldBe("domValueOf('d')", "'12345'");
shouldBe("visibleValueOf('d')", "'12345'");

debug("set maxLength property that is smaller than pasted value");
document.getElementById("c").focus();
document.execCommand("InsertHTML", false, "12345");
document.getElementById("c").maxLength = 4;
shouldBe("domValueOf('c')", "'12345'");
shouldBe("visibleValueOf('c')", "'12345'");

debug("set value attribute that violates maxlength (with pasted value)");
document.getElementById("j").focus();
document.execCommand("InsertHTML", false, "123");
document.getElementById("j").setAttribute('value', '12' + fancyX + '45');
shouldBe("domValueOf('j')", "'123'");
shouldBe("visibleValueOf('j')", "'123'");

debug("set value property that violates maxlength (with pasted value)");
document.getElementById("i").focus();
document.execCommand("InsertHTML", false, "123");
document.getElementById("i").value = '12' + fancyX + '45';
shouldBe("domValueOf('i')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('i')", "'12' + fancyX + '45'");

debug("set maxlength attribute that is smaller than pasted value");
document.getElementById("h").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
document.getElementById("h").setAttribute('maxlength', 4);
shouldBe("domValueOf('h')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('h')", "'12' + fancyX + '45'");

debug("set maxLength property that is smaller than pasted value");
document.getElementById("g").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
document.getElementById("g").maxLength = 4;
shouldBe("domValueOf('g')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('g')", "'12' + fancyX + '45'");

debug("pasting too much text");
var target = document.getElementById("k-max5");
target.focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
shouldBeEqualToString("domValueOf('k-max5')", "12" + fancyX);
shouldBeEqualToString("visibleValueOf('k-max5')", "12" + fancyX);
target.value = "";
document.execCommand("InsertHTML", false, "123" + u10000);
shouldBeEqualToString("domValueOf('k-max5')", "123" + u10000);
shouldBeEqualToString("visibleValueOf('k-max5')", "123" + u10000);
target.value = "";
document.execCommand("InsertHTML", false, "1234" + u10000);
shouldBeEqualToString("domValueOf('k-max5')", "1234");
shouldBeEqualToString("visibleValueOf('k-max5')", "1234");


debug("pasting too much text with maxlength=0");
document.getElementById("l").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
shouldBe("domValueOf('l')", "''");
shouldBe("visibleValueOf('l')", "''");

debug("empty maxlength should be ignored.");
document.getElementById("m").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
shouldBe("domValueOf('m')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('m')", "'12' + fancyX + '45'");

debug("invalid maxlength should be ignored.");
document.getElementById("n").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
shouldBe("domValueOf('n')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('n')", "'12' + fancyX + '45'");
document.getElementById("huge").focus();
document.execCommand("InsertHTML", false, "12x&#x305;&#x332;45");
shouldBe("domValueOf('huge')", "'12' + fancyX + '45'");
shouldBe("visibleValueOf('huge')", "'12' + fancyX + '45'");

document.getElementById('container').innerHTML = '';
</script>
</body>
</html>