[css-flexbox] select element incorrectly allows itself to shrink to a main-size of 0, in a flex container

• Component: CSS
• Status: REOPENED ---

[Carlos Alberto Lopez Perez]

Steps to reproduce:

Put select element inside flexbox and apply some "pressure":
https://jsfiddle.net/Risord/dvky8w4m/4/

Actual results:
Select will be collapsed all the way zero height (in demo there is a bit more space so that select is easier to see).

Expected results:
Select should keep it's "obvious" height just like the div (and other form inputs etc.). Chrome and Edge also handle select correct way.


This very same issue has been reported (and fixed) on firefox at : https://bugzilla.mozilla.org/show_bug.cgi?id=1591925
Chrome doesn't have this issue.

This is tested by the following WPT tests (that fail on WebKit):

https://wpt.live/css/css-flexbox/select-element-zero-height-001.html
https://wpt.live/css/css-flexbox/select-element-zero-height-002.html

[Sergio Villar Senin]

There is a problem in the tests.

[Sergio Villar Senin]

Created attachment 442006 [details]
Patch

[Sergio Villar Senin]

WPT also confirms they're working fine https://wpt.fyi/results/css/css-flexbox?label=master&label=experimental&product=chrome&product=edge&product=firefox&product=webkitgtk&aligned

[Radar WebKit Bug Importer]

<rdar://problem/94158795>

[Brent Fulgham]

We show this as a failure in STP 146. Is this a Safari-only issue we are having?

[Sam Sneddon [:gsnedders]]

https://wpt.fyi/analyzer?screenshot=sha1%3A7c46f91fa7586a0036094866a706ac1f220f14eb&screenshot=sha1%3A2d1204d50c43764eeae10692c176aa39fdd7ccfa

this being a few pixels makes me wonder if it's related to intrinsic margins on form elements? it's 1 pixel off vertically, which suggests it is something else, though the height of the select element seems right.

[Tim Nguyen (:ntim)]

Intrinsic margins were removed (https://github.com/WebKit/WebKit/pull/3205), and this isn't fixed.