- Revision
- 91573
- Author
- [email protected]
- Date
- 2011-07-22 10:46:12 -0700 (Fri, 22 Jul 2011)
Log Message
Validation message bubble is incorrectly positioned in a relative body.
https://bugs.webkit.org/show_bug.cgi?id=65018
Reviewed by Dimitri Glazkov.
Source/WebCore:
We use position:aboslute for validation message bubbles, and the
origin of the absolute position can be not only the page, but also
an ancestor block with non-static position.
Test: fast/forms/validation-message-in-relative-body.html
* html/ValidationMessage.cpp:
(WebCore::adjustBubblePosition):
Subtract the containing block position from the host position.
(WebCore::ValidationMessage::buildBubbleTree):
Change the order of appendChild() and adjustBubblePosition() in
order to use RenderObject::containingBlock() in
adjustbubbleposition().
LayoutTests:
* fast/forms/validation-message-in-relative-body-expected.txt: Added.
* fast/forms/validation-message-in-relative-body.html: Added.
* platform/gtk/Skipped:
* platform/qt/Skipped:
* platform/win/Skipped:
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (91572 => 91573)
--- trunk/LayoutTests/ChangeLog 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/LayoutTests/ChangeLog 2011-07-22 17:46:12 UTC (rev 91573)
@@ -1,3 +1,16 @@
+2011-07-22 Kent Tamura <[email protected]>
+
+ Validation message bubble is incorrectly positioned in a relative body.
+ https://bugs.webkit.org/show_bug.cgi?id=65018
+
+ Reviewed by Dimitri Glazkov.
+
+ * fast/forms/validation-message-in-relative-body-expected.txt: Added.
+ * fast/forms/validation-message-in-relative-body.html: Added.
+ * platform/gtk/Skipped:
+ * platform/qt/Skipped:
+ * platform/win/Skipped:
+
2011-07-22 Andrey Kosyakov <[email protected]>
Web Inspector: [Extensions API] add webInspector.resources.onContentEdited
Added: trunk/LayoutTests/fast/forms/validation-message-in-relative-body-expected.txt (0 => 91573)
--- trunk/LayoutTests/fast/forms/validation-message-in-relative-body-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/forms/validation-message-in-relative-body-expected.txt 2011-07-22 17:46:12 UTC (rev 91573)
@@ -0,0 +1,8 @@
+
+PASS bubbleRect.top is hostRect.bottom
+PASS hostRect.left <= bubbleRect.left && bubbleRect.left <= hostRect.right is true
+
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
Added: trunk/LayoutTests/fast/forms/validation-message-in-relative-body.html (0 => 91573)
--- trunk/LayoutTests/fast/forms/validation-message-in-relative-body.html (rev 0)
+++ trunk/LayoutTests/fast/forms/validation-message-in-relative-body.html 2011-07-22 17:46:12 UTC (rev 91573)
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src=""
+<script src=""
+<style>
+body {
+ position: relative;
+ width: 192px;
+ top: 128px;
+ margin: 10px auto;
+ background-color: #eee;
+ border: 13px solid yellow;
+}
+</style>
+</head>
+<body>
+<form action=""
+<input required id=host>
+<input type=submit id=submit>
+</form>
+
+<div id=console></div>
+<script>
+function check() {
+ hostRect = getAbsoluteRect(host);
+ bubbleRect = getAbsoluteRect(getValidationMessageBubbleNode(host));
+ shouldBe('bubbleRect.top', 'hostRect.bottom');
+ shouldBeTrue('hostRect.left <= bubbleRect.left && bubbleRect.left <= hostRect.right');
+ debug('');
+
+ finishJSTest();
+}
+
+var host = $('host');
+var hostRect;
+var bubbleRect;
+$('submit').click();
+if (window.layoutTestController) {
+ setTimeout(check, 0);
+} else {
+ debug('Submit the form, and check if the validation bubble is on the text field.');
+}
+
+var jsTestIsAsync = true;
+var successfullyParsed = true;
+</script>
+<script src=""
+</body>
+</html>
Modified: trunk/LayoutTests/platform/gtk/Skipped (91572 => 91573)
--- trunk/LayoutTests/platform/gtk/Skipped 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/LayoutTests/platform/gtk/Skipped 2011-07-22 17:46:12 UTC (rev 91573)
@@ -1243,6 +1243,7 @@
# Need to call Settings::setValidationMessageTimerMagnification(-1) in DRT.
fast/forms/validation-message-appearance.html
fast/forms/validation-message-clone.html
+fast/forms/validation-message-in-relative-body.html
fast/forms/validation-message-on-checkbox.html
fast/forms/validation-message-on-listbox.html
fast/forms/validation-message-on-menulist.html
Modified: trunk/LayoutTests/platform/qt/Skipped (91572 => 91573)
--- trunk/LayoutTests/platform/qt/Skipped 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/LayoutTests/platform/qt/Skipped 2011-07-22 17:46:12 UTC (rev 91573)
@@ -2033,6 +2033,7 @@
# Need to call Settings::setValidationMessageTimerMagnification(-1) in DRT.
fast/forms/validation-message-appearance.html
fast/forms/validation-message-clone.html
+fast/forms/validation-message-in-relative-body.html
fast/forms/validation-message-on-checkbox.html
fast/forms/validation-message-on-listbox.html
fast/forms/validation-message-on-menulist.html
Modified: trunk/LayoutTests/platform/win/Skipped (91572 => 91573)
--- trunk/LayoutTests/platform/win/Skipped 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/LayoutTests/platform/win/Skipped 2011-07-22 17:46:12 UTC (rev 91573)
@@ -1124,6 +1124,7 @@
# Need to call Settings::setValidationMessageTimerMagnification(-1) in DRT.
fast/forms/validation-message-appearance.html
fast/forms/validation-message-clone.html
+fast/forms/validation-message-in-relative-body.html
fast/forms/validation-message-on-checkbox.html
fast/forms/validation-message-on-listbox.html
fast/forms/validation-message-on-menulist.html
Modified: trunk/Source/WebCore/ChangeLog (91572 => 91573)
--- trunk/Source/WebCore/ChangeLog 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/Source/WebCore/ChangeLog 2011-07-22 17:46:12 UTC (rev 91573)
@@ -1,3 +1,24 @@
+2011-07-22 Kent Tamura <[email protected]>
+
+ Validation message bubble is incorrectly positioned in a relative body.
+ https://bugs.webkit.org/show_bug.cgi?id=65018
+
+ Reviewed by Dimitri Glazkov.
+
+ We use position:aboslute for validation message bubbles, and the
+ origin of the absolute position can be not only the page, but also
+ an ancestor block with non-static position.
+
+ Test: fast/forms/validation-message-in-relative-body.html
+
+ * html/ValidationMessage.cpp:
+ (WebCore::adjustBubblePosition):
+ Subtract the containing block position from the host position.
+ (WebCore::ValidationMessage::buildBubbleTree):
+ Change the order of appendChild() and adjustBubblePosition() in
+ order to use RenderObject::containingBlock() in
+ adjustbubbleposition().
+
2011-07-22 David Grogan <[email protected]>
Fix crash in IDBRequest::abort
Modified: trunk/Source/WebCore/html/ValidationMessage.cpp (91572 => 91573)
--- trunk/Source/WebCore/html/ValidationMessage.cpp 2011-07-22 17:31:04 UTC (rev 91572)
+++ trunk/Source/WebCore/html/ValidationMessage.cpp 2011-07-22 17:46:12 UTC (rev 91573)
@@ -39,6 +39,7 @@
#include "HTMLDivElement.h"
#include "HTMLNames.h"
#include "Page.h"
+#include "RenderBlock.h"
#include "RenderObject.h"
#include "Settings.h"
#include "ShadowRoot.h"
@@ -110,12 +111,19 @@
ASSERT(bubble);
if (hostRect.isEmpty())
return;
- bubble->getInlineStyleDecl()->setProperty(CSSPropertyTop, static_cast<double>(hostRect.y() + hostRect.height()), CSSPrimitiveValue::CSS_PX);
+ double hostX = hostRect.x();
+ double hostY = hostRect.y();
+ if (RenderBox* container = bubble->renderer()->containingBlock()) {
+ FloatPoint containerLocation = container->localToAbsolute();
+ hostX -= containerLocation.x() + container->borderLeft() + container->paddingLeft();
+ hostY -= containerLocation.y() + container->borderTop() + container->paddingTop();
+ }
+ bubble->getInlineStyleDecl()->setProperty(CSSPropertyTop, hostY + hostRect.height(), CSSPrimitiveValue::CSS_PX);
// The 'left' value of ::-webkit-validation-bubble-arrow.
const int bubbleArrowTopOffset = 32;
- double bubbleX = hostRect.x();
+ double bubbleX = hostX;
if (hostRect.width() / 2 < bubbleArrowTopOffset)
- bubbleX = max(hostRect.x() + hostRect.width() / 2 - bubbleArrowTopOffset, 0);
+ bubbleX = max(hostX + hostRect.width() / 2 - bubbleArrowTopOffset, 0.0);
bubble->getInlineStyleDecl()->setProperty(CSSPropertyLeft, bubbleX, CSSPrimitiveValue::CSS_PX);
}
@@ -130,9 +138,9 @@
// Need to force position:absolute because RenderMenuList doesn't assume it
// contains non-absolute or non-fixed renderers as children.
m_bubble->getInlineStyleDecl()->setProperty(CSSPropertyPosition, CSSValueAbsolute);
- adjustBubblePosition(host->getRect(), m_bubble.get());
host->ensureShadowRoot()->appendChild(m_bubble.get(), ec);
ASSERT(!ec);
+ adjustBubblePosition(host->getRect(), m_bubble.get());
RefPtr<HTMLDivElement> clipper = HTMLDivElement::create(doc);
clipper->setShadowPseudoId("-webkit-validation-bubble-arrow-clipper", ec);