blob: 6d5ba59c80172f5dc618012703145957ca58cc2a [file] [log] [blame]
<head>
<meta name="viewport" content="width=device-width">
<title>This tests that the reflection of an element without a backdrop-filter value initially updates its rendering when the reflected layer has a backdrop-filter applied later.</title>
<style>
svg {
position: absolute;
top: 0px;
left: 0px;
width: 200px;
height: 200px;
background-color: lightgray;
}
.backdrop {
position: absolute;
top: 10px;
left: 60px;
width: 80px;
height: 80px;
background-color: rgba(255, 255, 255, 0.5);
-webkit-backdrop-filter: saturate(180%) blur(5px);
}
.backdrop:last-of-type {
top: 110px;
}
</style>
</head>
<svg viewbox="0 0 2 2">
<rect fill="black" x="0" y="0" width="1" height="1"></rect>
<rect fill="black" x="1" y="1" width="1" height="1"></rect>
</svg>
<div class="backdrop"></div>
<div class="backdrop"></div>