commit aeed20c633f2226d1c8a50d3c0ed4ed44aaecfdb parent 03f6d396fc17fcaa31517df8616421f09b62e5a9 Author: Morten Stenshorne <mstensho@chromium.org> Date: Thu, 9 Oct 2025 20:32:33 +0000 Bug 1992136 [wpt PR 55162] - [anchor] Honor transforms on non-default anchors too., a=testonly Automatic update from web-platform-tests [anchor] Honor transforms on non-default anchors too. The spec doesn't say anything about limiting it to default anchors only, so don't do that. Bug: 382294252 Change-Id: Ic97bf28933147e9abcda4fa536226b2a3ad26f8a Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7000231 Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org> Cr-Commit-Position: refs/heads/main@{#1523022} -- wpt-commits: 46882612b6a4a149a71a19dd33d85b357f0e0445 wpt-pr: 55162 Diffstat:
| A | testing/web-platform/tests/css/css-anchor-position/transform-009.html | | | 12 | ++++++++++++ |
1 file changed, 12 insertions(+), 0 deletions(-)
diff --git a/testing/web-platform/tests/css/css-anchor-position/transform-009.html b/testing/web-platform/tests/css/css-anchor-position/transform-009.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<title>Anchor-positioned element with transformed non-default anchor. Using anchor() and anchor-size().</title> +<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/#determining-position"> +<link rel="match" href="../reference/ref-filled-green-100px-square.xht"> +<p>Test passes if there is a filled green square and <strong>no red</strong>.</p> +<div style="width:100px; height:100px; background:red;"> + <div style="padding-left:200px; padding-top:100px;"> + <div style="width:50px; height:25px; transform:translate(-200px, -100px) scale(2); transform-origin:0 0; anchor-name:--a; background:green;"></div> + <div style="position:absolute; left:anchor(--a left); top:anchor(--a bottom); width:anchor-size(--a width); height:anchor-size(--a height); background:green;"></div> + </div> +</div>