fast/forms/checkValidity-002.html

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../js/resources/js-test-pre.js"></script>
</head>
<body>
<p id="description"></p>
<form method="get">
<input id="input-empty" name="victim" type="text" required/>
<input id="input-pattern-mismatch" name="victim" type="text" pattern="Lorem ipsum" value="Loremipsum"/>
<textarea id="textarea" name="victim" required></textarea>
<select id="select-no-explicit-value" required>
  <option>empty</option>
  <option>another</option>
</select>
<select id="select-placeholder" name="victim" required>
  <option value="" selected />
  <option value="X">X</option>
</select>
<select id="select-non-placeholder" name="victim" required>
  <option value="X">X</option>
  <option value="" selected />
</select>
</form>
<div id="console"></div>
<script>
    function checkValidityFor(id) {
        return document.getElementById(id).checkValidity();
    }

    description("This test checks if checkValidity() returns correctly a false (meaning error) result on invalid elements, and returns a true result on a blank but valid elements. Blank but non-placeholder label options are valid.");

    shouldBeFalse('checkValidityFor("input-empty")');
    shouldBeFalse('checkValidityFor("input-pattern-mismatch")');
    shouldBeFalse('checkValidityFor("textarea")');
    shouldBeTrue('checkValidityFor("select-no-explicit-value")');
    shouldBeFalse('checkValidityFor("select-placeholder")');
    shouldBeTrue('checkValidityFor("select-non-placeholder")');
</script>
<script src="../js/resources/js-test-post.js"></script>
</body>
</html>