inert-node-is-uneditable.html (1938B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>inert nodes are uneditable</title> 6 <link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="/resources/testdriver.js"></script> 10 <script src="/resources/testdriver-actions.js"></script> 11 <script src="/resources/testdriver-vendor.js"></script> 12 </head> 13 <body> 14 <span inert id="not-editable" contenteditable>I'm not editable.</span> 15 <span id="editable" contenteditable>I'm editable.</span> 16 <span inert> 17 <span id="editable-interactivity" style="interactivity:auto" contenteditable>I'm not editable.</span> 18 </span> 19 <script> 20 var notEditable = document.querySelector('#not-editable'); 21 var editable = document.querySelector('#editable'); 22 var editableInteractivity = document.querySelector('#editable-interactivity'); 23 24 function sendKey(key) { 25 return new test_driver.Actions() 26 .keyDown(key) 27 .keyUp(key) 28 .send(); 29 } 30 31 promise_test(async function() { 32 notEditable.focus(); 33 var oldValue = notEditable.textContent; 34 assert_equals(oldValue, "I'm not editable."); 35 await sendKey('a'); 36 assert_equals(notEditable.textContent, oldValue); 37 }, "Can't edit inert contenteditable"); 38 39 promise_test(async () => { 40 editable.focus(); 41 var oldValue = editable.textContent; 42 assert_equals(oldValue, "I'm editable."); 43 await sendKey('a'); 44 assert_not_equals(editable.textContent, oldValue); 45 }, "Can edit non-inert contenteditable"); 46 47 promise_test(async () => { 48 editableInteractivity.focus(); 49 var oldValue = editableInteractivity.textContent; 50 assert_equals(oldValue, "I'm not editable."); 51 await sendKey('a'); 52 assert_equals(editableInteractivity.textContent, oldValue); 53 }, "Can't edit interactivity:auto contenteditable inside inert"); 54 55 </script> 56 </body> 57 </html>