Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-14 09:55:35 +01:00
Code Issues Projects Releases Packages Wiki Activity

layout: Fix depends_on_block_constraints logic (#38318)

Browse source 
The logic was wrong, sometimes we weren't setting it to true on flex
containers that needed it, and then as a workaround we were setting it
to to true on flex items that didn't need it.

For example, this testcase had 5 cache misses when stretching the items,
now we will avoid laying them out again:
```html
<div style="display: flex">
  <div></div>  <div></div>  <div></div>  <div></div>  <div></div>
</div>
```

Also, the workaround wasn't always working, e.g. it failed to stretch
the green element here:
```html
<div style="display: flex; min-height: 200px">
  <div>
    <div style="display: flex; height: 100%; background-color: red">
      <div style="width: 200px; background-color: green;"></div>
    </div>
  </div>
</div>
```

Testing: Adding new test
Fixes: #38023

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Oriol Brufau 2025-07-29 11:59:54 +02:00 • committed by GitHub
parent a5d4c49ec6
commit 3d2f0d1be5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 50 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

13
tests/wpt/meta/MANIFEST.json vendored
View file

@ -183398,6 +183398,19 @@
{}
]
],
"stretched-child-in-nested-flexbox-003.html": [
"7f8cd10da3afd7812353ac39eff15194f328058a",
[
null,
[
[
"/css/reference/ref-filled-green-200px-square.html",
"=="
]
],
{}
]
],
"stretching-orthogonal-flows.html": [
"acaa787faf657b76a5b213fb9203088d5d28f4c4",
[

19
tests/wpt/tests/css/css-flexbox/stretched-child-in-nested-flexbox-003.html vendored Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<title>css-flexbox: stretching of flex item in nested flexbox</title>
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
<link rel="help" href="https://github.com/servo/servo/issues/38023">
<link rel="match" href="/css/reference/ref-filled-green-200px-square.html">
<meta name="assert" content="Due to min-height, the outer flex container is 200px tall.
It's single-line, so its flex item stretched to that size, and is considered definite.
Therefore, the percentage in the nested flex container resolves as 200px.
And thus its flex item is also stretched to be 200px tall.
">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="display: flex; min-height: 200px">
<div>
<div style="display: flex; height: 100%; background-color: red">
<div style="width: 200px; background-color: green;"></div>
</div>
</div>
</div>