Diff
Modified: trunk/LayoutTests/ChangeLog (287062 => 287063)
--- trunk/LayoutTests/ChangeLog 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/ChangeLog 2021-12-15 06:53:53 UTC (rev 287063)
@@ -1,3 +1,23 @@
+2021-12-14 Joonghun Park <[email protected]>
+
+ Fix that height is calculated incorrectly when using display:table, box-sizing:border-box and padding.
+ https://bugs.webkit.org/show_bug.cgi?id=196175
+
+ Reviewed by Darin Adler.
+
+ Currently, box sizing type check is missing, so the height of display:table element's percent height child
+ is subtracted by its border and padding even when its 'box-sizing' is not 'content-box'.
+
+ This patch adds the missing box sizing type check.
+
+ * platform/gtk/fast/table/003-expected.txt:
+ * platform/gtk/tables/mozilla/bugs/bug30692-expected.txt:
+ * platform/ios/tables/mozilla/bugs/bug30692-expected.txt:
+ * platform/mac-catalina/tables/mozilla/bugs/bug30692-expected.txt:
+ * platform/mac-mojave/tables/mozilla/bugs/bug30692-expected.txt:
+ * platform/mac/fast/table/003-expected.txt:
+ * platform/mac/tables/mozilla/bugs/bug30692-expected.txt:
+
2021-12-14 Ryan Haddad <[email protected]>
REGRESSION (r286982): ASSERTION FAILED: clipRectsContext.rootLayer == m_clipRectsCache->m_clipRectsRoot[clipRectsType]
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (287062 => 287063)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2021-12-15 06:53:53 UTC (rev 287063)
@@ -1,3 +1,18 @@
+2021-12-14 Joonghun Park <[email protected]>
+
+ Fix that height is calculated incorrectly when using display:table, box-sizing:border-box and padding.
+ https://bugs.webkit.org/show_bug.cgi?id=196175
+
+ Reviewed by Darin Adler.
+
+ Currently, box sizing type check is missing, so the height of display:table element's percent height child
+ is subtracted by its border and padding even when its 'box-sizing' is not 'content-box'.
+
+ This patch adds the missing box sizing type check.
+
+ * web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box-expected.html: Added.
+ * web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box.html: Added.
+
2021-12-14 Alex Christensen <[email protected]>
Revert r284816
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box-expected.html (0 => 287063)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box-expected.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box-expected.html 2021-12-15 06:53:53 UTC (rev 287063)
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Test if percentage height of table's child element with box-sizing: border-box is calculated correctly</title>
+<link rel="help" href=""
+<style>
+ html {
+ height: 100%;
+ width: 100%;
+ }
+ body {
+ box-sizing: border-box;
+ display: table;
+ margin: 0 auto;
+ width: 100%;
+ height: 100%;
+ }
+ .content {
+ box-sizing: border-box;
+ display: table-row;
+ width: 100%;
+ height: 100%;
+ background-color: red;
+ }
+ .wrapper {
+ box-sizing: content-box;
+ width: 100%;
+ height: 100%;
+ background-color: green;
+ padding-top: 100px;
+ }
+</style>
+<body>
+ <div class="content">
+ <div class="wrapper">
+ wrapped content (height: 100%)
+ </div>
+ </div>
+</body>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box.html (0 => 287063)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box.html 2021-12-15 06:53:53 UTC (rev 287063)
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Test if percentage height of table's child element with box-sizing: border-box is calculated correctly</title>
+<link rel="help" href=""
+<link rel="match" href=""
+<style>
+ html {
+ height: 100%;
+ width: 100%;
+ }
+ body {
+ box-sizing: border-box;
+ display: table;
+ margin: 0 auto;
+ width: 100%;
+ height: 100%;
+ }
+ .content {
+ box-sizing: border-box;
+ display: table-row;
+ width: 100%;
+ height: 100%;
+ background-color: red;
+ }
+ .wrapper {
+ box-sizing: border-box;
+ width: 100%;
+ height: 100%;
+ background-color: green;
+ padding-top: 100px;
+ }
+</style>
+<body>
+ <div class="content">
+ <div class="wrapper">
+ wrapped content (height: 100%)
+ </div>
+ </div>
+</body>
Modified: trunk/LayoutTests/platform/gtk/fast/table/003-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/gtk/fast/table/003-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/gtk/fast/table/003-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -34,7 +34,7 @@
RenderText {#text} at (2,2) size 37x17
text run at (2,2) width 37: "world"
RenderTableRow {TR} at (0,74) size 213x46
- RenderTableCell {TD} at (2,77) size 209x40 [border: (1px inset #808080)] [r=3 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,74) size 209x46 [border: (1px inset #808080)] [r=3 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderTable {TABLE} at (0,282) size 106x78
RenderTableSection {TBODY} at (0,0) size 106x78
@@ -76,6 +76,6 @@
text run at (243,0) width 119: "Definitely. Should."
layer at (58,16) size 728x18
RenderBlock {DIV} at (3,3) size 728x18
-layer at (16,245) size 201x36 clip at (17,246) size 199x34
- RenderTextControl {TEXTAREA} at (4,2) size 201x36 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (16,242) size 201x42 clip at (17,243) size 199x40
+ RenderTextControl {TEXTAREA} at (4,2) size 201x42 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 195x18
Modified: trunk/LayoutTests/platform/gtk/tables/mozilla/bugs/bug30692-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/gtk/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/gtk/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -20,7 +20,7 @@
RenderTable {TABLE} at (0,36) size 784x100
RenderTableSection {TBODY} at (0,0) size 784x100
RenderTableRow {TR} at (0,2) size 784x96
- RenderTableCell {TD} at (2,14) size 780x72 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,11) size 780x78 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderBlock {HR} at (0,144) size 784x2 [border: (1px inset #000000)]
RenderTable {TABLE} at (0,154) size 784x100
@@ -44,8 +44,8 @@
RenderBlock {P} at (1,1) size 623x80 [bgcolor=#FFFFE0]
RenderText {#text} at (0,0) size 222x17
text run at (0,0) width 222: "OK: the height of the P is 80 pixels"
-layer at (11,96) size 622x69 clip at (12,97) size 620x67
- RenderTextControl {TEXTAREA} at (1,1) size 623x70 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (11,93) size 622x75 clip at (12,94) size 620x73
+ RenderTextControl {TEXTAREA} at (1,1) size 623x76 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 617x18
RenderText {#text} at (0,0) size 295x17
text run at (0,0) width 295: "BUG: the height of the textarea is not 80%"
Modified: trunk/LayoutTests/platform/ios/tables/mozilla/bugs/bug30692-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/ios/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/ios/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -20,7 +20,7 @@
RenderTable {TABLE} at (0,38) size 784x100
RenderTableSection {TBODY} at (0,0) size 784x100
RenderTableRow {TR} at (0,2) size 784x96
- RenderTableCell {TD} at (2,14) size 780x72 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,11) size 780x78 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderBlock {HR} at (0,146) size 784x2 [border: (1px inset #000000)]
RenderTable {TABLE} at (0,156) size 784x100
@@ -44,8 +44,8 @@
RenderBlock {P} at (1,1) size 623x80 [bgcolor=#FFFFE0]
RenderText {#text} at (0,0) size 226x19
text run at (0,0) width 226: "OK: the height of the P is 80 pixels"
-layer at (11,102) size 622x69 clip at (12,103) size 620x67
- RenderTextControl {TEXTAREA} at (1,1) size 623x70 [bgcolor=#FFFFFF] [border: (1px solid #3C3C4399)]
+layer at (11,99) size 622x75 clip at (12,100) size 620x73
+ RenderTextControl {TEXTAREA} at (1,1) size 623x76 [bgcolor=#FFFFFF] [border: (1px solid #3C3C4399)]
RenderBlock {DIV} at (6,3) size 610x14
RenderText {#text} at (0,0) size 223x14
text run at (0,0) width 223: "BUG: the height of the textarea is not 80%"
Modified: trunk/LayoutTests/platform/mac/fast/table/003-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/mac/fast/table/003-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/mac/fast/table/003-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -34,7 +34,7 @@
RenderText {#text} at (2,2) size 38x18
text run at (2,2) width 38: "world"
RenderTableRow {TR} at (0,74) size 173x40
- RenderTableCell {TD} at (2,77) size 169x34 [border: (1px inset #808080)] [r=3 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,74) size 169x40 [border: (1px inset #808080)] [r=3 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderTable {TABLE} at (0,271) size 106x78
RenderTableSection {TBODY} at (0,0) size 106x78
@@ -76,6 +76,6 @@
text run at (246,0) width 121: "Definitely. Should."
layer at (69,16) size 717x13
RenderBlock {DIV} at (3,3) size 718x13
-layer at (16,240) size 161x30 clip at (17,241) size 159x28
- RenderTextControl {TEXTAREA} at (4,2) size 161x30 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (16,237) size 161x36 clip at (17,238) size 159x34
+ RenderTextControl {TEXTAREA} at (4,2) size 161x36 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 155x13
Modified: trunk/LayoutTests/platform/mac/tables/mozilla/bugs/bug30692-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/mac/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/mac/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -20,7 +20,7 @@
RenderTable {TABLE} at (0,36) size 784x100
RenderTableSection {TBODY} at (0,0) size 784x100
RenderTableRow {TR} at (0,2) size 784x96
- RenderTableCell {TD} at (2,14) size 780x72 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,11) size 780x78 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderBlock {HR} at (0,144) size 784x2 [border: (1px inset #000000)]
RenderTable {TABLE} at (0,154) size 784x100
@@ -44,8 +44,8 @@
RenderBlock {P} at (1,1) size 623x80 [bgcolor=#FFFFE0]
RenderText {#text} at (0,0) size 226x18
text run at (0,0) width 226: "OK: the height of the P is 80 pixels"
-layer at (11,96) size 622x69 clip at (12,97) size 620x67
- RenderTextControl {TEXTAREA} at (1,1) size 623x70 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (11,93) size 622x75 clip at (12,94) size 620x73
+ RenderTextControl {TEXTAREA} at (1,1) size 623x76 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 617x13
RenderText {#text} at (0,0) size 223x13
text run at (0,0) width 223: "BUG: the height of the textarea is not 80%"
Modified: trunk/LayoutTests/platform/mac-catalina/tables/mozilla/bugs/bug30692-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/mac-catalina/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/mac-catalina/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -20,7 +20,7 @@
RenderTable {TABLE} at (0,36) size 784x100
RenderTableSection {TBODY} at (0,0) size 784x100
RenderTableRow {TR} at (0,2) size 784x96
- RenderTableCell {TD} at (2,14) size 780x72 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,11) size 780x78 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderBlock {HR} at (0,144) size 784x2 [border: (1px inset #000000)]
RenderTable {TABLE} at (0,154) size 784x100
@@ -44,8 +44,8 @@
RenderBlock {P} at (1,1) size 623x80 [bgcolor=#FFFFE0]
RenderText {#text} at (0,0) size 226x18
text run at (0,0) width 226: "OK: the height of the P is 80 pixels"
-layer at (11,96) size 622x69 clip at (12,97) size 620x67
- RenderTextControl {TEXTAREA} at (1,1) size 623x70 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (11,93) size 622x75 clip at (12,94) size 620x73
+ RenderTextControl {TEXTAREA} at (1,1) size 623x76 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 617x13
RenderText {#text} at (0,0) size 222x13
text run at (0,0) width 222: "BUG: the height of the textarea is not 80%"
Modified: trunk/LayoutTests/platform/mac-mojave/tables/mozilla/bugs/bug30692-expected.txt (287062 => 287063)
--- trunk/LayoutTests/platform/mac-mojave/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/LayoutTests/platform/mac-mojave/tables/mozilla/bugs/bug30692-expected.txt 2021-12-15 06:53:53 UTC (rev 287063)
@@ -20,7 +20,7 @@
RenderTable {TABLE} at (0,36) size 784x100
RenderTableSection {TBODY} at (0,0) size 784x100
RenderTableRow {TR} at (0,2) size 784x96
- RenderTableCell {TD} at (2,14) size 780x72 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
+ RenderTableCell {TD} at (2,11) size 780x78 [bgcolor=#FF0000] [r=0 c=0 rs=1 cs=1]
RenderText {#text} at (0,0) size 0x0
RenderBlock {HR} at (0,144) size 784x2 [border: (1px inset #000000)]
RenderTable {TABLE} at (0,154) size 784x100
@@ -44,8 +44,8 @@
RenderBlock {P} at (1,1) size 623x80 [bgcolor=#FFFFE0]
RenderText {#text} at (0,0) size 226x18
text run at (0,0) width 226: "OK: the height of the P is 80 pixels"
-layer at (11,96) size 622x69 clip at (12,97) size 620x67
- RenderTextControl {TEXTAREA} at (1,1) size 623x70 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+layer at (11,93) size 622x75 clip at (12,94) size 620x73
+ RenderTextControl {TEXTAREA} at (1,1) size 623x76 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
RenderBlock {DIV} at (3,3) size 617x13
RenderText {#text} at (0,0) size 222x13
text run at (0,0) width 222: "BUG: the height of the textarea is not 80%"
Modified: trunk/Source/WebCore/ChangeLog (287062 => 287063)
--- trunk/Source/WebCore/ChangeLog 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/Source/WebCore/ChangeLog 2021-12-15 06:53:53 UTC (rev 287063)
@@ -1,3 +1,20 @@
+2021-12-14 Joonghun Park <[email protected]>
+
+ Fix that height is calculated incorrectly when using display:table, box-sizing:border-box and padding.
+ https://bugs.webkit.org/show_bug.cgi?id=196175
+
+ Reviewed by Darin Adler.
+
+ Currently, box sizing type check is missing, so the height of display:table element's percent height child
+ is subtracted by its border and padding even when its 'box-sizing' is not 'content-box'.
+
+ This patch adds the missing box sizing type check.
+
+ Test: imported/w3c/web-platform-tests/css/css-sizing/table-child-percentage-height-with-border-box.html
+
+ * rendering/RenderBox.cpp:
+ (WebCore::RenderBox::computePercentageLogicalHeight const):
+
2021-12-14 Alan Bujtas <[email protected]>
[IFC][Integration] Use logical margin/border/padding values in layout
Modified: trunk/Source/WebCore/rendering/RenderBox.cpp (287062 => 287063)
--- trunk/Source/WebCore/rendering/RenderBox.cpp 2021-12-15 05:44:52 UTC (rev 287062)
+++ trunk/Source/WebCore/rendering/RenderBox.cpp 2021-12-15 06:53:53 UTC (rev 287063)
@@ -3346,7 +3346,7 @@
// then we must subtract the border and padding from the cell's
// |availableHeight| (given by |overridingLogicalHeight|) to arrive
// at the child's computed height.
- bool subtractBorderAndPadding = isTable() || (is<RenderTableCell>(*cb) && !skippedAutoHeightContainingBlock && cb->hasOverridingLogicalHeight());
+ bool subtractBorderAndPadding = isTable() || (is<RenderTableCell>(*cb) && !skippedAutoHeightContainingBlock && cb->hasOverridingLogicalHeight() && style().boxSizing() == BoxSizing::ContentBox);
if (subtractBorderAndPadding) {
result -= borderAndPaddingLogicalHeight();
return std::max(0_lu, result);