form-validation-checkValidity.html (7491B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>The constraint validation API Test: element.checkValidity()</title> 4 <link rel="author" title="Intel" href="http://www.intel.com/"> 5 <link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-cva-checkvalidity"> 6 <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-constraint-validation-api"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="support/validator.js"></script> 10 <div id="log"></div> 11 <script> 12 var testElements = [ 13 { 14 tag: "input", 15 types: ["text", "search", "tel", "password"], 16 testData: [ 17 {conditions: {}, expected: true, name: "[target] no constraint"}, 18 {conditions: {maxLength: "4", value: "abcdef"}, expected: true, name: "[target] not suffering from being too long", dirty: true}, 19 {conditions: {pattern: "[A-Z]", value: "abc"}, expected: false, name: "[target] suffering from a pattern mismatch"}, 20 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 21 ] 22 }, 23 { 24 tag: "input", 25 types: ["url"], 26 testData: [ 27 {conditions: {}, expected: true, name: "[target] no constraint"}, 28 {conditions: {maxLength: "20", value: "http://www.example.com"}, expected: true, name: "[target] suffering from being too long", dirty: true}, 29 {conditions: {pattern: "http://www.example.com", value: "http://www.example.net"}, expected: false, name: "[target] suffering from a pattern mismatch"}, 30 {conditions: {value: "abc"}, expected: false, name: "[target] suffering from a type mismatch"}, 31 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 32 ] 33 }, 34 { 35 tag: "input", 36 types: ["email"], 37 testData: [ 38 {conditions: {}, expected: true, name: "[target] no constraint"}, 39 {conditions: {maxLength: "10", value: "test@example.com"}, expected: true, name: "[target] not suffering from being too long", dirty: true}, 40 {conditions: {pattern: "test@example.com", value: "test@example.net"}, expected: false, name: "[target] suffering from a pattern mismatch"}, 41 {conditions: {value: "abc"}, expected: false, name: "[target] suffering from a type mismatch"}, 42 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 43 ] 44 }, 45 { 46 tag: "input", 47 types: ["datetime-local"], 48 testData: [ 49 {conditions: {}, expected: true, name: "[target] no constraint"}, 50 {conditions: {max: "2000-01-01T12:00:00", value: "2001-01-01T12:00:00"}, expected: false, name: "[target] suffering from an overflow"}, 51 {conditions: {min: "2001-01-01T12:00:00", value: "2000-01-01T12:00:00"}, expected: false, name: "[target] suffering from an underflow"}, 52 {conditions: {step: 2 * 60 * 1000, value: "2001-01-01T12:03:00"}, expected: false, name: "[target] suffering from a step mismatch"}, 53 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 54 ] 55 }, 56 { 57 tag: "input", 58 types: ["date"], 59 testData: [ 60 {conditions: {}, expected: true, name: "[target] no constraint"}, 61 {conditions: {max: "2000-01-01", value: "2001-01-01"}, expected: false, name: "[target] suffering from an overflow"}, 62 {conditions: {min: "2001-01-01", value: "2000-01-01"}, expected: false, name: "[target] suffering from an underflow"}, 63 {conditions: {step: 2 * 1 * 86400000, value: "2001-01-03"}, expected: false, name: "[target] suffering from a step mismatch"}, 64 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 65 ] 66 }, 67 { 68 tag: "input", 69 types: ["month"], 70 testData: [ 71 {conditions: {}, expected: true, name: "[target] no constraint"}, 72 {conditions: {max: "2000-01", value: "2001-01"}, expected: false, name: "[target] suffering from an overflow"}, 73 {conditions: {min: "2001-01", value: "2000-01"}, expected: false, name: "[target] suffering from an underflow"}, 74 {conditions: {step: 3 * 1 * 1, value: "2001-03"}, expected: false, name: "[target] suffering from a step mismatch"}, 75 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 76 ] 77 }, 78 { 79 tag: "input", 80 types: ["week"], 81 testData: [ 82 {conditions: {}, expected: true, name: "[target] no constraint"}, 83 {conditions: {max: "2000-W01", value: "2001-W01"}, expected: false, name: "[target] suffering from an overflow"}, 84 {conditions: {min: "2001-W01", value: "2000-W01"}, expected: false, name: "[target] suffering from an underflow"}, 85 {conditions: {step: 2 * 1 * 604800000, value: "2001-W03"}, expected: false, name: "[target] suffering from a step mismatch"}, 86 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 87 ] 88 }, 89 { 90 tag: "input", 91 types: ["time"], 92 testData: [ 93 {conditions: {}, expected: true, name: "[target] no constraint"}, 94 {conditions: {max: "12:00:00", value: "13:00:00"}, expected: false, name: "[target] suffering from an overflow"}, 95 {conditions: {min: "12:00:00", value: "11:00:00"}, expected: false, name: "[target] suffering from an underflow"}, 96 {conditions: {step: 2 * 60 * 1000, value: "12:03:00"}, expected: false, name: "[target] suffering from a step mismatch"}, 97 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 98 ] 99 }, 100 { 101 tag: "input", 102 types: ["number"], 103 testData: [ 104 {conditions: {max: "5", value: "6"}, expected: false, name: "[target] suffering from an overflow"}, 105 {conditions: {min: "5", value: "4"}, expected: false, name: "[target] suffering from an underflow"}, 106 {conditions: {step: 2 * 1 * 1, value: "3"}, expected: false, name: "[target] suffering from a step mismatch"}, 107 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 108 ] 109 }, 110 { 111 tag: "input", 112 types: ["checkbox", "radio"], 113 testData: [ 114 {conditions: {}, expected: true, name: "[target] no constraint"}, 115 {conditions: {required: true, checked: false, name: "test1"}, expected: false, name: "[target] suffering from being missing"} 116 ] 117 }, 118 { 119 tag: "input", 120 types: ["file"], 121 testData: [ 122 {conditions: {}, expected: true, name: "[target] no constraint"}, 123 {conditions: {required: true, files: null}, expected: false, name: "[target] suffering from being missing"} 124 ] 125 }, 126 { 127 tag: "select", 128 types: [], 129 testData: [ 130 {conditions: {}, expected: true, name: "[target] no constraint"}, 131 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 132 ] 133 }, 134 { 135 tag: "textarea", 136 types: [], 137 testData: [ 138 {conditions: {}, expected: true, name: "[target] no constraint"}, 139 {conditions: {required: true, value: ""}, expected: false, name: "[target] suffering from being missing"} 140 ] 141 } 142 ]; 143 144 validator.run_test(testElements, "checkValidity"); 145 </script>