scrollIntoView-shadow.html (1357B)
1 <!DOCTYPE HTML> 2 <meta name="viewport" content="user-scalable=no"> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <title>Check End Position of scrollIntoView of shadow elements</title> 6 <div id="container"> 7 <div id="space1" style="height: 2000px; width: 2000px;background-color: yellow"> 8 </div> 9 <div id="shadow"></div> 10 <div id="space2" style="height: 2000px; width: 2000px;background-color: blue"> 11 </div> 12 </div> 13 <script> 14 add_completion_callback(() => document.getElementById("container").remove()); 15 16 test(t => { 17 var shadow = document.getElementById("shadow"); 18 var shadowRoot = shadow.attachShadow({ mode: "open" }); 19 var shadowDiv = document.createElement("div"); 20 shadowDiv.style.height = "200px"; 21 shadowDiv.style.width = "200px"; 22 shadowDiv.style.backgroundColor = "green"; 23 shadowRoot.appendChild(shadowDiv); 24 25 window.scrollTo(0, 0); 26 var expected_x = shadowDiv.offsetLeft; 27 var expected_y = shadowDiv.offsetTop; 28 assert_not_equals(window.scrollX, expected_x); 29 assert_not_equals(window.scrollY, expected_y); 30 shadowDiv.scrollIntoView({block: "start", inline: "start"}); 31 assert_approx_equals(window.scrollX, expected_x, 1); 32 assert_approx_equals(window.scrollY, expected_y, 1); 33 }, "scrollIntoView should behave correctly if applies to shadow dom elements"); 34 </script>