From 37e1c3385e03e1976aecfad3b558049c94ad9e76 Mon Sep 17 00:00:00 2001 From: Oriol Brufau Date: Thu, 5 Sep 2024 13:15:41 +0200 Subject: [PATCH] Treat `align-self: normal` as `stretch` on flex items (#33314) According to https://drafts.csswg.org/css-align/#align-flex It was being treated as `auto` instead. Signed-off-by: Oriol Brufau --- components/layout_2020/flexbox/layout.rs | 3 ++- tests/wpt/meta/MANIFEST.json | 13 ++++++++++ .../self-align-normal-flex.html | 24 +++++++++++++++++++ 3 files changed, 39 insertions(+), 1 deletion(-) create mode 100644 tests/wpt/tests/css/css-align/self-alignment/self-align-normal-flex.html diff --git a/components/layout_2020/flexbox/layout.rs b/components/layout_2020/flexbox/layout.rs index cf755a64d78..28854ecc048 100644 --- a/components/layout_2020/flexbox/layout.rs +++ b/components/layout_2020/flexbox/layout.rs @@ -247,7 +247,8 @@ impl FlexContainerConfig { fn align_for(&self, align_self: AlignSelf) -> AlignItems { let value = align_self.0 .0.value(); let mapped_value = match value { - AlignFlags::AUTO | AlignFlags::NORMAL => self.align_items.0, + AlignFlags::AUTO => self.align_items.0, + AlignFlags::NORMAL => AlignFlags::STRETCH, _ => value, }; AlignItems(mapped_value) diff --git a/tests/wpt/meta/MANIFEST.json b/tests/wpt/meta/MANIFEST.json index 63af96bbb98..cb73d4b1a64 100644 --- a/tests/wpt/meta/MANIFEST.json +++ b/tests/wpt/meta/MANIFEST.json @@ -122762,6 +122762,19 @@ {} ] ], + "self-align-normal-flex.html": [ + "26a983dea028cb48617e905504bc456c489b3021", + [ + null, + [ + [ + "/css/reference/ref-filled-green-100px-square.xht", + "==" + ] + ], + {} + ] + ], "self-align-safe-unsafe-flex-001.html": [ "bb933b99d722d462b2b824d86fb15e825a598f5a", [ diff --git a/tests/wpt/tests/css/css-align/self-alignment/self-align-normal-flex.html b/tests/wpt/tests/css/css-align/self-alignment/self-align-normal-flex.html new file mode 100644 index 00000000000..26a983dea02 --- /dev/null +++ b/tests/wpt/tests/css/css-align/self-alignment/self-align-normal-flex.html @@ -0,0 +1,24 @@ + +align-self:normal on flex items + + + + + +

Test passes if there is a filled green square and no red.

+
+
+