<!DOCTYPE html>
<html>
<body>
<script src="../../resources/js-test-pre.js"></script>
<form id="testForm">
<input type="submit" id="submitButton">
</form>
<script>
description("Tests the validation message when maxlength is used.");

var form = document.getElementById("testForm");
var submit = document.getElementById("submitButton");

var input = document.createElement("input");
input.value = "abcd";
input.maxLength = 2;
form.prepend(input);

input.focus();
eventSender.keyDown(String.fromCharCode(0x0008)); // Delete.
shouldBeEqualToString("input.value", "abc");
shouldBeFalse("input.checkValidity()");
shouldBeEqualToString("input.validationMessage", "Use no more than 2 characters");

input.maxLength = 1;
eventSender.keyDown(String.fromCharCode(0x0008)); // Delete.
shouldBeEqualToString("input.value", "ab");
shouldBeFalse("input.checkValidity()");
shouldBeEqualToString("input.validationMessage", "Use no more than one character");

input.maxLength = 0;
eventSender.keyDown(String.fromCharCode(0x0008)); // Delete.
shouldBeEqualToString("input.value", "a");
shouldBeFalse("input.checkValidity()");
shouldBeEqualToString("input.validationMessage", "Use no more than 0 characters");
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>
