Codebase Browser
chromium
Go to App

chromium/third_party/blink/web_tests/fast/forms/ValidityState-tooLong-textarea.html 

<!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>
<script>
description('Tests for tooLong flag with &lt;textarea> elements.');

var textarea = document.createElement('textarea');
document.body.appendChild(textarea);

debug('No maxlength and no value');
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('Non-dirty value');
textarea.defaultValue = 'abcde';
textarea.maxLength = 3;
shouldBe('textarea.value.length', '5');
shouldBeFalse('textarea.validity.tooLong');

textarea.defaultValue = 'abcdef';
shouldBe('textarea.value.length', '6');
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('Dirty value and longer than maxLength');
textarea = document.createElement('textarea');
document.body.appendChild(textarea);
textarea.defaultValue = 'abcde';
textarea.maxLength = 3;
textarea.focus();
textarea.setSelectionRange(5, 5);  // Move the cursor at the end.
eventSender.keyDown('Backspace');
shouldBe('textarea.value.length', '4');
shouldBeTrue('textarea.validity.tooLong');
// Make the value <=maxLength.
eventSender.keyDown('Backspace');
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('Sets a value via DOM property');
textarea = document.createElement('textarea');
document.body.appendChild(textarea);
textarea.maxLength = 3;
textarea.value = 'abcde';
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('Disabling makes the control valid');
textarea.focus();
textarea.setSelectionRange(5, 5);  // Move the cursor at the end.
eventSender.keyDown('Backspace');
shouldBeTrue('textarea.validity.tooLong');
shouldBeFalse('textarea.disabled = true; textarea.validity.tooLong');
shouldBeTrue('textarea.disabled = false; textarea.validity.tooLong');

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";
textarea = document.createElement('textarea');
document.body.appendChild(textarea);
textarea.value = fancyX + 'A'; // 4 characters, 2 grapheme cluster.
textarea.maxLength = 1;
textarea.focus();
shouldBeFalse('textarea.validity.tooLong');
eventSender.keyDown('Backspace'); // Make the value dirty, 1 grapheme remains.
// Too long because there are three characters.
shouldBe('textarea.value.length', '3');
shouldBeTrue('textarea.validity.tooLong');

debug('');
debug('A value set by resetting a form doesn\'t make tooLong true.');
// Make a dirty textarea.
var parent = document.createElement('div');
document.body.appendChild(parent);
parent.innerHTML = '<form><textarea maxlength=2>abcdef</textarea></form>';
textarea = parent.firstChild.firstChild;
textarea.focus();
textarea.setSelectionRange(6, 6);
eventSender.keyDown('Backspace');
shouldBeTrue('textarea.validity.tooLong');
parent.firstChild.reset();
shouldBe('textarea.value', '"abcdef"');
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('A value set by a child node change doesn\'t make tooLong true.');
parent.innerHTML = '<textarea maxlength=2>abc</textarea>';
textarea = parent.firstChild;
shouldBeFalse('textarea.validity.tooLong');
parent.firstChild.innerHTML = 'abcdef';
shouldBe('textarea.value', '"abcdef"');
shouldBeFalse('textarea.validity.tooLong');

debug('');
debug('minlength and maxlength together');
textarea.maxLength = 3;
textarea.minLength = 3;
textarea.value = 'abcde';
textarea.focus();
textarea.setSelectionRange(5, 5);
eventSender.keyDown('Backspace');
shouldBeTrue('textarea.validity.tooLong');
shouldBeFalse('textarea.validity.tooShort');
eventSender.keyDown('Backspace');
shouldBeFalse('textarea.validity.tooLong');
shouldBeFalse('textarea.validity.tooShort');
eventSender.keyDown('Backspace');
shouldBeFalse('textarea.validity.tooLong');
shouldBeTrue('textarea.validity.tooShort');

debug('');
debug('minlength and maxlength clashing');
textarea.setAttribute('maxlength', '2');
textarea.setAttribute('minlength', '4');
textarea.value = 'abcde';
textarea.focus();
textarea.setSelectionRange(5, 5);
eventSender.keyDown('Backspace');
shouldBeTrue('textarea.validity.tooLong');
shouldBeFalse('textarea.validity.tooShort');
eventSender.keyDown('Backspace');
shouldBeTrue('textarea.validity.tooLong');
shouldBeTrue('textarea.validity.tooShort');
eventSender.keyDown('Backspace');
shouldBeFalse('textarea.validity.tooLong');
shouldBeTrue('textarea.validity.tooShort');
eventSender.keyDown('Backspace');
eventSender.keyDown('Backspace');
shouldBeFalse('textarea.validity.tooLong');
shouldBeFalse('textarea.validity.tooShort');

</script>
</body>
</html>