gecko-dev/testing/web-platform/tests/css/css-grid/placement/grid-placement-using-named-grid-lines-005.html
Oriol Brufau 14558e90d4 Bug 1619573 [wpt PR 22062] - [css-grid] Fix referencing implicit grid line after auto repeat(), a=testonly
Automatic update from web-platform-tests
[css-grid] Fix referencing implicit grid line after auto repeat()

The indices of both implicit grid lines defined with grid-template-areas
and explicit ones defined with grid-template-rows/columns used to be
stored together in NamedGridColumnLines and NamedGridRowLines.

However, this was problematic, because the former indices already refer
to the final explicit grid so they don't have to be increased when
expanding an auto repeat(), but the latter ones should.

Therefore, this patch stores the indices in separate fields and uses the
correct logic for each one.

BUG=966090

TEST=external/wpt/css/css-grid/placement/grid-placement-using-named-grid-lines-005.html
TEST=external/wpt/css/css-grid/placement/grid-placement-using-named-grid-lines-006.html

Change-Id: I6d423148af0e4dd865f130742f7a927a325cef90
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2081823
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Commit-Queue: Oriol Brufau <obrufau@igalia.com>
Cr-Commit-Position: refs/heads/master@{#747669}

--

wpt-commits: fa8785321b8e3a1baa7bf08423a2c7df3eea5291
wpt-pr: 22062
2020-03-11 14:30:57 +00:00

25 lines
903 B
HTML

<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Grid Layout Test: Grid item placement with implicit named line and auto repeat()</title>
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#line-placement">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<meta name="assert" content="Grid placement algorithm is able to select the right line when defined implicitly with grid-template-areas.">
<style>
.grid {
display: grid;
width: 300px;
height: 300px;
grid-template-areas: "area";
grid-template-columns: repeat(auto-fill, 100px);
grid-template-rows: repeat(auto-fill, 100px) [area-end] 100px;
}
.grid > div {
grid-area: area;
background: green;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="grid">
<div></div>
</div>