Bug 197849 - [css-grid] Grid not updated when changing auto repeat type
Summary: [css-grid] Grid not updated when changing auto repeat type
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Oriol Brufau
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2019-05-13 12:53 PDT by Oriol Brufau
Modified: 2019-05-14 12:07 PDT (History)
5 users (show)

See Also:


Attachments
Patch (21.19 KB, patch)
2019-05-13 12:56 PDT, Oriol Brufau
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews213 for win-future (13.82 MB, application/zip)
2019-05-14 07:30 PDT, Build Bot
no flags Details
Patch (21.21 KB, patch)
2019-05-14 08:53 PDT, Oriol Brufau
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Oriol Brufau 2019-05-13 12:53:24 PDT
What steps will reproduce the problem?
(1) Run this testcase:
```html
<style>
#grid {
  display: grid;
  width: 200px;
  background: linear-gradient(red, red) no-repeat 0 / 100px;
}
#item {
  grid-column-start: 2;
  height: 100px;
  background: green;
}
</style>
<div id="grid">
  <div id="item"></div>
</div>
<script>
var grid = document.getElementById("grid");
grid.style.gridTemplateColumns = "repeat(auto-fill, 100px)";
grid.style.gridTemplateColumns = "repeat(auto-fit, 100px)";
</script>
```

What is the expected result?
There should be a 100x100 green box with no red

What happens instead?
The green box appears more to the right, so you can see red.

This is because when WebKit compares `repeat(auto-fill, 100px)` and `repeat(auto-fit, 100px)`, it only checks whether the list of track sizes are equal, but it doesn't compare `auto-fill` and `auto-fit`. The former produces resolves to `100px 100px` and the latter to `0px 100px`, but Blink thinks they are equal so it doesn't update the grid.

This has been fixed in Blink: https://crbug.com/961407
Comment 1 Oriol Brufau 2019-05-13 12:56:23 PDT
Created attachment 369766 [details]
Patch
Comment 2 Build Bot 2019-05-14 07:30:57 PDT
Comment on attachment 369766 [details]
Patch

Attachment 369766 [details] did not pass win-ews (win):
Output: https://webkit-queues.webkit.org/results/12187483

New failing tests:
imported/blink/compositing/layer-creation/iframe-clip-removed.html
Comment 3 Build Bot 2019-05-14 07:30:59 PDT
Created attachment 369842 [details]
Archive of layout-test-results from ews213 for win-future

The attached test failures were seen while running run-webkit-tests on the win-ews.
Bot: ews213  Port: win-future  Platform: CYGWIN_NT-10.0-17763-3.0.5-338.x86_64-x86_64-64bit
Comment 4 Oriol Brufau 2019-05-14 08:53:33 PDT
Created attachment 369853 [details]
Patch
Comment 5 Oriol Brufau 2019-05-14 08:57:24 PDT
Comment on attachment 369842 [details]
Archive of layout-test-results from ews213 for win-future

The EWS failure seems unrelated to my patch. Anyways, I have rebased it due to a conflict with bug 197854, so let's check again.
Comment 6 Oriol Brufau 2019-05-14 11:54:53 PDT
Comment on attachment 369853 [details]
Patch

Win EWS is green now
Comment 7 WebKit Commit Bot 2019-05-14 12:06:30 PDT
Comment on attachment 369853 [details]
Patch

Clearing flags on attachment: 369853

Committed r245295: <https://trac.webkit.org/changeset/245295>
Comment 8 WebKit Commit Bot 2019-05-14 12:06:32 PDT
All reviewed patches have been landed.  Closing bug.
Comment 9 Radar WebKit Bug Importer 2019-05-14 12:07:57 PDT
<rdar://problem/50776829>