[CherryPick] input element with placeholder text and width set to 100% on focus cause...
authorrobert@webkit.org <robert@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 20 Feb 2013 18:27:03 +0000 (18:27 +0000)
committerGerrit Code Review <gerrit@gerrit.vlan144.tizendev.org>
Fri, 12 Jul 2013 07:00:30 +0000 (07:00 +0000)
[Title] [CherryPick] input element with placeholder text and width set to 100% on focus causes overflow even after losing focus
[Issue] WEB-3608
[Problem] nid.naver.com is not fit in screen when device is rotated from landscape to portrait
[Cause] The placeholder of password input element(with 100% width) was calculated as overflow before being layouted
[Solution] Re-calculating the overflow after the placeholder layout
[Cherry-Picker] KyungTae Kim <ktf.kim@samsung.com>

input element with placeholder text and width set to 100% on focus causes overflow even after losing focus
https://bugs.webkit.org/show_bug.cgi?id=109020

Reviewed by David Hyatt.

Source/WebCore:

Tests: fast/forms/input-placeholder-layout-view.html
       fast/forms/textarea-placeholder-layout-view.html

Placeholder elements don't affect layout so shouldn't contribute overflow either.

* rendering/RenderTextControlSingleLine.cpp:
(WebCore::RenderTextControlSingleLine::layout):

LayoutTests:

* fast/forms/input-placeholder-layout-view-expected.html: Added.
* fast/forms/input-placeholder-layout-view.html: Added.
* fast/forms/textarea-placeholder-layout-view-expected.html: Added.
* fast/forms/textarea-placeholder-layout-view.html: Added.

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

Change-Id: Ide40af34b8590a5894bf94296c160cf96dc5b183

LayoutTests/ChangeLog
LayoutTests/fast/forms/input-placeholder-layout-view-expected.html [new file with mode: 0644]
LayoutTests/fast/forms/input-placeholder-layout-view.html [new file with mode: 0644]
LayoutTests/fast/forms/textarea-placeholder-layout-view-expected.html [new file with mode: 0644]
LayoutTests/fast/forms/textarea-placeholder-layout-view.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/rendering/RenderTextControlSingleLine.cpp

index 492b02b..282ec9b 100644 (file)
@@ -1,3 +1,15 @@
+2013-02-20  Robert Hogan  <robert@webkit.org>
+
+        input element with placeholder text and width set to 100% on focus causes overflow even after losing focus
+        https://bugs.webkit.org/show_bug.cgi?id=109020
+
+        Reviewed by David Hyatt.
+
+        * fast/forms/input-placeholder-layout-view-expected.html: Added.
+        * fast/forms/input-placeholder-layout-view.html: Added.
+        * fast/forms/textarea-placeholder-layout-view-expected.html: Added.
+        * fast/forms/textarea-placeholder-layout-view.html: Added.
+
 2012-08-21  Mark Hahnenberg  <mhahnenberg@apple.com>
 
         WTF Threading leaks kernel objects on platforms that use pthreads
diff --git a/LayoutTests/fast/forms/input-placeholder-layout-view-expected.html b/LayoutTests/fast/forms/input-placeholder-layout-view-expected.html
new file mode 100644 (file)
index 0000000..b3dd110
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<style>
+body {
+  margin: 0;
+  padding: 0;
+}
+</style>
+<p> https://bugs.webkit.org/show_bug.cgi?id=109020: An input element that grows to 100% width will create scrollbars, and these should go away when it loses focus. </p>
+<input id="input" placeholder="placeholder">
+<input id="input2">
+<script>
+    document.getElementById('input2').focus();
+</script>
diff --git a/LayoutTests/fast/forms/input-placeholder-layout-view.html b/LayoutTests/fast/forms/input-placeholder-layout-view.html
new file mode 100644 (file)
index 0000000..95f9a50
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<head>
+<style>
+body {
+  margin: 0;
+  padding: 0;
+}
+#input:focus {
+  width: 100%;
+}
+</style>
+</head>
+<body id="body">
+<p> https://bugs.webkit.org/show_bug.cgi?id=109020: An input element that grows to 100% width will create scrollbars, and these should go away when it loses focus. </p>
+<input id="input" placeholder="placeholder">
+<input id="input2">
+<script>
+    document.getElementById('input').focus();
+    document.getElementById('input2').focus();
+</script>
+</body>
diff --git a/LayoutTests/fast/forms/textarea-placeholder-layout-view-expected.html b/LayoutTests/fast/forms/textarea-placeholder-layout-view-expected.html
new file mode 100644 (file)
index 0000000..43d4010
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<style>
+body {
+  margin: 0;
+  padding: 0;
+}
+</style>
+<p> https://bugs.webkit.org/show_bug.cgi?id=109020: An input element that grows to 100% width will create scrollbars, and these should go away when it loses focus. </p>
+<textarea id="input" placeholder="placeholder"></textarea>
+<textarea id="input2"></textarea>
+<script>
+    document.getElementById('input2').focus();
+</script>
diff --git a/LayoutTests/fast/forms/textarea-placeholder-layout-view.html b/LayoutTests/fast/forms/textarea-placeholder-layout-view.html
new file mode 100644 (file)
index 0000000..79d9b96
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<head>
+<style>
+body {
+  margin: 0;
+  padding: 0;
+}
+#input:focus {
+  width: 100%;
+}
+</style>
+</head>
+<body id="body">
+<p> https://bugs.webkit.org/show_bug.cgi?id=109020: An input element that grows to 100% width will create scrollbars, and these should go away when it loses focus. </p>
+<textarea id="input" placeholder="placeholder"></textarea>
+<textarea id="input2"></textarea>
+<script>
+    document.getElementById('input').focus();
+    document.getElementById('input2').focus();
+</script>
+</body>
index 6f17c1b..1ed7e48 100644 (file)
@@ -1,3 +1,18 @@
+2013-02-20  Robert Hogan  <robert@webkit.org>
+
+        input element with placeholder text and width set to 100% on focus causes overflow even after losing focus
+        https://bugs.webkit.org/show_bug.cgi?id=109020
+
+        Reviewed by David Hyatt.
+
+        Tests: fast/forms/input-placeholder-layout-view.html
+               fast/forms/textarea-placeholder-layout-view.html
+
+        Placeholder elements don't affect layout so shouldn't contribute overflow either.
+
+        * rendering/RenderTextControlSingleLine.cpp:
+        (WebCore::RenderTextControlSingleLine::layout):
+
 2013-02-04 Nayan Kumar K <nayankk@motorola.com>
 
         [WEBGL] Rename WEBKIT_WEBGL_compressed_texture_s3tc to WEBGL_compressed_texture_s3tc
index 4f3d3ab..4c69d15 100644 (file)
@@ -192,6 +192,7 @@ void RenderTextControlSingleLine::layout()
     if (RenderBox* placeholderBox = placeholderElement ? placeholderElement->renderBox() : 0) {
         placeholderBox->style()->setWidth(Length(innerTextRenderer->width() - placeholderBox->borderAndPaddingWidth(), Fixed));
         placeholderBox->style()->setHeight(Length(innerTextRenderer->height() - placeholderBox->borderAndPaddingHeight(), Fixed));
+        bool neededLayout = placeholderBox->needsLayout();
         bool placeholderBoxHadLayout = placeholderBox->everHadLayout();
         placeholderBox->layoutIfNeeded();
         LayoutPoint textOffset = innerTextRenderer->location();
@@ -206,6 +207,12 @@ void RenderTextControlSingleLine::layout()
             // logic should be shared with RenderBlock::layoutBlockChild.
             placeholderBox->repaint();
         }
+        // The placeholder gets layout last, after the parent text control and its other children,
+        // so in order to get the correct overflow from the placeholder we need to recompute it now.
+        if (neededLayout) {
+            m_overflow.clear();
+            computeOverflow(clientLogicalBottom());
+        }
     }
 }