diff options
Diffstat (limited to 'tests/wpt/tests/css/css-view-transitions/snapshot-containing-block-static-iframe.html')
-rw-r--r-- | tests/wpt/tests/css/css-view-transitions/snapshot-containing-block-static-iframe.html | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/tests/wpt/tests/css/css-view-transitions/snapshot-containing-block-static-iframe.html b/tests/wpt/tests/css/css-view-transitions/snapshot-containing-block-static-iframe.html new file mode 100644 index 00000000000..1903b9cacbd --- /dev/null +++ b/tests/wpt/tests/css/css-view-transitions/snapshot-containing-block-static-iframe.html @@ -0,0 +1,55 @@ +<!DOCTYPE html> +<html class=reftest-wait> +<title>View transitions: use snapshot containing block for static position in iframe</title> +<link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/#snapshot-containing-block-concept/"> +<link rel="match" href="snapshot-containing-block-static-iframe-ref.html"> + +<script src="/common/reftest-wait.js"></script> +<script src="/common/rendering-utils.js"></script> + +<style> +#inner { + width: 400px; + height: 200px; +} +</style> +<iframe id="inner" srcdoc=" + <style> + body { + height: 200vh; + overflow: hidden; + } + ::view-transition { + position: static; + display: block; + width: 100%; + height: 100%; + background: limegreen; + } + ::view-transition-group(*), + ::view-transition-image-pair(*), + ::view-transition-old(*), + ::view-transition-new(*) { + animation-play-state: paused; + } + + </style> + <body></body> +"></iframe> +<script> +failIfNot(document.startViewTransition, "Missing document.startViewTransition"); + +async function runTest() { + // Start the view transition at a scroll offset so that the snapshot + // containing block differs from the initial containing block. + inner.contentWindow.scrollTo(0, 100); + await waitForAtLeastOneFrame(); + + const contentDocument = inner.contentDocument; + let vt = inner.contentDocument.startViewTransition(); + await vt.ready; + takeScreenshot(); +} + +onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest)); +</script> |