bug1663475-1.html (883B)
1 <!doctype html> 2 <html class="reftest-wait"> 3 <title>Caret is correctly painted over inline with clip</title> 4 <script src="/tests/SimpleTest/SimpleTest.js"></script> 5 <script src="/tests/SimpleTest/EventUtils.js"></script> 6 <style> 7 div { 8 font: 16px/1 monospace; 9 caret-color: black; 10 } 11 div:focus { 12 outline: 2px solid blue; 13 } 14 span { 15 /* This should only leave the "c" letter visible, but the caret should 16 still be visible when between "a" and "b" */ 17 clip-path: inset(0 2ch); 18 } 19 </style> 20 <div contenteditable spellcheck="false"> 21 <span>abcde</span> 22 </div> 23 <script> 24 SimpleTest.waitForFocus(function() { 25 document.querySelector('[contenteditable]').focus(); 26 requestAnimationFrame(function() { 27 // Position the caret between "a" and "b". 28 synthesizeKey("KEY_ArrowRight"); 29 document.documentElement.removeAttribute("class"); 30 }); 31 }); 32 </script>