Closed Bug 2026922 Opened 5 months ago Closed 5 months ago

[wpt-sync] Sync PR 58787 - [Masonry] Implement fill-reverse for alignment cases

Categories

(Core :: Layout: Grid, task, P4)

Product:
Core
Component:
Layout: Grid
Type:
task

Tracking

()

Status:
RESOLVED FIXED
Milestone:
151 Branch
Tracking Flags:
Tracking Status
firefox151 --- fixed

People

(Reporter: wpt-sync, Unassigned)

References

(Blocks 1 open bug,
URL
)

Details

(Whiteboard: [wptsync downstream])

Attachments

(2 files)

Bug 2026922 [wpt PR 58787] - [Masonry] Implement fill-reverse for alignment cases, a=testonly
48 bytes, text/x-phabricator-request
Details | Review
Bug 2026922 [wpt PR 58787] - Update wpt metadata, a=testonly
48 bytes, text/x-phabricator-request
Details | Review

Sync web-platform-tests PR 58787 into mozilla-central (this bug is closed when the sync is complete).

PR: https://github.com/web-platform-tests/wpt/pull/58787
Details from upstream follow.

Celeste Pan <celestepan@microsoft.com> wrote:

[Masonry] Implement fill-reverse for alignment cases

The specifications for alignment in grid-lanes are in [1].

Most alignment behavior was already working correctly for
fill-reverse, only alignment of the entire blocks of content in
stacking axis were failing, i.e. align-content in columns and
justify-content in rows.

To align along the grid-axis, for columns, we use justify-*, for rows,
we use align-*.

To align along the stacking axis, for columns we use align-*, for rows
we use justify-*. We can only align by start, center, end, and
along the stacking axis. Baseline alignment is NOT supported in the
stacking axis [2].

Note that *-content shifts the entire block of content, while
*-items is shifting items individually within the axes (both grid and
stacking).

Since self-alignment + items-alignment is not yet supported along the
stacking axis, we do not test for that in this change. CSSWG discussion
has been resolved in [3], but it has not yet been implemented.

[1] https://drafts.csswg.org/css-grid-3/#alignment

[2] https://drafts.csswg.org/css-grid-3/#grid-lanes-baseline-alignment

[3] https://github.com/w3c/csswg-drafts/issues/10275

Bug: 343257585
Change-Id: I8603008897db91c01d32a2178a4343c2cd33964e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7680918
Reviewed-by: Yanling Wang \<yanlingwang@microsoft.com>
Reviewed-by: Alison Maher \<almaher@microsoft.com>
Commit-Queue: Celeste Pan \<celestepan@microsoft.com>
Cr-Commit-Position: refs/heads/main@{#1605817}

Component: web-platform-tests → Layout: Grid
Product: Testing → Core

CI Results

Ran 7 Firefox configurations based on mozilla-central, and Firefox, Chrome, and Safari on GitHub CI

Total 42 tests

Status Summary

Firefox

FAIL: 14[GitHub] 42[Gecko-android-em-14-x86_64-debug-geckoview, Gecko-android-em-14-x86_64-lite-opt-geckoview, Gecko-android-em-14-x86_64-opt-geckoview, Gecko-linux2404-64-debug, Gecko-linux2404-64-opt, Gecko-windows11-64-24h2-debug, Gecko-windows11-64-24h2-opt]

Chrome

PASS: 12
FAIL: 2

Safari

FAIL: 14

Links

Gecko CI (Treeherder)
GitHub PR Head
GitHub PR Base

Details

New Tests That Don't Pass

https://hg.mozilla.org/mozilla-central/rev/98bc4879b927
https://hg.mozilla.org/mozilla-central/rev/3eddd474a177

Status: NEW → RESOLVED
Closed: 5 months ago
status-firefox151: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → 151 Branch
Status: RESOLVED → REOPENED
status-firefox151: fixed → ---
Resolution: FIXED → ---
Target Milestone: 151 Branch → ---

Automatic update from web-platform-tests
[Masonry] Implement fill-reverse for alignment cases

The specifications for alignment in grid-lanes are in [1].

Most alignment behavior was already working correctly for
fill-reverse, only alignment of the entire blocks of content in
stacking axis were failing, i.e. align-content in columns and
justify-content in rows.

To align along the grid-axis, for columns, we use justify-*, for rows,
we use align-*.

To align along the stacking axis, for columns we use align-*, for rows
we use justify-*. We can only align by start, center, end, and
along the stacking axis. Baseline alignment is NOT supported in the
stacking axis [2].

Note that *-content shifts the entire block of content, while
*-items is shifting items individually within the axes (both grid and
stacking).

Since self-alignment + items-alignment is not yet supported along the
stacking axis, we do not test for that in this change. CSSWG discussion
has been resolved in [3], but it has not yet been implemented.

[1] https://drafts.csswg.org/css-grid-3/#alignment

[2] https://drafts.csswg.org/css-grid-3/#grid-lanes-baseline-alignment

[3] https://github.com/w3c/csswg-drafts/issues/10275

Bug: 343257585
Change-Id: I8603008897db91c01d32a2178a4343c2cd33964e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7680918
Reviewed-by: Yanling Wang <yanlingwang@microsoft.com>
Reviewed-by: Alison Maher <almaher@microsoft.com>
Commit-Queue: Celeste Pan <celestepan@microsoft.com>
Cr-Commit-Position: refs/heads/main@{#1605817}

--

wpt-commits: fa9333f40b1a6bfb4eb56eeaa4c46b5d49654385
wpt-pr: 58787

wpt-pr: 58787
wpt-type: metadata

https://hg.mozilla.org/mozilla-central/rev/918612c82a8d
https://hg.mozilla.org/mozilla-central/rev/bf79263da9b9

Status: REOPENED → RESOLVED
Closed: 5 months ago → 5 months ago
status-firefox151: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → 151 Branch
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: