first-letter-inside-before-pseudo.html (675B)
1 <!DOCTYPE html> 2 <link rel="author" title="Chris Harrelson" href="mailto:chrishtr@chromium.org"> 3 <meta name="assert" content="Test that the browser doesn't crash when a first-letter pseudo-element toggles visiblity as a child of a before pseudo-element."> 4 <style> 5 .btn-text::before { 6 content: "a"; 7 visibility: hidden; 8 } 9 10 .btn-text.visible::before { 11 visibility: visible; 12 } 13 14 #problem::first-letter { 15 text-transform: none; 16 } 17 </style> 18 <div id="problem"> 19 <span class="btn-text"></span> 20 </div> 21 <script> 22 requestAnimationFrame(() => requestAnimationFrame(() => { 23 document.querySelector('.btn-text').classList.toggle('visible') 24 })); 25 </script>