Skip to content
Permalink
Browse files
Adds "box-sizing: border-box" to table in UA stylesheet 
https://bugs.webkit.org/show_bug.cgi?id=243234
<rdar://97634949>

Reviewed by Tim Nguyen.

This changes the UA stylesheet to match to the spec
and adjusts the relevant tests.
https://html.spec.whatwg.org/#tables-2

* Source/WebCore/css/html.css:
(table):
* LayoutTests/fast/borders/border-image-fill-no-border-expected.html:
* LayoutTests/fast/borders/resources/svg-50x50-intrinsic.svg: Added.
* LayoutTests/fast/table/min-width-html-block-table-expected.txt:
* LayoutTests/fast/table/min-width-html-inline-table-expected.txt:
* LayoutTests/fast/table/resources/min-width-helpers.js:
* LayoutTests/imported/w3c/web-platform-tests/css/css-position/position-absolute-table-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/html/rendering/non-replaced-elements/form-controls/resets.html:
* LayoutTests/imported/w3c/web-platform-tests/html/rendering/non-replaced-elements/tables/table-ua-stylesheet-expected.txt:
* LayoutTests/platform/glib/tables/mozilla_expected_failures/bugs/bug3166-14-expected.txt:
* LayoutTests/platform/glib/tables/mozilla_expected_failures/bugs/bug3166-17-expected.txt:
* LayoutTests/platform/glib/tables/mozilla/bugs/bug145572-expected.txt:
* LayoutTests/platform/gtk/tables/mozilla_expected_failures/bugs/bug3166-14-expected.png:
* LayoutTests/platform/gtk/tables/mozilla_expected_failures/bugs/bug3166-17-expected.png:
* LayoutTests/platform/ios/tables/mozilla_expected_failures/bugs/bug3166-14-expected.txt:
* LayoutTests/platform/ios/tables/mozilla_expected_failures/bugs/bug3166-17-expected.txt:
* LayoutTests/platform/ios/tables/mozilla/bugs/bug145572-expected.txt:
* LayoutTests/platform/mac-wk1/imported/w3c/web-platform-tests/html/rendering/non-replaced-elements/form-controls/resets-expected.txt:
* LayoutTests/platform/mac/tables/mozilla_expected_failures/bugs/bug3166-14-expected.txt:
* LayoutTests/platform/mac/tables/mozilla_expected_failures/bugs/bug3166-17-expected.txt:
* LayoutTests/platform/mac/tables/mozilla/bugs/bug145572-expected.txt:
* LayoutTests/platform/win/tables/mozilla_expected_failures/bugs/bug3166-14-expected.txt:
* LayoutTests/platform/win/tables/mozilla_expected_failures/bugs/bug3166-17-expected.txt:
* LayoutTests/platform/win/tables/mozilla/bugs/bug145572-expected.txt:

Canonical link: https://commits.webkit.org/253581@main
  • Loading branch information
@karlcow @nt1m
karlcow authored and nt1m committed Aug 19, 2022
1 parent 19f261f commit 8915be4c047012129bacf9c755fc56e925a397e3
Show file tree
Hide file tree
Showing 26 changed files with 206 additions and 187 deletions.
29 LayoutTests/fast/borders/border-image-fill-no-border-expected.html
View file
@@ -24,35 +24,46 @@
left: -10;
top: -10;
}
.cenetered-in {
.centered-in {
position: absolute;
left: 10;
top: 10;
}
.centered-in {
position: absolute;
left: 10;
top: 10;
}
.centered-in-table {
position: absolute;
left: -10;
top: -10;
}
.scaled-down {
transform: scale(0.8);
-webkit-transform: scale(0.8);
}
.scaled-up {
transform: scale(1.333);
-webkit-transform: scale(1.333);
}
.scaled-down-table {
transform: scale(0.4);
}
</style>
</head>
<body>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="centered-in scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="centered-in scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<br>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="centered-in scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="centered-in scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<br>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-down" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-container"><img class="centered-in-table scaled-down-table" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-container"><img class="centered-out scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-thick-container"><img class="cenetered-in scaled-up" src="resources/svg-100x100-intrinsic.svg"></div>
<div class="inline-block image-cropper fixed-container"><img src="resources/svg-50x50-intrinsic.svg"></div>
</body>
</htm>
5 LayoutTests/fast/borders/border-image-fill-no-border.html
View file
@@ -24,6 +24,9 @@
.border-image-thick-slice {
border-image: url('resources/svg-100x100-intrinsic.svg') 20 fill;
}
.border-image-thick-slice-table {
border-image: url('resources/svg-50x50-intrinsic.svg') 20 fill;
}
</style>
</head>
<body>
@@ -40,6 +43,6 @@
<table class="inline-block fixed-container zero-border border-image-zero-slice"><tr/></table>
<table class="inline-block fixed-container thick-border border-image-zero-slice"><tr/></table>
<table class="inline-block fixed-container zero-border border-image-thick-slice"><tr/></table>
<table class="inline-block fixed-container thick-border border-image-thick-slice"><tr/></table>
<table class="inline-block fixed-container thick-border border-image-thick-slice-table"><tr/></table>
</body>
</html>
4 LayoutTests/fast/borders/resources/svg-50x50-intrinsic.svg
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
120 LayoutTests/fast/table/min-width-html-block-table-expected.txt
View file
@@ -20,77 +20,77 @@ function computeLogicalWidth(writingMode, direction, tableStyle)

==== Test ltr direction ====

PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 150px;') is '250px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 50px;') is '250px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 600px; min-width: 500px;') is '570px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 400px; min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 60%; min-width: 500px;') is '570px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 40%; min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 15%;') is '250px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 5%;') is '250px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 600px; min-width: 50%;') is '570px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 400px; min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 60%; min-width: 50%;') is '570px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 40%; min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: auto;') is '250px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 150px;') is '280px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 50px;') is '280px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 600px; min-width: 500px;') is '600px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 400px; min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 60%; min-width: 500px;') is '600px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 40%; min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 15%;') is '280px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: 5%;') is '280px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 600px; min-width: 50%;') is '600px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 400px; min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 60%; min-width: 50%;') is '600px'
PASS computeLogicalWidth('horizontal', 'ltr', 'width: 40%; min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'ltr', 'min-width: auto;') is '280px'

==== Test rtl direction ====

PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 150px;') is '250px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 50px;') is '250px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 600px; min-width: 500px;') is '570px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 400px; min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 60%; min-width: 500px;') is '570px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 40%; min-width: 500px;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 15%;') is '250px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 5%;') is '250px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 600px; min-width: 50%;') is '570px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 400px; min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 60%; min-width: 50%;') is '570px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 40%; min-width: 50%;') is '470px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: auto;') is '250px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 150px;') is '280px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 50px;') is '280px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 600px; min-width: 500px;') is '600px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 400px; min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 60%; min-width: 500px;') is '600px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 40%; min-width: 500px;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 15%;') is '280px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: 5%;') is '280px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 600px; min-width: 50%;') is '600px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 400px; min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 60%; min-width: 50%;') is '600px'
PASS computeLogicalWidth('horizontal', 'rtl', 'width: 40%; min-width: 50%;') is '500px'
PASS computeLogicalWidth('horizontal', 'rtl', 'min-width: auto;') is '280px'

======== Test vertical writing mode ========

==== Test ltr direction ====

PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 150px;') is '250px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 50px;') is '250px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 600px; min-height: 500px;') is '570px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 400px; min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 60%; min-height: 500px;') is '570px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 40%; min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 15%;') is '250px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 5%;') is '250px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 600px; min-height: 50%;') is '570px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 400px; min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 60%; min-height: 50%;') is '570px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 40%; min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: auto;') is '250px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 150px;') is '280px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 50px;') is '280px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 600px; min-height: 500px;') is '600px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 400px; min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 60%; min-height: 500px;') is '600px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 40%; min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 15%;') is '280px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: 5%;') is '280px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 600px; min-height: 50%;') is '600px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 400px; min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 60%; min-height: 50%;') is '600px'
PASS computeLogicalWidth('vertical', 'ltr', 'height: 40%; min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'ltr', 'min-height: auto;') is '280px'

==== Test rtl direction ====

PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 150px;') is '250px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 50px;') is '250px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 600px; min-height: 500px;') is '570px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 400px; min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 60%; min-height: 500px;') is '570px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 40%; min-height: 500px;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 15%;') is '250px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 5%;') is '250px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 600px; min-height: 50%;') is '570px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 400px; min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 60%; min-height: 50%;') is '570px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 40%; min-height: 50%;') is '470px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: auto;') is '250px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 150px;') is '280px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 50px;') is '280px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 600px; min-height: 500px;') is '600px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 400px; min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 60%; min-height: 500px;') is '600px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 40%; min-height: 500px;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 15%;') is '280px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: 5%;') is '280px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 600px; min-height: 50%;') is '600px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 400px; min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 60%; min-height: 50%;') is '600px'
PASS computeLogicalWidth('vertical', 'rtl', 'height: 40%; min-height: 50%;') is '500px'
PASS computeLogicalWidth('vertical', 'rtl', 'min-height: auto;') is '280px'

PASS successfullyParsed is true

0 comments on commit 8915be4

Please sign in to comment.