Bug 225339 - [css-flexbox] Wrong height of an empty table inside an orthogonal flex parent
Summary: [css-flexbox] Wrong height of an empty table inside an orthogonal flex parent
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2021-05-03 17:54 PDT by Felipe Erias
Modified: 2021-05-20 01:00 PDT (History)
14 users (show)

See Also:


Attachments
Patch (4.82 KB, patch)
2021-05-03 18:50 PDT, Felipe Erias
no flags Details | Formatted Diff | Diff
Patch (4.75 KB, patch)
2021-05-05 19:54 PDT, Felipe Erias
no flags Details | Formatted Diff | Diff
Patch (7.76 KB, patch)
2021-05-07 03:13 PDT, Felipe Erias
no flags Details | Formatted Diff | Diff
Patch (7.83 KB, patch)
2021-05-09 21:19 PDT, Felipe Erias
no flags Details | Formatted Diff | Diff
Patch (7.86 KB, patch)
2021-05-14 01:35 PDT, Felipe Erias
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Felipe Erias 2021-05-03 17:54:09 PDT
Failing test:

  imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-specified-height.html

The flex box has vertical flow and the child table has horizontal writing direction, which means that the logical width for the flex box is the logical height for the child.

But since the table is empty, the logical height calculated by RenderTable::layout() is just the "height" property. This value is stored as the child's intrinsic content logical height.

Later on, RenderFlexibleBox::adjustChildSizeForMinAndMax() will try to find the child's min height through computeMainAxisExtentForChild(). Since the child's direction is orthogonal to the flexbox's direction, this will be done with a simple call to computeContentLogicalHeight() passing the previously cached value as the child's intrinsic content height.

Because that cached value is assumed to be correct (even though the table is actually empty and could be shorter) the final flexbox layout is wrong.
Comment 1 Felipe Erias 2021-05-03 18:50:37 PDT
Created attachment 427629 [details]
Patch
Comment 2 Sergio Villar Senin 2021-05-05 03:08:28 PDT
Comment on attachment 427629 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=427629&action=review

> Source/WebCore/ChangeLog:15
> +        layout problems (the table is actually empty and may be assigned a different height by its parent).

This paragraph should go in between the "Reviewed by" and the "Test:"

> Source/WebCore/rendering/RenderTable.cpp:538
> +                setLogicalHeight(logicalHeight() + computedLogicalHeight);

What about 

setLogicalHeight(hasOverridingLogicalHeight() ? overridingLogicalHeight() : logicalHeight() + computedLogicalHeight);

we don't fear long lines in WebKit :)

> Source/WebCore/rendering/RenderTable.cpp:609
> +

This add a subtle change for the case of having an empty table with no overriding logical height. We used to cache that value anyway but now you are not doing it. Do we have test coverage for that?
Comment 3 Felipe Erias 2021-05-05 19:54:30 PDT
Created attachment 427842 [details]
Patch
Comment 4 Felipe Erias 2021-05-07 03:13:33 PDT
Created attachment 427986 [details]
Patch
Comment 5 Felipe Erias 2021-05-09 21:19:27 PDT
Created attachment 428152 [details]
Patch
Comment 6 EWS Watchlist 2021-05-09 21:20:23 PDT
This patch modifies the imported WPT tests. Please ensure that any changes on the tests (not coming from a WPT import) are exported to WPT. Please see https://trac.webkit.org/wiki/WPTExportProcess
Comment 7 Radar WebKit Bug Importer 2021-05-10 17:55:17 PDT
<rdar://problem/77798383>
Comment 8 Manuel Rego Casasnovas 2021-05-14 00:56:14 PDT
Comment on attachment 428152 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=428152&action=review

> LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-specified-width-vertical.html:1
> +<!DOCTYPE html>

You have to add a -expected.txt file with the same name than this test. So adding table-as-item-specified-width-vertical-expected.html that is a copy of ref-filled-green-100px-square-only.html. That's what the importer would do on that case.
Comment 9 Manuel Rego Casasnovas 2021-05-14 01:03:02 PDT
(In reply to Manuel Rego Casasnovas from comment #8)
> Comment on attachment 428152 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=428152&action=review
> 
> > LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-specified-width-vertical.html:1
> > +<!DOCTYPE html>
> 
> You have to add a -expected.txt file with the same name than this test. So
> adding table-as-item-specified-width-vertical-expected.html that is a copy
> of ref-filled-green-100px-square-only.html. That's what the importer would
> do on that case.

Oops sorry, it's there already.
Comment 10 Felipe Erias 2021-05-14 01:35:44 PDT
Created attachment 428611 [details]
Patch
Comment 11 Sergio Villar Senin 2021-05-14 02:46:17 PDT
Comment on attachment 428611 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=428611&action=review

Looking good but let's try to land the patch in WPT first so that there is no disagreement with other vendors. Table stuff is really hard WRT interoperability.

> LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-specified-width-vertical-expected.html:2
> +<link rel="author" title="Morten Stenshorne" href="mstensho@chromium.org">

I guess you're the author ;)
Comment 12 EWS 2021-05-20 01:00:28 PDT
Committed r277777 (237938@main): <https://commits.webkit.org/237938@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 428611 [details].