Reviewed by David Hyatt.
authorrobert@webkit.org <robert@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 27 Sep 2011 19:31:31 +0000 (19:31 +0000)
committerrobert@webkit.org <robert@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 27 Sep 2011 19:31:31 +0000 (19:31 +0000)
Replaced elements squeezed when width is specified as percentage inside a table with Auto layout
https://bugs.webkit.org/show_bug.cgi?id=29447

Source/WebCore:

If inserting a 'replaced' element (e.g. image, plugin) in a table cell that is not descendant from
a block with fixed layout then do not squeeze the element, let it use its intrinsic width and height.

Test: fast/replaced/table-percent-width.html

* rendering/RenderBox.cpp:
(WebCore::avoidSqueezingWidth):
(WebCore::avoidSqueezingHeight):
(WebCore::RenderBox::containingBlockReplacedLogicalWidthForContent):
(WebCore::RenderBox::computeReplacedLogicalWidthUsing):
(WebCore::RenderBox::computeReplacedLogicalHeightUsing):
* rendering/RenderBox.h:

LayoutTests:

* fast/replaced/table-percent-width.html: Added.
* fast/replaced/table-percent-width-expected.txt: Added.

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

LayoutTests/ChangeLog
LayoutTests/fast/replaced/table-percent-width-expected.txt [new file with mode: 0644]
LayoutTests/fast/replaced/table-percent-width.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/rendering/RenderBox.cpp
Source/WebCore/rendering/RenderBox.h

index 9eb5e16..fac35f5 100644 (file)
@@ -1,3 +1,13 @@
+2011-06-28  Robert Hogan  <robert@webkit.org>
+
+        Reviewed by David Hyatt.
+
+        Replaced elements squeezed when width is specified as percentage inside a table with Auto layout
+        https://bugs.webkit.org/show_bug.cgi?id=29447
+
+        * fast/replaced/table-percent-width.html: Added.
+        * fast/replaced/table-percent-width-expected.txt: Added.
+
 2011-09-27  Simon Fraser  <simon.fraser@apple.com>
 
         https://bugs.webkit.org/show_bug.cgi?id=67858
diff --git a/LayoutTests/fast/replaced/table-percent-width-expected.txt b/LayoutTests/fast/replaced/table-percent-width-expected.txt
new file mode 100644 (file)
index 0000000..e7f27fa
--- /dev/null
@@ -0,0 +1,25 @@
+
+
+
+
+
+This test checks that a replaced element with percentage width (and no height specified) within a table cell is squeezed to the dimensions of the table cell.
+See bug #29447.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS getWidth('img-1') is '105px'
+PASS getHeight('img-1') is '105px'
+PASS getWidth('img-2') is '98px'
+PASS getHeight('img-2') is '98px'
+PASS getWidth('img-3') is '40px'
+PASS getHeight('img-3') is '40px'
+PASS getWidth('img-4') is '36px'
+PASS getHeight('img-4') is '36px'
+PASS getWidth('img-5') is '40px'
+PASS getHeight('img-5') is '36px'
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/fast/replaced/table-percent-width.html b/LayoutTests/fast/replaced/table-percent-width.html
new file mode 100644 (file)
index 0000000..7f6df9b
--- /dev/null
@@ -0,0 +1,115 @@
+<html>
+<head>
+<title> webkit.org/b/29447: Replaced elements squeezed when width is specified as percentage inside a table with Auto layout</title>
+<link rel="stylesheet" href="../js/resources/js-test-style.css">
+<script src="../js/resources/js-test-pre.js"></script>
+<script src="../js/resources/js-test-post-function.js"></script>
+<script>
+if (window.layoutTestController) {
+    layoutTestController.waitUntilDone();
+    layoutTestController.dumpAsText();
+}
+
+function getComputedStyleForElement(element, cssPropertyName)
+{
+    if (!element) {
+        return null;
+    }
+    if (window.getComputedStyle) {
+        return window.getComputedStyle(element, '').getPropertyValue(cssPropertyName.replace(/([A-Z])/g, "-$1").toLowerCase());
+    }
+    if (element.currentStyle) {
+        return element.currentStyle[cssPropertyName];
+    }
+    return null;
+}
+
+function getWidth(id)
+{
+    return getComputedStyleForElement(document.getElementById(id), 'width');
+}
+
+function getHeight(id)
+{
+    return getComputedStyleForElement(document.getElementById(id), 'height');
+}
+
+function parsePixelValue(str)
+{
+    if (typeof str != "string" || str.length < 3 || str.substr(str.length - 2) != "px") {
+        testFailed(str + " is unparsable.");
+        return -1;
+    }
+    return parseFloat(str);
+}
+
+function test()
+{
+    description("This test checks that a replaced element with percentage width (and no height specified) within a table cell is squeezed to the dimensions of the table cell.<br>See bug #29447.");
+
+    shouldBe("getWidth('img-1')", "'105px'");
+    shouldBe("getHeight('img-1')", "'105px'");
+    shouldBe("getWidth('img-2')", "'98px'");
+    shouldBe("getHeight('img-2')", "'98px'");
+    shouldBe("getWidth('img-3')", "'40px'");
+    shouldBe("getHeight('img-3')", "'40px'");
+    shouldBe("getWidth('img-4')", "'36px'");
+    shouldBe("getHeight('img-4')", "'36px'");
+    shouldBe("getWidth('img-5')", "'40px'");
+    shouldBe("getHeight('img-5')", "'36px'");
+
+    isSuccessfullyParsed();
+
+    if (window.layoutTestController) {
+        layoutTestController.notifyDone();
+    }
+}
+
+var successfullyParsed = true;
+</script>
+</head>
+<body onload="test()">
+   <table>
+    <tr>
+    <td>
+      <img id="img-1" src="resources/square-blue-100x100.png" width="100%" align="LEFT" border="1">
+    </td>
+    </tr>
+   </table>
+
+   <table>
+    <tr>
+    <td>
+      <img id="img-2" src="resources/square-blue-100x100.png" height="100%" align="LEFT" border="1">
+    </td>
+    </tr>
+   </table>
+
+   <table height="50" width="50" border="1">
+    <tr>
+    <td>
+      <img id="img-3" src="resources/square-blue-100x100.png" width="100%" align="LEFT" border="1">
+    </td>
+    </tr>
+   </table>
+
+   <table height="50" width="50" border="1">
+    <tr>
+    <td>
+      <img id="img-4" src="resources/square-blue-100x100.png" height="100%" align="LEFT" border="1">
+    </td>
+    </tr>
+   </table>
+
+   <table height="50" width="50" border="1">
+    <tr>
+    <td>
+      <img id="img-5" src="resources/square-blue-100x100.png" width="100%" height="100%" align="LEFT" border="1">
+    </td>
+    </tr>
+   </table>
+
+<p id="description"></p>
+<div id="console"></div>
+</body>
+</html>
index ca5d048..42041d0 100644 (file)
@@ -1,3 +1,23 @@
+2011-06-28  Robert Hogan  <robert@webkit.org>
+
+        Reviewed by David Hyatt.
+
+        Replaced elements squeezed when width is specified as percentage inside a table with Auto layout
+        https://bugs.webkit.org/show_bug.cgi?id=29447
+
+        If inserting a 'replaced' element (e.g. image, plugin) in a table cell that is not descendant from
+        a block with fixed layout then do not squeeze the element, let it use its intrinsic width and height.
+
+        Test: fast/replaced/table-percent-width.html
+
+        * rendering/RenderBox.cpp:
+        (WebCore::avoidSqueezingWidth):
+        (WebCore::avoidSqueezingHeight):
+        (WebCore::RenderBox::containingBlockReplacedLogicalWidthForContent):
+        (WebCore::RenderBox::computeReplacedLogicalWidthUsing):
+        (WebCore::RenderBox::computeReplacedLogicalHeightUsing):
+        * rendering/RenderBox.h:
+
 2011-09-27  Simon Fraser  <simon.fraser@apple.com>
 
         https://bugs.webkit.org/show_bug.cgi?id=67858
index b1f0f9a..bc138f0 100644 (file)
@@ -1216,6 +1216,37 @@ LayoutRect RenderBox::clipRect(const LayoutPoint& location)
     return clipRect;
 }
 
+static bool avoidSqueezingWidth(RenderBlock* cb)
+{
+    while (cb && !cb->isRenderView()) {
+        if (!cb->style()->logicalWidth().isAuto() && !cb->style()->logicalWidth().isPercent())
+            return false;
+        cb = cb->containingBlock();
+    }
+    return true;
+}
+
+static bool avoidSqueezingHeight(RenderBlock* cb)
+{
+    while (cb && !cb->isRenderView()) {
+        if (!cb->style()->logicalHeight().isAuto() && !cb->style()->logicalHeight().isPercent())
+            return false;
+        cb = cb->containingBlock();
+    }
+    return true;
+}
+
+int RenderBox::containingBlockReplacedLogicalWidthForContent() const
+{
+    RenderBlock* cb = containingBlock();
+    // Don't let table cells squeeze percent-height replaced elements
+    // <http://bugs.webkit.org/show_bug.cgi?id=29447>
+    if (cb->isTableCell() && avoidSqueezingWidth(cb))
+        return max(shrinkToAvoidFloats() ? cb->availableLogicalWidthForLine(y(), false) : cb->availableLogicalWidth(), intrinsicLogicalWidth());
+
+    return containingBlockLogicalWidthForContent();
+}
+
 LayoutUnit RenderBox::containingBlockLogicalWidthForContent() const
 {
     RenderBlock* cb = containingBlock();
@@ -2014,7 +2045,7 @@ LayoutUnit RenderBox::computeReplacedLogicalWidthUsing(Length logicalWidth) cons
             // FIXME: containingBlockLogicalWidthForContent() is wrong if the replaced element's block-flow is perpendicular to the
             // containing block's block-flow.
             // https://bugs.webkit.org/show_bug.cgi?id=46496
-            const LayoutUnit cw = isPositioned() ? containingBlockLogicalWidthForPositioned(toRenderBoxModelObject(container())) : containingBlockLogicalWidthForContent();
+            const LayoutUnit cw = isPositioned() ? containingBlockLogicalWidthForPositioned(toRenderBoxModelObject(container())) : containingBlockReplacedLogicalWidthForContent();
             if (cw > 0)
                 return computeContentBoxLogicalWidth(logicalWidth.calcMinValue(cw));
         }
@@ -2074,14 +2105,11 @@ LayoutUnit RenderBox::computeReplacedLogicalHeightUsing(Length logicalHeight) co
                 // table cells using percentage heights.
                 // FIXME: This needs to be made block-flow-aware.  If the cell and image are perpendicular block-flows, this isn't right.
                 // https://bugs.webkit.org/show_bug.cgi?id=46997
-                while (cb && !cb->isRenderView() && (cb->style()->logicalHeight().isAuto() || cb->style()->logicalHeight().isPercent())) {
-                    if (cb->isTableCell()) {
-                        // Don't let table cells squeeze percent-height replaced elements
-                        // <http://bugs.webkit.org/show_bug.cgi?id=15359>
-                        availableHeight = max(availableHeight, intrinsicLogicalHeight());
-                        return logicalHeight.calcValue(availableHeight - borderAndPaddingLogicalHeight());
-                    }
-                    cb = cb->containingBlock();
+                if (cb->isTableCell() && avoidSqueezingHeight(toRenderBlock(cb))) {
+                    // Don't let table cells squeeze percent-height replaced elements
+                    // <http://bugs.webkit.org/show_bug.cgi?id=15359>
+                    availableHeight = max(availableHeight, intrinsicLogicalHeight());
+                    return logicalHeight.calcValue(availableHeight - borderAndPaddingLogicalHeight());
                 }
             }
             return computeContentBoxLogicalHeight(logicalHeight.calcValue(availableHeight));
index f01d021..8a40ed6 100644 (file)
@@ -285,6 +285,7 @@ public:
 
     virtual LayoutUnit containingBlockLogicalWidthForContent() const;
     LayoutUnit perpendicularContainingBlockLogicalHeight() const;
+    int containingBlockReplacedLogicalWidthForContent() const;
     
     virtual void computeLogicalWidth();
     virtual void computeLogicalHeight();