Bug 260201

Summary: REGRESSION(261003@main): [css-contain] contain: inline-size breaks grid-template-rows: auto in Safari iOS 17
Product: WebKit Reporter: Johannes Odland <johannes.odland>
Component: CSSAssignee: Sammy Gill <sgill26>
Status: RESOLVED FIXED    
Severity: Major CC: simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 17   
Hardware: iPhone / iPad   
OS: Unspecified   
See Also: https://github.com/web-platform-tests/wpt/pull/43651
https://bugs.webkit.org/show_bug.cgi?id=266506
Attachments:
Description Flags
A screenshot of the bug. none

Description Johannes Odland 2023-08-15 07:41:45 PDT
Created attachment 467280 [details]
A screenshot of the bug.

Adding `contain: inline-size` collapses auto sized grid rows.

# How to reproduce: 

Add `contain: inline-size` to a grid element with grid-template-rows: auto;

A test-case is available here: https://johannesodland.github.io/browserbugs/2023/safari-contain-inline-size-grid-issue.html


```html
<section>
    <div>
        Lorem ipsum
    </div>
</section>
```

```css
section {
    box-sizing: border-box;
    display: grid;
    min-height: 100svh;
    grid-template-rows: auto;
    padding: 30px;
    contain: inline-size;
}

div {
    align-self: end;
}

```

# Expected result: 
Grid row height is unaffected. 
The text is placed in the bottom of the screen.

#Actual result
Grid row height collapses
The text is placed in the top of the screen.
Comment 1 Radar WebKit Bug Importer 2023-08-15 10:43:46 PDT
<rdar://problem/113915953>
Comment 2 Sammy Gill 2023-12-12 12:55:11 PST
Pull request: https://github.com/WebKit/WebKit/pull/21701
Comment 3 Sammy Gill 2023-12-13 11:59:21 PST
I believe this issue that is occurring here is that we are skipping the step in the grid track sizing algorithm where we are supposed to distribute extra space to the tracks. AFAICT there is no reason to skip this part since this part of the spec has nothing to do with the content of the grid itself so it should still be done. 

By skipping this step the row is effectively sized to the height of the text and so has no room to perform any alignment like the one specified
Comment 4 Sammy Gill 2023-12-13 12:21:29 PST
Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/43651
Comment 5 EWS 2023-12-14 17:02:41 PST
Committed 272085@main (cf2a9868136a): <https://commits.webkit.org/272085@main>

Reviewed commits have been landed. Closing PR #21701 and removing active labels.