<!doctype HTML> <html class="reftest-wait"> <meta charset="utf8"> <title>Content Visibility: anchor links prevented on hidden</title> <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> <link rel="match" href="spacer-and-container-ref.html"> <meta name="assert" content="anchor link scroll is prevented when the target is hidden"> <script src="/common/reftest-wait.js"></script> <style> .spacer { width: 150px; height: 3000px; background: lightblue; } #container { width: 150px; height: 150px; background: red; } .hidden { content-visibility: hidden; } #target { width: 100px; height: 100px; } </style> <div class="spacer">Test passes if there is no red.</div> <div id="container"><div id="target"></div></div> <script> function tryToScroll() { location.href += "#target"; requestAnimationFrame(takeScreenshot); } function runTest() { container.classList.add("hidden"); requestAnimationFrame(tryToScroll); } window.onload = () => { requestAnimationFrame(runTest); }; </script> </html>