File upload control doesn't apply CSS vertical padding or border to file name
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 20 Feb 2013 08:10:10 +0000 (08:10 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 20 Feb 2013 08:10:10 +0000 (08:10 +0000)
https://bugs.webkit.org/show_bug.cgi?id=109011

Patch by Nils Barth <nbarth@google.com> on 2013-02-20
Reviewed by Hajime Morrita.

Source/WebCore:

Test: fast/forms/file/file-vertical-padding-border.html

* rendering/RenderFileUploadControl.cpp:
    Add borderTop() and paddingTop() when computing position.
(WebCore::RenderFileUploadControl::paintObject):

LayoutTests:

* fast/forms/file/file-vertical-padding-border.html: Added.
* fast/forms/file/file-vertical-padding-border-expected.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@143434 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/forms/file/file-vertical-padding-border-expected.html [new file with mode: 0644]
LayoutTests/fast/forms/file/file-vertical-padding-border.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/rendering/RenderFileUploadControl.cpp

index ba4e8f376eb9477cbbe205ceee8df46aad7d3217..58cea1fd8fe12c9173b0b392bfc55ce7c21bb93f 100644 (file)
@@ -1,3 +1,13 @@
+2013-02-20  Nils Barth  <nbarth@google.com>
+
+        File upload control doesn't apply CSS vertical padding or border to file name
+        https://bugs.webkit.org/show_bug.cgi?id=109011
+
+        Reviewed by Hajime Morrita.
+
+        * fast/forms/file/file-vertical-padding-border.html: Added.
+        * fast/forms/file/file-vertical-padding-border-expected.html: Added.
+
 2013-02-19  KwangYong Choi  <ky0.choi@samsung.com>
 
         [EFL] Mark fast/regions/seamless-iframe-flowed-into-regions.html failure
diff --git a/LayoutTests/fast/forms/file/file-vertical-padding-border-expected.html b/LayoutTests/fast/forms/file/file-vertical-padding-border-expected.html
new file mode 100644 (file)
index 0000000..7f50ab5
--- /dev/null
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>File input alignment with CSS padding and border</title>
+<style type="text/css">
+    span, input {
+        display: inline-block;
+        vertical-align: top;
+        margin: 0px;
+    }
+    .pad-all { padding: 10px; }
+    .pad-top { padding-top: 10px; }
+    .bor-all { border: 10px solid DarkGray; }
+    .bor-top { border-top: 10px solid DarkGray; }
+</style>
+</head>
+<body>
+<p>Bug <a href="http://webkit.org/b/109011">109011</a>: File upload control doesn't apply CSS vertical padding or border to file name</p>
+<p>For this test to pass, the file name (or "No file chosen") should line up with the button text below, with CSS padding and borders overall or on the top, and in combinations thereof.</p>
+<span class="pad-all"><input type="file"/></span>
+<span class="pad-top"><input type="file"/></span>
+<br/>
+<span class="bor-all"><input type="file"/></span>
+<span class="bor-top"><input type="file"/></span>
+<br/>
+<span class="pad-all bor-all"><input type="file"/></span>
+<span class="pad-all bor-top"><input type="file"/></span>
+<br/>
+<span class="pad-top bor-all"><input type="file"/></span>
+<span class="pad-top bor-top"><input type="file"/></span>
+</body>
+</html>
diff --git a/LayoutTests/fast/forms/file/file-vertical-padding-border.html b/LayoutTests/fast/forms/file/file-vertical-padding-border.html
new file mode 100644 (file)
index 0000000..d51cff9
--- /dev/null
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>File input alignment with CSS padding and border</title>
+<style type="text/css">
+    span, input {
+        display: inline-block;
+        vertical-align: top;
+        margin: 0px;
+    }
+    .pad-all { padding: 10px; }
+    .pad-top { padding-top: 10px; }
+    .bor-all { border: 10px solid DarkGray; }
+    .bor-top { border-top: 10px solid DarkGray; }
+</style>
+</head>
+<body>
+<p>Bug <a href="http://webkit.org/b/109011">109011</a>: File upload control doesn't apply CSS vertical padding or border to file name</p>
+<p>For this test to pass, the file name (or "No file chosen") should line up with the button text below, with CSS padding and borders overall or on the top, and in combinations thereof.</p>
+<span><input type="file" class="pad-all"/></span>
+<span><input type="file" class="pad-top"/></span>
+<br/>
+<span><input type="file" class="bor-all"/></span>
+<span><input type="file" class="bor-top"/></span>
+<br/>
+<span><input type="file" class="pad-all bor-all"/></span>
+<span><input type="file" class="pad-all bor-top"/></span>
+<br/>
+<span><input type="file" class="pad-top bor-all"/></span>
+<span><input type="file" class="pad-top bor-top"/></span>
+</body>
+</html>
index ccf27e8f3d693fcf957c327bf01dd546bafcada8..be483a07cfc1b0666734d9182936e018831fa642 100644 (file)
@@ -1,3 +1,16 @@
+2013-02-20  Nils Barth  <nbarth@google.com>
+
+        File upload control doesn't apply CSS vertical padding or border to file name
+        https://bugs.webkit.org/show_bug.cgi?id=109011
+
+        Reviewed by Hajime Morrita.
+
+        Test: fast/forms/file/file-vertical-padding-border.html
+
+        * rendering/RenderFileUploadControl.cpp:
+            Add borderTop() and paddingTop() when computing position.
+        (WebCore::RenderFileUploadControl::paintObject):
+
 2013-02-19  Andrey Adaikin  <aandrey@chromium.org>
 
         Few methods in WebGLRenderingContext.idl have incorrect signatures
index eb4542f4dd13871a2542547a4ab2ea8696a66315..437ced3d7d14b6ff4883bb7175a4fa0b7c732a42 100644 (file)
@@ -141,7 +141,7 @@ void RenderFileUploadControl::paintObject(PaintInfo& paintInfo, const LayoutPoin
         // We want to match the button's baseline
         // FIXME: Make this work with transforms.
         if (RenderButton* buttonRenderer = toRenderButton(button->renderer()))
-            textY = paintOffset.y() + buttonRenderer->baselinePosition(AlphabeticBaseline, true, HorizontalLine, PositionOnContainingLine);
+            textY = paintOffset.y() + borderTop() + paddingTop() + buttonRenderer->baselinePosition(AlphabeticBaseline, true, HorizontalLine, PositionOnContainingLine);
         else
             textY = baselinePosition(AlphabeticBaseline, true, HorizontalLine, PositionOnContainingLine);