diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /layout/reftests/invalidation/layer-splitting-3.html | |
parent | Initial commit. (diff) | |
download | firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | layout/reftests/invalidation/layer-splitting-3.html | 95 |
1 files changed, 95 insertions, 0 deletions
diff --git a/layout/reftests/invalidation/layer-splitting-3.html b/layout/reftests/invalidation/layer-splitting-3.html new file mode 100644 index 0000000000..23c2004a94 --- /dev/null +++ b/layout/reftests/invalidation/layer-splitting-3.html @@ -0,0 +1,95 @@ +<!DOCTYPE html> +<html lang="en" class="reftest-wait" + reftest-displayport-x="0" + reftest-displayport-y="0" + reftest-displayport-w="800" + reftest-displayport-h="1000"> +<meta charset="utf-8"> +<title>Scrolling shouldn't invalidate the fixed items</title> + +<style> + +.content { + box-sizing: border-box; + width: 200px; + height: 200px; + border: 1px solid black; +} + +.fixed { + position: fixed; + top: 20px; + left: 20px; +} + +.reftest-no-paint { + border-color: lime; +} + +.distanceFromTop { + margin-top: 240px; +} + +.clip { + width: 200px; + height: 200px; + overflow: hidden; +} + +.transform { + position: relative; + will-change: transform; +} + +body { + margin: 0; + padding: 20px; + height: 3000px; +} + + +</style> + +<div class="fixed reftest-no-paint content"> + <!-- + This fixed layer gets its own PaintedLayer above the page. + --> +</div> + +<div class="distanceFromTop clip"> + <!-- + This clip determines the potential pixels that can be affected by the + animated transform, *in relation to the scrolled page*. If the page + is scrolled, the clip moves relative to the fixed items, so the fixed + items need to anticipate the transform getting between them. + --> + + <div class="transform content"> + <!-- + This is an animated transform item. It can move freely but will be + clipped by the .clip element. + --> + </div> + +</div> + +<div class="fixed reftest-no-paint content"> + <!-- + This fixed layer is above the animated transform, in z-order. The + transform is clipped in such a way that initially, the clip doesn't + intersect the fixed items, but once the page is scrolled, it does. + So this fixed item must not share a layer with the lower fixed item. + --> +</div> + +<script> + +function doTest() { + document.documentElement.scrollTop = 100; + document.documentElement.removeAttribute("class"); +} +document.documentElement.scrollTop = 0; +document.addEventListener("MozReftestInvalidate", doTest); +// setTimeout(doTest, 500); + +</script> |