diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-anchor-position/anchor-name-style-contained-dynamic.html')
-rw-r--r-- | testing/web-platform/tests/css/css-anchor-position/anchor-name-style-contained-dynamic.html | 71 |
1 files changed, 0 insertions, 71 deletions
diff --git a/testing/web-platform/tests/css/css-anchor-position/anchor-name-style-contained-dynamic.html b/testing/web-platform/tests/css/css-anchor-position/anchor-name-style-contained-dynamic.html deleted file mode 100644 index 50cec96f36..0000000000 --- a/testing/web-platform/tests/css/css-anchor-position/anchor-name-style-contained-dynamic.html +++ /dev/null @@ -1,71 +0,0 @@ -<!DOCTYPE html> -<title>CSS Anchor Positioning: anchor-name is style contained - dynamic containment</title> -<link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/#name"> -<script src="/resources/testharness.js"></script> -<script src="/resources/testharnessreport.js"></script> -<script src="/resources/check-layout-th.js"></script> -<script src="support/test-common.js"></script> -<style> - .container { - position: relative; - } - .anchor { - width: 100px; - height: 100px; - anchor-name: var(--anchor-name); - } - .contain-style { - contain: style; - } - .target { - position: absolute; - anchor-default: var(--anchor-name); - top: anchor(bottom, 50px); - } - #a1 { --anchor-name: --a1; } - #a2 { --anchor-name: --a2; } - #a3 { --anchor-name: --a3; } -</style> -<div id="a1" class="container"> - <div class="anchor"></div> - <div class="contain-style"> - <div class="anchor"></div> - </div> - <div class="target" data-offset-y="100"></div> -</div> -<div id="a2" class="container"> - <div class="anchor"></div> - <div class="anchor"></div> - <div class="contain-style"> - <div class="target" data-offset-y="50"></div> - </div> -</div> -<div id="a3" class="container"> - <div class="anchor contain-style"> - <div class="target" data-offset-y="50"></div> - </div> -</div> -<script type="module"> - await checkLayoutForAnchorPos('.target'); - - const t1 = document.querySelector("#a1 .target"); - const t2 = document.querySelector("#a2 .target"); - const t3 = document.querySelector("#a3 .target"); - const t4 = document.querySelector("#a4 .target"); - const t5 = document.querySelector("#a5 .target"); - t1.setAttribute("data-offset-y", "200"); - t2.setAttribute("data-offset-y", "200"); - t3.setAttribute("data-offset-y", "100"); - for (let element of document.querySelectorAll(".contain-style")) { - element.style.contain = "none"; - } - await checkLayoutForAnchorPos('.target'); - - t1.setAttribute("data-offset-y", "100"); - t2.setAttribute("data-offset-y", "50"); - t3.setAttribute("data-offset-y", "50"); - for (let element of document.querySelectorAll(".contain-style")) { - element.style.contain = ""; - } - await checkLayoutForAnchorPos('.target'); -</script> |