82 lines
2.2 KiB
HTML
82 lines
2.2 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<p id="description"></p>
|
|
<div id="console"></div>
|
|
<script>
|
|
description('Tests for tooLong flag with <input> elements.');
|
|
|
|
var input = document.createElement('input');
|
|
document.body.appendChild(input);
|
|
|
|
debug('No maxlength and no value');
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
debug('');
|
|
debug('Non-dirty value');
|
|
input.setAttribute('value', 'abcde');
|
|
input.maxLength = 3;
|
|
shouldBe('input.value.length', '5');
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
input.setAttribute('value', 'abcdef');
|
|
shouldBe('input.value.length', '6');
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
debug('');
|
|
debug('Dirty value and longer than maxLength');
|
|
input = document.createElement('input');
|
|
document.body.appendChild(input);
|
|
input.setAttribute('value', 'abcde');
|
|
input.maxLength = 3;
|
|
input.focus();
|
|
input.setSelectionRange(5, 5); // Move the cursor at the end.
|
|
document.execCommand('delete');
|
|
shouldBe('input.value.length', '4');
|
|
shouldBeTrue('input.validity.tooLong');
|
|
// Make the value <=maxLength.
|
|
document.execCommand('delete');
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
debug('');
|
|
debug('Sets a value via DOM property');
|
|
input.maxLength = 3;
|
|
input.value = 'abcde';
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
debug('');
|
|
debug('Disabled');
|
|
input.disabled = true;
|
|
shouldBeFalse('input.validity.tooLong');
|
|
input.disabled = false;
|
|
|
|
debug('');
|
|
debug('Grapheme length is not greater than maxLength though character length is greater');
|
|
// fancyX should be treated as 1 grapheme.
|
|
// U+0305 COMBINING OVERLINE
|
|
// U+0332 COMBINING LOW LINE
|
|
var fancyX = "x\u0305\u0332";
|
|
input = document.createElement('input');
|
|
document.body.appendChild(input);
|
|
input.value = fancyX; // 3 characters, 1 grapheme clusters.
|
|
input.maxLength = 1;
|
|
shouldBeFalse('input.validity.tooLong');
|
|
|
|
debug('');
|
|
debug('Change the type with a too long value');
|
|
input.maxLength = 3;
|
|
input.value = 'abcde';
|
|
input.type = 'search';
|
|
input.focus();
|
|
input.setSelectionRange(5, 5);
|
|
document.execCommand('delete');
|
|
shouldBeTrue('input.validity.tooLong');
|
|
shouldBeFalse('input.type = "number"; input.validity.tooLong');
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|