Bug 158258

Summary: [css-sizing] Item borders are missing with 'min-width:-webkit-fill-available' and zero available width
Product: WebKit Reporter: Javier Fernandez <jfernandez>
Component: Layout and RenderingAssignee: Javier Fernandez <jfernandez>
Status: RESOLVED FIXED    
Severity: Normal CC: commit-queue, darin, esprehn+autocc, glenn, hyatt, jfernandez, kondapallykalyan, rego, simon.fraser, svillar
Priority: P2    
Version: WebKit Nightly Build   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Test case to rerproduce the issue
none
Simplified case to reproduce the issue.
none
Patch none

Description Javier Fernandez 2016-06-01 05:32:20 PDT
Created attachment 280229 [details]
Test case to rerproduce the issue

Steps to reproduce the problem:
1. load the attached testcase

What is the expected behavior?
The grid items should have "1px solid black" borders (same as the flex items have below the <hr>).
There should be no red areas.

What went wrong?
The grid items do not render any border.
Comment 1 Javier Fernandez 2016-06-01 05:35:12 PDT
The issue is clearly reproducible using regular block, so it's unrelated to grid nor flex. 

It seems Firefox renders like the flexbox case is doing in the attached example, so borders are visible.

Attached a simplified case to reproduce the issue using block, flex and grid layout models.
Comment 2 Javier Fernandez 2016-06-01 05:36:03 PDT
Created attachment 280230 [details]
Simplified case to reproduce the issue.
Comment 3 Javier Fernandez 2016-06-01 05:37:01 PDT
The "fill-available" size is defined in the following spec document:

http://www.w3.org/TR/css-sizing-3/#fill-available-sizing"
Comment 4 Javier Fernandez 2016-06-01 05:37:26 PDT
The "fill-available" size is defined in the following spec document:

http://www.w3.org/TR/css-sizing-3/#fill-available-sizing"
Comment 5 Javier Fernandez 2016-06-01 06:50:30 PDT
Created attachment 280232 [details]
Patch
Comment 6 Dave Hyatt 2016-06-01 09:33:50 PDT
Comment on attachment 280232 [details]
Patch

This doesn't seem quite right to me. Does fillAvailableMeasure normally include the border and padding? Shouldn't we just be doing box-sizing adjustments to make this happen correctly rather than hardcoding a max like this?
Comment 7 Javier Fernandez 2016-06-01 10:54:06 PDT
(In reply to comment #6)
> Comment on attachment 280232 [details]
> Patch
> 
> This doesn't seem quite right to me. Does fillAvailableMeasure normally
> include the border and padding? Shouldn't we just be doing box-sizing
> adjustments to make this happen correctly rather than hardcoding a max like
> this?

fillAvailableMeasure should not include box's border and paddings, normally. However, when used for MinSize we need to prevent negative values for the content sizes. Note that fillAvailableMeasure is also used for 'auto', which for the case of MinSize is resolved as zero (plus box-sizing adjustments in that case).

I guess we may follow a similar approach, so applying box-sizing adjustments when ever available space is zero.
Comment 8 Javier Fernandez 2016-06-01 11:44:30 PDT
(In reply to comment #7)
> (In reply to comment #6)
> > Comment on attachment 280232 [details]
> > Patch
> > 
> > This doesn't seem quite right to me. Does fillAvailableMeasure normally
> > include the border and padding? Shouldn't we just be doing box-sizing
> > adjustments to make this happen correctly rather than hardcoding a max like
> > this?
> 
> fillAvailableMeasure should not include box's border and paddings, normally.
                       should include
Comment 9 Javier Fernandez 2016-06-02 08:53:41 PDT
As far as I know, fill-available is not affected by the box-sizing property; If I'm not wrong, like 'auto' for the inline-size. It should behave like 100% and box-sizing: border-box. 

From my understanding of the css-sizing spec, fill-available should include always border and padding, so we can guarantee that box's inner size is always a positive value.
Comment 10 WebKit Commit Bot 2016-06-15 13:48:45 PDT
Comment on attachment 280232 [details]
Patch

Clearing flags on attachment: 280232

Committed r202103: <http://trac.webkit.org/changeset/202103>
Comment 11 WebKit Commit Bot 2016-06-15 13:48:49 PDT
All reviewed patches have been landed.  Closing bug.