Bug 270663 – Masonry isn't performing intrinsic sizing correctly.

• Status: REOPENED
• Component: Layout and Rendering

After a couple of minutes of playing see: https://software.hixie.ch/utilities/js/live-dom-viewer/?saved=12434

Sizing the columns should be done by placing everything in every possible column. (Columns should be the same size I suspect).
Also note this gets more fun with mixing of different column types, e.g. min-content max-content, and different item types (scrollable for example).

Created attachment 470236 [details]
Screenshot.

Attached screenshot of rendering.

[Radar WebKit Bug Importer]

<rdar://problem/124240255>

[Brandon]

Thanks Ian.

I am aware of this bug. I actually already have a fix in progress.

Keep in mind that this gets more complex with subgrid. As you need to place each sub-grid in each possible position, then each subgrid-item in each spot in the subgrid with a complexity of ~O(N_items * N_tracks ^ Subgrid_Nesting)

[Brandon]

I agree nesting sub-grids can get computationally expensive super quickly.

I had computed the Big O complexity a few weeks ago and basically reached the same conclusion (N_items * N_tracks) ^ Layers of nested sub-grids.

Was chatting with Elika about this scenario earlier this week.

[Brandon]

https://github.com/WebKit/WebKit/pull/27048

[EWS]

Committed 277403@main (58b046421e15): <https://commits.webkit.org/277403@main>

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

Hey Brandon - I left a comment here:
https://github.com/WebKit/WebKit/pull/27048#pullrequestreview-1995582560

Can you point me to where you consider an indefinite item *doesn't* start in the track you are accumulating items for?

Ian

I also quickly tested the minibrowser on 277592@main (which i think contains the fix above). And I don't think the original test is working correctly.

[Brandon]

Hi Ian,

Thank you for testing.

Could you share what you are seeing in the MiniBrowser you tested?

I was checking https://software.hixie.ch/utilities/js/live-dom-viewer/?saved=12434 in the MiniBrowser (277403@main) and my columns are all sized 103px and the text content is not overflowing outside of the grid like we were seeing in the STP example.