summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html')
-rw-r--r--testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html53
1 files changed, 53 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html b/testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html
new file mode 100644
index 0000000000..6ec81b6f5e
--- /dev/null
+++ b/testing/web-platform/tests/css/filter-effects/background-image-blur-repaint.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<title>CSS Filters: Repaint of element with background-image and blur filter</title>
+<link rel="author" title="Stephen White" href="mailto:senorblanco@chromium.org">
+<link rel="help" href="https://drafts.fxtf.org/filter-effects-1/#FilterProperty">
+<link rel="help" href="https://drafts.csswg.org/css-backgrounds-3/#background-image">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=415106">
+<link rel="match" href="reference/background-image-blur-repaint-ref.html">
+<meta name="assert" content="An element with background-image and a filter should be rendered correctly after other elements on the page change size. You should see a 50x50 green box over a blurred background."/>
+
+<script src="/common/reftest-wait.js"></script>
+<script src="/common/rendering-utils.js"></script>
+<script>
+function runTest() {
+ function shrinkBox() {
+ var box = document.getElementsByClassName("box")[0];
+ box.style.width = "50px";
+ box.style.height = "50px";
+ }
+
+ waitForAtLeastOneFrame().then(function() {
+ shrinkBox();
+ takeScreenshot();
+ });
+}
+</script>
+<style>
+.bg {
+ position: absolute;
+ left: 200px;
+ top: 0px;
+ width: 400px;
+ height: 300px;
+ background-image: url(support/color-palette.png);
+ filter: blur(8px);
+}
+.box {
+ position: absolute;
+ left: 300px;
+ top: 50px;
+ width: 100px;
+ height: 100px;
+ background-color: green;
+}
+</style>
+</head>
+
+<body onload="runTest()">
+<div class="bg"></div>
+<div class="box"></div>
+</body>
+</html>