test_reportValidation_preventDefault.html (3510B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=1088761 5 --> 6 <head> 7 <title>Test for Bug 1088761</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 10 <style> 11 input, textarea, fieldset, button, select, output, object { background-color: rgb(0,0,0) !important; } 12 :valid { background-color: rgb(0,255,0) !important; } 13 :invalid { background-color: rgb(255,0,0) !important; } 14 </style> 15 </head> 16 <body> 17 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088761">Mozilla Bug 1088761</a> 18 <p id="display"></p> 19 <div id="content" style="display: none"> 20 <fieldset id='f' oninvalid="invalidEventHandler(event, true);"></fieldset> 21 <input id='i' required oninvalid="invalidEventHandler(event, true);"> 22 <button id='b' oninvalid="invalidEventHandler(event, true);"></button> 23 <select id='s' required oninvalid="invalidEventHandler(event, true);"></select> 24 <textarea id='t' required oninvalid="invalidEventHandler(event, true);"></textarea> 25 <output id='o' oninvalid="invalidEventHandler(event, true);"></output> 26 <object id='obj' oninvalid="invalidEventHandler(event, true);"></object> 27 </div> 28 <div id="content2" style="display: none"> 29 <fieldset id='f2' oninvalid="invalidEventHandler(event, false);"></fieldset> 30 <input id='i2' required oninvalid="invalidEventHandler(event, false);"> 31 <button id='b2' oninvalid="invalidEventHandler(event, false);"></button> 32 <select id='s2' required oninvalid="invalidEventHandler(event, false);"></select> 33 <textarea id='t2' required oninvalid="invalidEventHandler(event, false);"></textarea> 34 <output id='o2' oninvalid="invalidEventHandler(event, false);"></output> 35 <object id='obj2' oninvalid="invalidEventHandler(event, false);"></object> 36 </div> 37 <pre id="test"> 38 <script type="application/javascript"> 39 40 /** Test for Bug 1088761 */ 41 42 var gInvalid = false; 43 44 function invalidEventHandler(aEvent, isPreventDefault) 45 { 46 if (isPreventDefault) { 47 aEvent.preventDefault(); 48 } 49 50 is(aEvent.type, "invalid", "Invalid event type should be invalid"); 51 ok(!aEvent.bubbles, "Invalid event should not bubble"); 52 ok(aEvent.cancelable, "Invalid event should be cancelable"); 53 gInvalid = true; 54 } 55 56 function checkReportValidityForInvalid(element) 57 { 58 gInvalid = false; 59 ok(!element.reportValidity(), "reportValidity() should return false when the element is not valid"); 60 ok(gInvalid, "Invalid event should have been handled"); 61 } 62 63 function checkReportValidityForValid(element) 64 { 65 gInvalid = false; 66 ok(element.reportValidity(), "reportValidity() should return true when the element is valid"); 67 ok(!gInvalid, "Invalid event shouldn't have been handled"); 68 } 69 70 checkReportValidityForInvalid(document.getElementById('i')); 71 checkReportValidityForInvalid(document.getElementById('s')); 72 checkReportValidityForInvalid(document.getElementById('t')); 73 74 checkReportValidityForInvalid(document.getElementById('i2')); 75 checkReportValidityForInvalid(document.getElementById('s2')); 76 checkReportValidityForInvalid(document.getElementById('t2')); 77 78 checkReportValidityForValid(document.getElementById('o')); 79 checkReportValidityForValid(document.getElementById('obj')); 80 checkReportValidityForValid(document.getElementById('f')); 81 82 checkReportValidityForValid(document.getElementById('o2')); 83 checkReportValidityForValid(document.getElementById('obj2')); 84 checkReportValidityForValid(document.getElementById('f2')); 85 86 </script> 87 </pre> 88 </body> 89 </html>