Skip to content

Commit 1a01059

Browse files
nt1mnt1m
committed
[Forms] Use button instead of push-button appearance for input[type=submit|reset|button]
https://bugs.webkit.org/show_bug.cgi?id=238803 rdar://91624840 Reviewed by Aditya Keerthi. - Fixes bug reported by GOV.UK about font-size not applying on input[type=file]: https://bugs.webkit.org/show_bug.cgi?id=224746 - Fixes input[type=button|reset|submit] not supporting multi-line values: https://bugs.webkit.org/show_bug.cgi?id=190521 - Fixes input[type=button|reset|submit] not honoring font-size/padding/height/etc. properly like other browsers * Source/WebCore/rendering/RenderTheme.cpp: (WebCore::RenderTheme::autoAppearanceForElement const): Use StyleAppearance::Button instead of StyleAppearance::PushButton * LayoutTests/fast/css/button-height-expected.txt: * LayoutTests/fast/css/button-height.html: Adjust test now that input[type=button] honors height on macOS. * LayoutTests/platform/ios/css2.1/20110323/replaced-elements-001-expected.txt: * LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt: * LayoutTests/platform/ios/fast/forms/button-style-color-expected.txt: * LayoutTests/platform/mac-bigsur/fast/css/continuationCrash-expected.txt: * LayoutTests/platform/mac-bigsur/fast/forms/button-sizes-expected.txt: * LayoutTests/platform/mac-bigsur/fast/forms/control-restrict-line-height-expected.txt: * LayoutTests/platform/mac-bigsur/tables/mozilla/bugs/bug2479-3-expected.txt: * LayoutTests/platform/mac-bigsur/tables/mozilla/bugs/bug26178-expected.txt: * LayoutTests/platform/mac-monterey/fast/forms/button-sizes-expected.txt: * LayoutTests/platform/mac-ventura/fast/forms/button-sizes-expected.txt: * LayoutTests/platform/mac-ventura/fast/forms/input-button-sizes-expected.txt: Added. * LayoutTests/platform/mac-ventura-wk2-lbse-text/svg/custom/foreign-object-skew-expected.txt: * LayoutTests/platform/mac/css3/flexbox/button-expected.txt: * LayoutTests/platform/mac/editing/selection/3690703-2-expected.txt: * LayoutTests/platform/mac/editing/selection/3690703-expected.txt: * LayoutTests/platform/mac/editing/selection/3690719-expected.txt: * LayoutTests/platform/mac/editing/selection/4397952-expected.txt: * LayoutTests/platform/mac/editing/selection/5240265-expected.txt: * LayoutTests/platform/mac/editing/selection/selection-button-text-expected.txt: * LayoutTests/platform/mac/fast/block/float/float-avoidance-expected.txt: * LayoutTests/platform/mac/fast/css/continuationCrash-expected.txt: * LayoutTests/platform/mac/fast/css/input-search-padding-expected.txt: * LayoutTests/platform/mac/fast/css/margin-top-bottom-dynamic-expected.txt: * LayoutTests/platform/mac/fast/css/rtl-ordering-expected.txt: * LayoutTests/platform/mac/fast/dom/HTMLTextAreaElement/reset-textarea-expected.txt: * LayoutTests/platform/mac/fast/forms/001-expected.txt: * LayoutTests/platform/mac/fast/forms/basic-buttons-expected.txt: * LayoutTests/platform/mac/fast/forms/blankbuttons-expected.txt: * LayoutTests/platform/mac/fast/forms/box-shadow-override-expected.txt: * LayoutTests/platform/mac/fast/forms/button-positioned-expected.txt: * LayoutTests/platform/mac/fast/forms/button-style-color-expected.txt: * LayoutTests/platform/mac/fast/forms/button-table-styles-expected.txt: * LayoutTests/platform/mac/fast/forms/button-text-transform-expected.txt: * LayoutTests/platform/mac/fast/forms/control-restrict-line-height-expected.txt: * LayoutTests/platform/mac/fast/forms/file/file-input-direction-expected.txt: * LayoutTests/platform/mac/fast/forms/file/file-input-disabled-expected.txt: * LayoutTests/platform/mac/fast/forms/file/input-file-re-render-expected.txt: * LayoutTests/platform/mac/fast/forms/form-element-geometry-expected.txt: * LayoutTests/platform/mac/fast/forms/formmove3-expected.txt: * LayoutTests/platform/mac/fast/forms/input-appearance-height-expected.txt: * LayoutTests/platform/mac/fast/forms/input-button-sizes-expected.txt: * LayoutTests/platform/mac/fast/forms/input-value-expected.txt: * LayoutTests/platform/mac/fast/forms/targeted-frame-submission-expected.txt: * LayoutTests/platform/mac/fast/html/details-replace-summary-child-expected.txt: * LayoutTests/platform/mac/fast/html/details-replace-text-expected.txt: * LayoutTests/platform/mac/fast/overflow/scroll-nested-positioned-layer-in-overflow-expected.txt: * LayoutTests/platform/mac/fast/overflow/scrollRevealButton-expected.txt: * LayoutTests/platform/mac/fast/replaced/replaced-breaking-expected.txt: * LayoutTests/platform/mac/fast/replaced/width100percent-button-expected.txt: * LayoutTests/platform/mac/fast/text/international/hindi-spacing-expected.txt: * LayoutTests/platform/mac/fast/text/textIteratorNilRenderer-expected.txt: * LayoutTests/platform/mac/http/tests/navigation/javascriptlink-frames-expected.txt: * LayoutTests/platform/mac/svg/custom/foreign-object-skew-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug1188-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug1318-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug138725-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug18359-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug2479-2-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug2479-3-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug2479-4-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug26178-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug28928-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug33855-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug39209-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug4429-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug46368-1-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug46368-2-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug51037-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug51727-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug52505-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug52506-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug60749-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug7342-expected.txt: * LayoutTests/platform/mac/tables/mozilla/bugs/bug92647-2-expected.txt: * LayoutTests/platform/mac/tables/mozilla/collapsing_borders/bug41262-4-expected.txt: * LayoutTests/platform/mac/tables/mozilla/dom/tableDom-expected.txt: * LayoutTests/platform/mac/tables/mozilla/other/move_row-expected.txt: * LayoutTests/platform/mac/tables/mozilla_expected_failures/bugs/bug1725-expected.txt: * LayoutTests/platform/mac/tables/mozilla_expected_failures/bugs/bug2479-5-expected.txt: * LayoutTests/platform/mac/tables/mozilla_expected_failures/bugs/bug58402-2-expected.txt: Rebaseline a bunch of tests. Canonical link: https://commits.webkit.org/258754@main
1 parent dd88e1d commit 1a01059

File tree

83 files changed

+500
-418
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

83 files changed

+500
-418
lines changed

‎LayoutTests/fast/css/button-height-expected.txt‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
11
This tests that the specified height is honored (*) for <input> and <button> elements.
2-
(*) The Mac ports ignore the specified height for <input type="button"> elements unless a border and/or background CSS property is also specified (see the fifth button below). Disregarding padding, they render the button with a height equal to the height of the font used for the button label.
32

43
On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
54

65

76
PASS document.getElementById('button1').offsetHeight is document.getElementById('button2').offsetHeight
87
PASS document.getElementById('button3').offsetHeight is 40
98
PASS document.getElementById('button4').offsetHeight is 40
10-
PASS document.getElementById('button5').offsetHeight is correct for this platform.
9+
PASS document.getElementById('button5').offsetHeight is 40
1110

1211
TEST COMPLETE
1312

‎LayoutTests/fast/css/button-height.html‎

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,12 @@
1414
shouldBe("document.getElementById('button1').offsetHeight", "document.getElementById('button2').offsetHeight");
1515
shouldEvaluateTo("document.getElementById('button3').offsetHeight", 40);
1616
shouldEvaluateTo("document.getElementById('button4').offsetHeight", 40);
17-
18-
// Note, the expected height is the height of button 1 for the Mac ports, and 40 otherwise.
19-
var expectedButton5Height = (navigator.platform.indexOf("Mac") !== -1) ? document.getElementById("button1").offsetHeight : 40;
20-
if (document.getElementById('button5').offsetHeight == expectedButton5Height)
21-
testPassed("document.getElementById('button5').offsetHeight is correct for this platform.");
22-
else
23-
testFailed("document.getElementById('button5').offsetHeight is incorrect for this platform. Should be the same height as button 1 for the Mac ports and 40 otherwise.");
17+
shouldEvaluateTo("document.getElementById('button5').offsetHeight", 40);
2418

2519
if (window.testRunner) {
2620
var testContainer = document.getElementById("test-container");
2721
if (testContainer)
28-
document.body.removeChild(testContainer);
22+
document.body.removeChild(testContainer);
2923
}
3024
debug('<br /><span class="pass">TEST COMPLETE</span>');
3125
}
@@ -45,10 +39,7 @@
4539
<hr/>
4640
<div id="console"></div>
4741
<script>
48-
description("This tests that the specified height is honored (*) for &lt;input&gt; and &lt;button&gt; elements.<br/>" +
49-
"(*) The Mac ports ignore the specified height for &lt;input type=&quot;button&quot;&gt; elements unless a " +
50-
"border and/or background CSS property is also specified (see the fifth button below). Disregarding " +
51-
"padding, they render the button with a height equal to the height of the font used for the button label.");
42+
description("This tests that the specified height is honored (*) for &lt;input&gt; and &lt;button&gt; elements.");
5243
</script>
5344
</body>
5445
</html>

‎LayoutTests/platform/ios/css2.1/20110323/replaced-elements-001-expected.txt‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
11
layer at (0,0) size 800x600
22
RenderView at (0,0) size 800x600
3-
layer at (0,0) size 800x164
4-
RenderBlock {HTML} at (0,0) size 800x164
5-
RenderBody {BODY} at (8,16) size 784x132
3+
layer at (0,0) size 800x156
4+
RenderBlock {HTML} at (0,0) size 800x156
5+
RenderBody {BODY} at (8,16) size 784x124
66
RenderBlock {P} at (0,0) size 784x20
77
RenderText {#text} at (0,0) size 609x19
88
text run at (0,0) width 609: "Below, there should be 2 orange boxes horizontally centered within their respective green bars."
9-
RenderBlock {DIV} at (16,36) size 752x40 [bgcolor=#008000]
9+
RenderBlock {DIV} at (16,36) size 752x36 [bgcolor=#008000]
1010
RenderBlock (anonymous) at (0,0) size 752x20
1111
RenderText {#text} at (0,0) size 36x19
1212
text run at (0,0) width 36: " "
13-
RenderButton {INPUT} at (364,20) size 24x20 [color=#007AFF] [bgcolor=#FFA500] [border: (1px solid #FFFFFF)]
14-
RenderBlock {FORM} at (0,92) size 784x40
15-
RenderBlock {DIV} at (16,0) size 752x40 [bgcolor=#008000]
13+
RenderButton {INPUT} at (364,20) size 24x16 [color=#007AFF] [bgcolor=#FFA500] [border: (1px solid #FFFFFF)]
14+
RenderBlock {FORM} at (0,88) size 784x36
15+
RenderBlock {DIV} at (16,0) size 752x36 [bgcolor=#008000]
1616
RenderBlock (anonymous) at (0,0) size 752x20
1717
RenderText {#text} at (0,0) size 36x19
1818
text run at (0,0) width 36: " "
19-
RenderButton {INPUT} at (364,20) size 24x20 [color=#FFFFFF] [bgcolor=#FFA500] [border: (1px solid #FFFFFF)]
19+
RenderButton {INPUT} at (364,20) size 24x16 [color=#FFFFFF] [bgcolor=#FFA500] [border: (1px solid #FFFFFF)]

‎LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt‎

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,18 +15,7 @@ PASS .flexbox 13
1515
PASS .flexbox 14
1616
PASS .flexbox 15
1717
PASS .flexbox 16
18-
FAIL .flexbox 17 assert_equals:
19-
<div class="flexbox">
20-
<input data-expected-display="block" data-expected-width="75" type="checkbox" value="radio">
21-
<input data-expected-display="block" data-expected-width="75" type="file" value="file">
22-
<input data-expected-display="block" data-expected-width="75" type="image" value="image">
23-
<input data-expected-display="block" data-expected-width="75" type="password" value="password">
24-
<input data-expected-display="block" data-expected-width="75" type="radio" value="radio">
25-
<input data-expected-display="block" data-expected-width="75" type="reset" value="reset">
26-
<input data-expected-display="block" data-expected-width="75" type="submit" value="submit">
27-
<input data-expected-display="block" data-expected-width="75" type="text" value="text">
28-
</div>
29-
width expected 75 but got 69
18+
PASS .flexbox 17
3019
FAIL .flexbox 18 assert_equals:
3120
<div class="flexbox" style="height:200px">
3221
<button data-expected-display="block" data-expected-width="100" data-expected-height="200">button</button>

‎LayoutTests/platform/ios/fast/forms/button-style-color-expected.txt‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,14 @@ layer at (0,0) size 800x600
3939
text run at (0,0) width 61: "Test Button"
4040
RenderText {#text} at (525,0) size 5x19
4141
text run at (525,0) width 5: " "
42-
RenderButton {INPUT} at (529,1) size 85x20 [color=#007AFF] [bgcolor=#008000] [border: (1px solid #FFFFFF)]
43-
RenderBlock (anonymous) at (12,3) size 61x14
42+
RenderButton {INPUT} at (529,3) size 85x16 [color=#007AFF] [bgcolor=#008000] [border: (1px solid #FFFFFF)]
43+
RenderBlock (anonymous) at (12,1) size 61x14
4444
RenderText at (0,0) size 61x14
4545
text run at (0,0) width 61: "Test Button"
4646
RenderText {#text} at (613,0) size 5x19
4747
text run at (613,0) width 5: " "
48-
RenderButton {INPUT} at (617,1) size 85x20 [color=#FF0000] [bgcolor=#008000] [border: (1px solid #FFFFFF)]
49-
RenderBlock (anonymous) at (12,3) size 61x14
48+
RenderButton {INPUT} at (617,3) size 85x16 [color=#FF0000] [bgcolor=#008000] [border: (1px solid #FFFFFF)]
49+
RenderBlock (anonymous) at (12,1) size 61x14
5050
RenderText at (0,0) size 61x14
5151
text run at (0,0) width 61: "Test Button"
5252
RenderText {#text} at (0,0) size 0x0

‎LayoutTests/platform/mac-bigsur/fast/css/continuationCrash-expected.txt‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,19 +47,19 @@ layer at (0,0) size 800x600
4747
RenderText {#text} at (0,0) size 205x18
4848
text run at (0,0) width 205: "2. 3. will not crash Safari either."
4949
RenderBlock (anonymous) at (40,144) size 744x19
50-
RenderButton {INPUT} at (0,1) size 132x18 [color=#000000D8] [bgcolor=#C0C0C0]
50+
RenderButton {INPUT} at (0,1) size 132x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
5151
RenderBlock (anonymous) at (8,2) size 116x13
5252
RenderText at (0,0) size 116x13
5353
text run at (0,0) width 116: "1. Set outline property"
5454
RenderText {#text} at (132,0) size 4x18
5555
text run at (132,0) width 4: " "
56-
RenderButton {INPUT} at (136,1) size 136x18 [color=#000000D8] [bgcolor=#C0C0C0]
56+
RenderButton {INPUT} at (136,1) size 136x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
5757
RenderBlock (anonymous) at (8,2) size 120x13
5858
RenderText at (0,0) size 120x13
5959
text run at (0,0) width 120: "2. Set display property"
6060
RenderText {#text} at (271,0) size 5x18
6161
text run at (271,0) width 5: " "
62-
RenderButton {INPUT} at (275,1) size 147x18 [color=#000000D8] [bgcolor=#C0C0C0]
62+
RenderButton {INPUT} at (275,1) size 147x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
6363
RenderBlock (anonymous) at (8,2) size 131x13
6464
RenderText at (0,0) size 131x13
6565
text run at (0,0) width 131: "3. Replace span-element"

‎LayoutTests/platform/mac-bigsur/fast/forms/button-sizes-expected.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ layer at (0,0) size 800x600
4545
text run at (0,0) width 61: "Test Button"
4646
RenderText {#text} at (452,1) size 5x18
4747
text run at (452,1) width 5: " "
48-
RenderButton {INPUT} at (456,2) size 77x18 [color=#000000D8] [bgcolor=#C0C0C0]
48+
RenderButton {INPUT} at (456,2) size 77x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
4949
RenderBlock (anonymous) at (8,2) size 61x13
5050
RenderText at (0,0) size 61x13
5151
text run at (0,0) width 61: "Test Button"

‎LayoutTests/platform/mac-bigsur/fast/forms/control-restrict-line-height-expected.txt‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,18 +11,18 @@ layer at (0,0) size 800x600
1111
RenderText at (8,2) size 271x13
1212
text run at (8,2) width 271: "This text should be centered vertically in the button"
1313
RenderBR {BR} at (302,17) size 0x18
14-
RenderButton {INPUT} at (0,36) size 287x18 [color=#000000D8] [bgcolor=#C0C0C0]
15-
RenderBlock (anonymous) at (8,2) size 271x13
16-
RenderText at (0,0) size 271x13
17-
text run at (0,0) width 271: "This text should be centered vertically in the button"
18-
RenderBR {BR} at (286,35) size 1x18
19-
RenderTextControl {INPUT} at (0,54) size 147x19 [bgcolor=#FFFFFF] [border: (2px inset #000000)]
14+
RenderButton {INPUT} at (0,36) size 287x31 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
15+
RenderBlock (anonymous) at (8,2) size 271x26
16+
RenderText at (0,6) size 271x13
17+
text run at (0,6) width 271: "This text should be centered vertically in the button"
18+
RenderBR {BR} at (286,41) size 1x18
19+
RenderTextControl {INPUT} at (0,67) size 147x19 [bgcolor=#FFFFFF] [border: (2px inset #000000)]
2020
RenderFlexibleBox {DIV} at (3,0) size 141x19
2121
RenderBlock {DIV} at (0,0) size 8x19
2222
RenderBlock {DIV} at (8,3) size 114x13
2323
RenderBlock {DIV} at (121,0) size 20x19
2424
RenderText {#text} at (0,0) size 0x0
25-
layer at (19,65) size 114x13 scrollWidth 272
25+
layer at (19,78) size 114x13 scrollWidth 272
2626
RenderBlock {DIV} at (0,0) size 114x13
2727
RenderText {#text} at (0,0) size 271x13
2828
text run at (0,0) width 271: "This text should be centered vertically in the button"

‎LayoutTests/platform/mac-bigsur/tables/mozilla/bugs/bug2479-3-expected.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ layer at (0,0) size 785x765
8585
RenderTextControl {INPUT} at (402,16) size 147x19 [bgcolor=#FFFFFF] [border: (2px inset #000000)]
8686
RenderText {#text} at (548,17) size 17x16
8787
text run at (548,17) width 17: " "
88-
RenderButton {INPUT} at (564,17) size 54x18 [color=#000000D8] [bgcolor=#C0C0C0]
88+
RenderButton {INPUT} at (564,17) size 54x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
8989
RenderBlock (anonymous) at (8,2) size 37x13
9090
RenderText at (0,0) size 37x13
9191
text run at (0,0) width 37: "Submit"

‎LayoutTests/platform/mac-bigsur/tables/mozilla/bugs/bug26178-expected.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ layer at (0,0) size 800x600
1515
RenderText {#text} at (1,1) size 59x18
1616
text run at (1,1) width 59: "First row"
1717
RenderBlock {FORM} at (0,46) size 784x18
18-
RenderButton {INPUT} at (0,0) size 47x18 [color=#000000D8] [bgcolor=#C0C0C0]
18+
RenderButton {INPUT} at (0,0) size 47x18 [color=#000000D8] [bgcolor=#C0C0C0] [border: none (2px outset #C0C0C0) none (2px outset #C0C0C0)]
1919
RenderBlock (anonymous) at (8,2) size 31x13
2020
RenderText at (0,0) size 31x13
2121
text run at (0,0) width 31: "insert"

0 commit comments

Comments
 (0)