input-untrusted-key-event.html (5001B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Forms</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 </head> 8 <body> 9 <div id="log"></div> 10 <form id="input_form"> 11 <fieldset> 12 <input type="radio" name="radio" value="1"> 13 <input type="radio" name="radio" value="2"> 14 </fieldset> 15 </form> 16 <script type="module"> 17 import inputTypes from "./input-types.js"; 18 19 const form = document.querySelector("form"); 20 form.addEventListener("submit", (e) => { 21 e.preventDefault(); 22 assert_true(false, 'form should not be submitted'); 23 }); 24 25 const radioButton = document.querySelector("input[type=radio]"); 26 radioButton.addEventListener("click", function(e) { 27 assert_true(false, `input radio should not be clicked`); 28 }); 29 radioButton.addEventListener("focus", function(e) { 30 assert_true(false, `input radio should not be focused on`); 31 }); 32 radioButton.addEventListener("change", function(e) { 33 assert_true(false, `input radio should not be changed`); 34 }); 35 radioButton.addEventListener("input", function(e) { 36 assert_true(false, `input radio should not have been inputted`); 37 }); 38 39 // Create and append input elements 40 for (const inputType of inputTypes) { 41 if (inputType == "radio") { 42 continue; 43 } 44 45 let input = document.createElement("input"); 46 input.type = inputType; 47 form.appendChild(input); 48 49 input.addEventListener("click", function(e) { 50 assert_true(false, `input ${inputType} should not be clicked`); 51 }); 52 input.addEventListener("focus", function(e) { 53 assert_true(false, `input ${inputType} should not be focused on`); 54 }); 55 input.addEventListener("change", function(e) { 56 assert_true(false, `input ${inputType} should not be changed`); 57 }); 58 input.addEventListener("input", function(e) { 59 assert_true(false, `input ${inputType} should not have been inputted`); 60 }); 61 } 62 63 // Start tests 64 for (const inputType of inputTypes) { 65 let input = document.querySelector(`input[type=${inputType}]`); 66 67 test(() => { 68 // keyCode: Enter 69 input.dispatchEvent( 70 new KeyboardEvent("keypress", { 71 keyCode: 13, 72 }) 73 ); 74 75 // key: Enter 76 input.dispatchEvent( 77 new KeyboardEvent("keypress", { 78 key: "Enter", 79 }) 80 ); 81 82 // keyCode: Space 83 input.dispatchEvent( 84 new KeyboardEvent("keypress", { 85 keyCode: 32, 86 }) 87 ); 88 89 // key: Space 90 input.dispatchEvent( 91 new KeyboardEvent("keypress", { 92 key: " ", 93 }) 94 ); 95 96 // keyCode: Tab 97 input.dispatchEvent( 98 new KeyboardEvent("keypress", { 99 keyCode: 9, 100 }) 101 ); 102 103 // key: Tab 104 input.dispatchEvent( 105 new KeyboardEvent("keypress", { 106 key: "Tab", 107 }) 108 ); 109 110 // keyCode: ArrowUp 111 input.dispatchEvent( 112 new KeyboardEvent("keypress", { 113 keyCode: 38, 114 }) 115 ); 116 117 // key: ArrowUp 118 input.dispatchEvent( 119 new KeyboardEvent("keypress", { 120 key: "ArrowUp", 121 }) 122 ); 123 }, `Dispatching untrusted keypress events to input ${inputType} should not cause submission, click, change, input, or focus events`); 124 125 test(() => { 126 // keyCode: Enter 127 input.dispatchEvent( 128 new KeyboardEvent("keydown", { 129 keyCode: 13, 130 }) 131 ); 132 input.dispatchEvent( 133 new KeyboardEvent("keyup", { 134 keyCode: 13, 135 }) 136 ); 137 138 // key: Enter 139 input.dispatchEvent( 140 new KeyboardEvent("keydown", { 141 key: "Enter", 142 }) 143 ); 144 input.dispatchEvent( 145 new KeyboardEvent("keyup", { 146 key: "Enter", 147 }) 148 ); 149 150 // keyCode: Space 151 input.dispatchEvent( 152 new KeyboardEvent("keydown", { 153 keyCode: 32, 154 }) 155 ); 156 input.dispatchEvent( 157 new KeyboardEvent("keyup", { 158 keyCode: 32, 159 }) 160 ); 161 162 // key: Space 163 input.dispatchEvent( 164 new KeyboardEvent("keydown", { 165 key: " ", 166 }) 167 ); 168 input.dispatchEvent( 169 new KeyboardEvent("keyup", { 170 key: " ", 171 }) 172 ); 173 174 // keyCode: Tab 175 input.dispatchEvent( 176 new KeyboardEvent("keydown", { 177 keyCode: 9, 178 }) 179 ); 180 input.dispatchEvent( 181 new KeyboardEvent("keyup", { 182 keyCode: 9, 183 }) 184 ); 185 186 // key: Tab 187 input.dispatchEvent( 188 new KeyboardEvent("keydown", { 189 key: "Tab", 190 }) 191 ); 192 input.dispatchEvent( 193 new KeyboardEvent("keyup", { 194 key: "Tab", 195 }) 196 ); 197 198 // keyCode: ArrowUp 199 input.dispatchEvent( 200 new KeyboardEvent("keydown", { 201 keyCode: 38, 202 }) 203 ); 204 input.dispatchEvent( 205 new KeyboardEvent("keyup", { 206 keyCode: 38, 207 }) 208 ); 209 210 // key: ArrowUp 211 input.dispatchEvent( 212 new KeyboardEvent("keydown", { 213 key: "ArrowUp", 214 }) 215 ); 216 input.dispatchEvent( 217 new KeyboardEvent("keyup", { 218 key: "ArrowUp", 219 }) 220 ); 221 }, `Dispatching untrusted keyup/keydown events to input ${inputType} should not cause submission, click, change, input, or focus events`); 222 } 223 </script> 224 </body> 225 </html>