<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[164363] trunk</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/164363">164363</a></dd>
<dt>Author</dt> <dd>bjonesbe@adobe.com</dd>
<dt>Date</dt> <dd>2014-02-19 07:20:01 -0800 (Wed, 19 Feb 2014)</dd>
</dl>

<h3>Log Message</h3>
<pre>[CSS Shapes] shape-outside does not properly handle different writing modes
https://bugs.webkit.org/show_bug.cgi?id=128631

Reviewed by David Hyatt.

Source/WebCore:

Fix ShapeOutsideInfo to properly convert the line coordinates and
shape coordinates with respect to the writing mode and writing
direction for the lines that are affected by the shape. This is
notably different from shape inside in that shape outside needs to use
the writing mode of the container, not of the element that the shape
is applied to.

Tests: fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html
       fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html

* rendering/RenderBoxModelObject.h:
(WebCore::RenderBoxModelObject::borderWidth): Used by
    ShapeInfo::setReferenceBoxLogicalSize.
(WebCore::RenderBoxModelObject::borderHeight): Ditto.
* rendering/shapes/ShapeInfo.cpp:
(WebCore::ShapeInfo&lt;RenderType&gt;::setReferenceBoxLogicalSize): Use the
    container's writing mode to determine the logical dimensions in
    the case of shape outside.
(WebCore::ShapeInfo&lt;RenderType&gt;::computedShape): Use the new
    ShapeInfo::styleForWritingMode method.
(WebCore::borderBeforeInWritingMode): Determines the borderBefore for
    the passed in renderer using the writing mode passed in. The
    borderBefore method on the renderer is implemented in RenderStyle,
    unlike with the margin methods, so this was chosen instead of
    attempting to move the border method implementation into a place
    where it could take the writing mode as an argument.
(WebCore::borderAndPaddingBeforeInWritingMode): Determines the
    borderAndPaddingBefore for the passed in renderer using the
    given writihg mode. See above for why this method instead of doing
    it like margins.
(WebCore::borderStartWithStyleForWritingMode): Determines the
    borderStart for the passed in renderer using the writing mode and
    direction from the style passed in. See above for why this method
    instead of doing it like margins.
(WebCore::borderAndPaddingStartWithStyleForWritingMode): Determines
    the borderAndPaddingStart for the passed in renderer using the
    writing mode and direction from the style passed in. See above for
    why this method instead of doing it like margins.
(WebCore::ShapeInfo&lt;RenderType&gt;::logicalTopOffset): Use the
    container's writing mode to determine the logicalTopOffset in the
    case of shape outside.
(WebCore::ShapeInfo&lt;RenderType&gt;::logicalLeftOffset): Use the
    container's writing mode to determine the logicalTopOffset in the
    case of shape outside.
* rendering/shapes/ShapeInfo.h:
* rendering/shapes/ShapeInsideInfo.cpp:
(WebCore::ShapeInsideInfo::styleForWritingMode): Return the entire
    style because to determine start/end the writing direction is
    needed in addtion to the writing mode.
* rendering/shapes/ShapeInsideInfo.h:
* rendering/shapes/ShapeOutsideInfo.cpp:
(WebCore::ShapeOutsideInfo::updateDeltasForContainingBlockLine):
    Properly convert the containing block line into the reference box
    coordinates of the shape.
(WebCore::ShapeOutsideInfo::styleForWritingMode): Return the entire
    style because to determine start/end the writing direction is
    needed in addtion to the writing mode.
* rendering/shapes/ShapeOutsideInfo.h:

LayoutTests:

Tests for floats with shape-outside where the float writing mode or
writing direction are difference from that of the container.

* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html: Added.
* fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html: Added.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderBoxModelObjecth">trunk/Source/WebCore/rendering/RenderBoxModelObject.h</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeInfocpp">trunk/Source/WebCore/rendering/shapes/ShapeInfo.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeInfoh">trunk/Source/WebCore/rendering/shapes/ShapeInfo.h</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeInsideInfocpp">trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeInsideInfoh">trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.h</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeOutsideInfocpp">trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingshapesShapeOutsideInfoh">trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.h</a></li>
</ul>

<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionborderboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionborderboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectioncontentboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectioncontentboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionmarginboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionmarginboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionpaddingboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionpaddingboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesborderboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesborderboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodescontentboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodescontentboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesmarginboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesmarginboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodespaddingboxexpectedhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodespaddingboxhtml">trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/LayoutTests/ChangeLog        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -1,3 +1,30 @@
</span><ins>+2014-02-19  Bem Jones-Bey  &lt;bjonesbe@adobe.com&gt;
+
+        [CSS Shapes] shape-outside does not properly handle different writing modes
+        https://bugs.webkit.org/show_bug.cgi?id=128631
+
+        Reviewed by David Hyatt.
+
+        Tests for floats with shape-outside where the float writing mode or
+        writing direction are difference from that of the container.
+
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html: Added.
+        * fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html: Added.
+
</ins><span class="cx"> 2014-02-18  Brent Fulgham  &lt;bfulgham@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         Windows gardening: Add annotations for Debug case.
</span></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionborderboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        &lt;div style=&quot;margin-right: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div style=&quot;margin-left: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionborderboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+    .float {
+        direction: rtl;
+        -webkit-shape-outside: border-box;
+        height: 20px;
+        width: 20px;
+        border-style: solid;
+        border-color: blue;
+        background-color: blue;
+    }
+    .left {
+        float: left;
+        margin: 0px 20px 0px 0px;
+        border-width: 0px 20px 0px 0px;
+        padding: 0px 20px 0px 0px;
+    }
+    .right {
+        float: right;
+        margin: 0px 0px 0px 20px;
+        border-width: 0px 0px 0px 20px;
+        padding: 0px 0px 0px 20px;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float left&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float right&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectioncontentboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div style=&quot;margin-left: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        &lt;div style=&quot;margin-right: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectioncontentboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+    .float {
+        direction: rtl;
+        -webkit-shape-outside: content-box;
+        height: 20px;
+        width: 20px;
+        border-style: solid;
+        border-color: blue;
+        background-color: blue;
+    }
+    .left {
+        float: left;
+        margin: 0px 20px 0px 0px;
+        border-width: 0px 20px 0px 0px;
+        padding: 0px 20px 0px 0px;
+    }
+    .right {
+        float: right;
+        margin: 0px 0px 0px 20px;
+        border-width: 0px 0px 0px 20px;
+        padding: 0px 0px 0px 20px;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float left&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float right&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionmarginboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionmarginboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+    .float {
+        direction: rtl;
+        -webkit-shape-outside: margin-box;
+        height: 20px;
+        width: 20px;
+        border-style: solid;
+        border-color: blue;
+        background-color: blue;
+    }
+    .left {
+        float: left;
+        margin: 0px 20px 0px 0px;
+        border-width: 0px 20px 0px 0px;
+        padding: 0px 20px 0px 0px;
+    }
+    .right {
+        float: right;
+        margin: 0px 0px 0px 20px;
+        border-width: 0px 0px 0px 20px;
+        padding: 0px 0px 0px 20px;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float left&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float right&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionpaddingboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square in the center of a blue rectangle.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: center;&quot;&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square in the center of a blue rectangle.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: center;&quot;&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingdirectionpaddingboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing direction in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+    .float {
+        direction: rtl;
+        -webkit-shape-outside: padding-box;
+        height: 20px;
+        width: 20px;
+        border-style: solid;
+        border-color: blue;
+        background-color: blue;
+    }
+    .left {
+        float: left;
+        margin: 0px 20px 0px 0px;
+        border-width: 0px 20px 0px 0px;
+        padding: 0px 20px 0px 0px;
+    }
+    .right {
+        float: right;
+        margin: 0px 0px 0px 20px;
+        border-width: 0px 0px 0px 20px;
+        padding: 0px 0px 0px 20px;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square in the center of a blue rectangle.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float left&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square in the center of a blue rectangle.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float right&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesborderboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,23 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 120px;
+        height: 20px;
+        background-color: blue;
+        margin-left: 20px;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesborderboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,35 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 160px;
+        height: 20px;
+    }
+    .float {
+        -webkit-writing-mode: vertical-lr;
+        -webkit-shape-outside: border-box;
+        height: 20px;
+        width: 20px;
+        margin: 0px 20px;
+        border-width: 0px 20px;
+        border-style: solid;
+        border-color: blue;
+        padding: 0px 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: left;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: right;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodescontentboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right; margin-left: 20px;&quot;&gt;
+        &lt;div style=&quot;margin-right: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;margin-left: 40px;&quot;&gt;
+        &lt;div style=&quot;margin-left: 20px&quot;&gt;X&lt;/div&gt;
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodescontentboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,35 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 160px;
+        height: 20px;
+    }
+    .float {
+        -webkit-writing-mode: vertical-lr;
+        -webkit-shape-outside: content-box;
+        height: 20px;
+        width: 20px;
+        margin: 0px 20px;
+        border-width: 0px 20px;
+        border-style: solid;
+        border-color: blue;
+        padding: 0px 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be a blue square to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: left;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be a blue square to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: right;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesmarginboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 160px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodesmarginboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,36 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 160px;
+        height: 20px;
+        background-color: blue;
+    }
+    .float {
+        -webkit-writing-mode: vertical-lr;
+        -webkit-shape-outside: margin-box;
+        height: 20px;
+        width: 20px;
+        margin: 0px 20px;
+        border-width: 0px 20px;
+        border-style: solid;
+        border-color: blue;
+        padding: 0px 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: left;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right;&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: right;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodespaddingboxexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box-expected.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,22 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 100px;
+        height: 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right; margin-left: 20px;&quot;&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;margin-left: 40px;&quot;&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshapesshapeoutsidefloatsshapeoutsidefloatsdifferentwritingmodespaddingboxhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html (0 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html                                (rev 0)
+++ trunk/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -0,0 +1,35 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;title&gt;shape-outside on floats with a different writing mode in the float and the container&lt;/title&gt;
+&lt;style&gt;
+    .container {
+        font: 20px/1 Ahem;
+        color: orange;
+        width: 160px;
+        height: 20px;
+    }
+    .float {
+        -webkit-writing-mode: vertical-lr;
+        -webkit-shape-outside: padding-box;
+        height: 20px;
+        width: 20px;
+        margin: 0px 20px;
+        border-width: 0px 20px;
+        border-style: solid;
+        border-color: blue;
+        padding: 0px 20px;
+        background-color: blue;
+    }
+&lt;/style&gt;
+&lt;body&gt;
+    &lt;p&gt;&lt;a href=&quot;https://bugs.webkit.org/show_bug.cgi?id=122243&quot;&gt;Bug 128631&lt;/a&gt; - [CSS Shapes] shape-outside does not properly handle different writing modes&lt;/p&gt;
+    &lt;p&gt;You should see an orange square touching the right side of a blue rectangle. There should be no blue to the right of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: left;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+    &lt;p&gt;You should see an orange square touching the left side of a blue rectangle. There should be no blue to the left of the orange square.&lt;/p&gt;
+    &lt;div class=&quot;container&quot; style=&quot;text-align: right&quot;&gt;
+        &lt;div class=&quot;float&quot; style=&quot;float: right;&quot;&gt;&lt;/div&gt;
+        X
+    &lt;/div&gt;
+&lt;/body&gt;
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/ChangeLog        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -1,3 +1,75 @@
</span><ins>+2014-02-19  Bem Jones-Bey  &lt;bjonesbe@adobe.com&gt;
+
+        [CSS Shapes] shape-outside does not properly handle different writing modes
+        https://bugs.webkit.org/show_bug.cgi?id=128631
+
+        Reviewed by David Hyatt.
+
+        Fix ShapeOutsideInfo to properly convert the line coordinates and
+        shape coordinates with respect to the writing mode and writing
+        direction for the lines that are affected by the shape. This is
+        notably different from shape inside in that shape outside needs to use
+        the writing mode of the container, not of the element that the shape
+        is applied to.
+
+        Tests: fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-border-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-content-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-margin-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-direction-padding-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-border-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-content-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-margin-box.html
+               fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes-padding-box.html
+
+        * rendering/RenderBoxModelObject.h:
+        (WebCore::RenderBoxModelObject::borderWidth): Used by
+            ShapeInfo::setReferenceBoxLogicalSize.
+        (WebCore::RenderBoxModelObject::borderHeight): Ditto.
+        * rendering/shapes/ShapeInfo.cpp:
+        (WebCore::ShapeInfo&lt;RenderType&gt;::setReferenceBoxLogicalSize): Use the
+            container's writing mode to determine the logical dimensions in
+            the case of shape outside.
+        (WebCore::ShapeInfo&lt;RenderType&gt;::computedShape): Use the new
+            ShapeInfo::styleForWritingMode method.
+        (WebCore::borderBeforeInWritingMode): Determines the borderBefore for
+            the passed in renderer using the writing mode passed in. The
+            borderBefore method on the renderer is implemented in RenderStyle,
+            unlike with the margin methods, so this was chosen instead of
+            attempting to move the border method implementation into a place
+            where it could take the writing mode as an argument.
+        (WebCore::borderAndPaddingBeforeInWritingMode): Determines the
+            borderAndPaddingBefore for the passed in renderer using the
+            given writihg mode. See above for why this method instead of doing
+            it like margins.
+        (WebCore::borderStartWithStyleForWritingMode): Determines the
+            borderStart for the passed in renderer using the writing mode and
+            direction from the style passed in. See above for why this method
+            instead of doing it like margins.
+        (WebCore::borderAndPaddingStartWithStyleForWritingMode): Determines
+            the borderAndPaddingStart for the passed in renderer using the
+            writing mode and direction from the style passed in. See above for
+            why this method instead of doing it like margins.
+        (WebCore::ShapeInfo&lt;RenderType&gt;::logicalTopOffset): Use the
+            container's writing mode to determine the logicalTopOffset in the
+            case of shape outside.
+        (WebCore::ShapeInfo&lt;RenderType&gt;::logicalLeftOffset): Use the
+            container's writing mode to determine the logicalTopOffset in the
+            case of shape outside.
+        * rendering/shapes/ShapeInfo.h:
+        * rendering/shapes/ShapeInsideInfo.cpp:
+        (WebCore::ShapeInsideInfo::styleForWritingMode): Return the entire
+            style because to determine start/end the writing direction is
+            needed in addtion to the writing mode.
+        * rendering/shapes/ShapeInsideInfo.h:
+        * rendering/shapes/ShapeOutsideInfo.cpp:
+        (WebCore::ShapeOutsideInfo::updateDeltasForContainingBlockLine):
+            Properly convert the containing block line into the reference box
+            coordinates of the shape.
+        (WebCore::ShapeOutsideInfo::styleForWritingMode): Return the entire
+            style because to determine start/end the writing direction is
+            needed in addtion to the writing mode.
+        * rendering/shapes/ShapeOutsideInfo.h:
+
</ins><span class="cx"> 2014-02-19  Xabier Rodriguez Calvar  &lt;calvaris@igalia.com&gt;
</span><span class="cx"> 
</span><span class="cx">         [GStreamer] the GstPlayFlags enum diverged from upstream
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderBoxModelObjecth"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderBoxModelObject.h (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderBoxModelObject.h        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/RenderBoxModelObject.h        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -117,6 +117,8 @@
</span><span class="cx">     virtual LayoutUnit borderBottom() const { return style().borderBottomWidth(); }
</span><span class="cx">     virtual LayoutUnit borderLeft() const { return style().borderLeftWidth(); }
</span><span class="cx">     virtual LayoutUnit borderRight() const { return style().borderRightWidth(); }
</span><ins>+    virtual LayoutUnit borderWidth() const { return borderLeft() + borderRight(); }
+    virtual LayoutUnit borderHeight() const { return borderTop() + borderBottom(); }
</ins><span class="cx">     virtual LayoutUnit borderBefore() const { return style().borderBeforeWidth(); }
</span><span class="cx">     virtual LayoutUnit borderAfter() const { return style().borderAfterWidth(); }
</span><span class="cx">     virtual LayoutUnit borderStart() const { return style().borderStartWidth(); }
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeInfocpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeInfo.cpp (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeInfo.cpp        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeInfo.cpp        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -42,6 +42,45 @@
</span><span class="cx"> 
</span><span class="cx"> namespace WebCore {
</span><span class="cx"> 
</span><ins>+template&lt;class RenderType&gt;
+void ShapeInfo&lt;RenderType&gt;::setReferenceBoxLogicalSize(LayoutSize newReferenceBoxLogicalSize)
+{
+    bool isHorizontalWritingMode = this-&gt;styleForWritingMode().isHorizontalWritingMode();
+    switch (referenceBox()) {
+    case MarginBox:
+        if (isHorizontalWritingMode)
+            newReferenceBoxLogicalSize.expand(m_renderer.marginWidth(), m_renderer.marginHeight());
+        else
+            newReferenceBoxLogicalSize.expand(m_renderer.marginHeight(), m_renderer.marginWidth());
+        break;
+    case BorderBox:
+        break;
+    case PaddingBox:
+        if (isHorizontalWritingMode)
+            newReferenceBoxLogicalSize.shrink(m_renderer.borderWidth(), m_renderer.borderHeight());
+        else
+            newReferenceBoxLogicalSize.shrink(m_renderer.borderHeight(), m_renderer.borderWidth());
+        break;
+    case ContentBox:
+        if (isHorizontalWritingMode)
+            newReferenceBoxLogicalSize.shrink(m_renderer.borderAndPaddingWidth(), m_renderer.borderAndPaddingHeight());
+        else
+            newReferenceBoxLogicalSize.shrink(m_renderer.borderAndPaddingHeight(), m_renderer.borderAndPaddingWidth());
+        break;
+    case Fill:
+    case Stroke:
+    case ViewBox:
+    case BoxMissing:
+        ASSERT_NOT_REACHED();
+        break;
+    }
+
+    if (m_referenceBoxLogicalSize == newReferenceBoxLogicalSize)
+        return;
+    markShapeAsDirty();
+    m_referenceBoxLogicalSize = newReferenceBoxLogicalSize;
+}
+
</ins><span class="cx"> bool checkShapeImageOrigin(Document&amp; document, CachedImage&amp; cachedImage)
</span><span class="cx"> {
</span><span class="cx">     if (cachedImage.isOriginClean(document.securityOrigin()))
</span><span class="lines">@@ -79,7 +118,7 @@
</span><span class="cx">     if (Shape* shape = m_shape.get())
</span><span class="cx">         return *shape;
</span><span class="cx"> 
</span><del>-    WritingMode writingMode = this-&gt;writingMode();
</del><ins>+    WritingMode writingMode = this-&gt;styleForWritingMode().writingMode();
</ins><span class="cx">     Length margin = m_renderer.style().shapeMargin();
</span><span class="cx">     Length padding = m_renderer.style().shapePadding();
</span><span class="cx">     float shapeImageThreshold = m_renderer.style().shapeImageThreshold();
</span><span class="lines">@@ -131,6 +170,103 @@
</span><span class="cx">     return segments;
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+template&lt;class RenderType&gt;
+inline LayoutUnit borderBeforeInWritingMode(const RenderType&amp; renderer, WritingMode writingMode)
+{
+    switch (writingMode) {
+    case TopToBottomWritingMode: return renderer.borderTop();
+    case BottomToTopWritingMode: return renderer.borderBottom();
+    case LeftToRightWritingMode: return renderer.borderLeft();
+    case RightToLeftWritingMode: return renderer.borderRight();
+    }
+
+    ASSERT_NOT_REACHED();
+    return renderer.borderBefore();
+}
+
+template&lt;class RenderType&gt;
+inline LayoutUnit borderAndPaddingBeforeInWritingMode(const RenderType&amp; renderer, WritingMode writingMode)
+{
+    switch (writingMode) {
+    case TopToBottomWritingMode: return renderer.borderTop() + renderer.paddingTop();
+    case BottomToTopWritingMode: return renderer.borderBottom() + renderer.paddingBottom();
+    case LeftToRightWritingMode: return renderer.borderLeft() + renderer.paddingLeft();
+    case RightToLeftWritingMode: return renderer.borderRight() + renderer.paddingRight();
+    }
+
+    ASSERT_NOT_REACHED();
+    return renderer.borderAndPaddingBefore();
+}
+
+template&lt;class RenderType&gt;
+LayoutUnit ShapeInfo&lt;RenderType&gt;::logicalTopOffset() const
+{
+    switch (referenceBox()) {
+    case MarginBox: return -m_renderer.marginBefore(&amp;styleForWritingMode());
+    case BorderBox: return LayoutUnit();
+    case PaddingBox: return borderBeforeInWritingMode(m_renderer, styleForWritingMode().writingMode());
+    case ContentBox: return borderAndPaddingBeforeInWritingMode(m_renderer, styleForWritingMode().writingMode());
+    case Fill: break;
+    case Stroke: break;
+    case ViewBox: break;
+    case BoxMissing: break;
+    }
+
+    ASSERT_NOT_REACHED();
+    return LayoutUnit();
+}
+
+template&lt;class RenderType&gt;
+inline LayoutUnit borderStartWithStyleForWritingMode(const RenderType&amp; renderer, const RenderStyle&amp; style)
+{
+    if (style.isHorizontalWritingMode()) {
+        if (style.isLeftToRightDirection())
+            return renderer.borderLeft();
+
+        return renderer.borderRight();
+    }
+    if (style.isLeftToRightDirection())
+        return renderer.borderTop();
+
+    return renderer.borderBottom();
+}
+
+template&lt;class RenderType&gt;
+inline LayoutUnit borderAndPaddingStartWithStyleForWritingMode(const RenderType&amp; renderer, const RenderStyle&amp; style)
+{
+    if (style.isHorizontalWritingMode()) {
+        if (style.isLeftToRightDirection())
+            return renderer.borderLeft() + renderer.paddingLeft();
+
+        return renderer.borderRight() + renderer.paddingRight();
+    }
+    if (style.isLeftToRightDirection())
+        return renderer.borderTop() + renderer.paddingTop();
+
+    return renderer.borderBottom() + renderer.paddingBottom();
+}
+
+template&lt;class RenderType&gt;
+LayoutUnit ShapeInfo&lt;RenderType&gt;::logicalLeftOffset() const
+{
+    if (m_renderer.isRenderRegion())
+        return LayoutUnit();
+
+    switch (referenceBox()) {
+    case MarginBox: return -m_renderer.marginStart(&amp;styleForWritingMode());
+    case BorderBox: return LayoutUnit();
+    case PaddingBox: return borderStartWithStyleForWritingMode(m_renderer, styleForWritingMode());
+    case ContentBox: return borderAndPaddingStartWithStyleForWritingMode(m_renderer, styleForWritingMode());
+    case Fill: break;
+    case Stroke: break;
+    case ViewBox: break;
+    case BoxMissing: break;
+    }
+
+    ASSERT_NOT_REACHED();
+    return LayoutUnit();
+}
+
</ins><span class="cx"> template class ShapeInfo&lt;RenderBlock&gt;;
</span><span class="cx"> template class ShapeInfo&lt;RenderBox&gt;;
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeInfoh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeInfo.h (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeInfo.h        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeInfo.h        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -71,35 +71,8 @@
</span><span class="cx"> public:
</span><span class="cx">     virtual ~ShapeInfo() { }
</span><span class="cx"> 
</span><del>-    void setReferenceBoxLogicalSize(LayoutSize newReferenceBoxLogicalSize)
-    {
-        LayoutBox box = referenceBox();
-        switch (box) {
-        case MarginBox:
-            newReferenceBoxLogicalSize.expand(m_renderer.marginLogicalWidth(), m_renderer.marginLogicalHeight());
-            break;
-        case BorderBox:
-            break;
-        case PaddingBox:
-            newReferenceBoxLogicalSize.shrink(m_renderer.borderLogicalWidth(), m_renderer.borderLogicalHeight());
-            break;
-        case ContentBox:
-            newReferenceBoxLogicalSize.shrink(m_renderer.borderAndPaddingLogicalWidth(), m_renderer.borderAndPaddingLogicalHeight());
-            break;
-        case Fill:
-        case Stroke:
-        case ViewBox:
-        case BoxMissing:
-            ASSERT_NOT_REACHED();
-            break;
-        }
</del><ins>+    void setReferenceBoxLogicalSize(LayoutSize);
</ins><span class="cx"> 
</span><del>-        if (m_referenceBoxLogicalSize == newReferenceBoxLogicalSize)
-            return;
-        markShapeAsDirty();
-        m_referenceBoxLogicalSize = newReferenceBoxLogicalSize;
-    }
-
</del><span class="cx">     SegmentList computeSegmentsForLine(LayoutUnit lineTop, LayoutUnit lineHeight) const;
</span><span class="cx"> 
</span><span class="cx">     LayoutUnit shapeLogicalTop() const { return computedShapeLogicalBoundingBox().y() + logicalTopOffset(); }
</span><span class="lines">@@ -164,44 +137,11 @@
</span><span class="cx">     virtual ShapeValue* shapeValue() const = 0;
</span><span class="cx">     virtual void getIntervals(LayoutUnit, LayoutUnit, SegmentList&amp;) const = 0;
</span><span class="cx"> 
</span><del>-    virtual WritingMode writingMode() const { return m_renderer.style().writingMode(); }
</del><ins>+    virtual const RenderStyle&amp; styleForWritingMode() const = 0;
</ins><span class="cx"> 
</span><del>-    LayoutUnit logicalTopOffset() const
-    {
-        LayoutBox box = referenceBox();
-        switch (box) {
-        case MarginBox: return -m_renderer.marginBefore();
-        case BorderBox: return LayoutUnit();
-        case PaddingBox: return m_renderer.borderBefore();
-        case ContentBox: return m_renderer.borderAndPaddingBefore();
-        case Fill: break;
-        case Stroke: break;
-        case ViewBox: break;
-        case BoxMissing: break;
-        }
-        ASSERT_NOT_REACHED();
-        return LayoutUnit();
-    }
</del><ins>+    LayoutUnit logicalTopOffset() const;
+    LayoutUnit logicalLeftOffset() const;
</ins><span class="cx"> 
</span><del>-    LayoutUnit logicalLeftOffset() const
-    {
-        if (m_renderer.isRenderRegion())
-            return LayoutUnit();
-        LayoutBox box = referenceBox();
-        switch (box) {
-        case MarginBox: return -m_renderer.marginStart();
-        case BorderBox: return LayoutUnit();
-        case PaddingBox: return m_renderer.borderStart();
-        case ContentBox: return m_renderer.borderAndPaddingStart();
-        case Fill: break;
-        case Stroke: break;
-        case ViewBox: break;
-        case BoxMissing: break;
-        }
-        ASSERT_NOT_REACHED();
-        return LayoutUnit();
-    }
-
</del><span class="cx">     LayoutUnit m_referenceBoxLineTop;
</span><span class="cx">     LayoutUnit m_lineHeight;
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeInsideInfocpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.cpp (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.cpp        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.cpp        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -111,6 +111,11 @@
</span><span class="cx">     return m_renderer.style().resolvedShapeInside();
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+const RenderStyle&amp; ShapeInsideInfo::styleForWritingMode() const
+{
+    return m_renderer.style();
+}
+
</ins><span class="cx"> LayoutUnit ShapeInsideInfo::computeFirstFitPositionForFloat(const FloatSize floatSize) const
</span><span class="cx"> {
</span><span class="cx">     if (!floatSize.width() || shapeLogicalBottom() &lt; logicalLineTop())
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeInsideInfoh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.h (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.h        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeInsideInfo.h        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -115,6 +115,8 @@
</span><span class="cx">         return shapeValue()-&gt;layoutBox();
</span><span class="cx">     }
</span><span class="cx"> 
</span><ins>+    virtual const RenderStyle&amp; styleForWritingMode() const override;
+
</ins><span class="cx"> private:
</span><span class="cx">     virtual LayoutRect computedShapeLogicalBoundingBox() const override { return computedShape().shapePaddingLogicalBoundingBox(); }
</span><span class="cx">     virtual ShapeValue* shapeValue() const override;
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeOutsideInfocpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.cpp (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.cpp        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.cpp        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -61,7 +61,7 @@
</span><span class="cx"> 
</span><span class="cx"> void ShapeOutsideInfo::updateDeltasForContainingBlockLine(const RenderBlockFlow&amp; containingBlock, const FloatingObject&amp; floatingObject, LayoutUnit lineTop, LayoutUnit lineHeight)
</span><span class="cx"> {
</span><del>-    LayoutUnit borderBoxTop = containingBlock.logicalTopForFloat(&amp;floatingObject) + std::max(LayoutUnit(), containingBlock.marginBeforeForChild(m_renderer));
</del><ins>+    LayoutUnit borderBoxTop = containingBlock.logicalTopForFloat(&amp;floatingObject) + containingBlock.marginBeforeForChild(m_renderer);
</ins><span class="cx">     LayoutUnit borderBoxLineTop = lineTop - borderBoxTop;
</span><span class="cx"> 
</span><span class="cx">     if (isShapeDirty() || m_borderBoxLineTop != borderBoxLineTop || m_lineHeight != lineHeight) {
</span><span class="lines">@@ -74,10 +74,12 @@
</span><span class="cx">         if (lineOverlapsShapeBounds()) {
</span><span class="cx">             SegmentList segments = computeSegmentsForLine(borderBoxLineTop, lineHeight);
</span><span class="cx">             if (segments.size()) {
</span><del>-                LayoutUnit rawLeftMarginBoxDelta = segments.first().logicalLeft + containingBlock.marginStartForChild(m_renderer);
</del><ins>+                LayoutUnit logicalLeftMargin = containingBlock.style().isLeftToRightDirection() ? containingBlock.marginStartForChild(m_renderer) : containingBlock.marginEndForChild(m_renderer);
+                LayoutUnit rawLeftMarginBoxDelta = segments.first().logicalLeft + logicalLeftMargin;
</ins><span class="cx">                 m_leftMarginBoxDelta = clampTo&lt;LayoutUnit&gt;(rawLeftMarginBoxDelta, LayoutUnit(), floatMarginBoxWidth);
</span><span class="cx"> 
</span><del>-                LayoutUnit rawRightMarginBoxDelta = segments.last().logicalRight - containingBlock.logicalWidthForChild(m_renderer) - containingBlock.marginEndForChild(m_renderer);
</del><ins>+                LayoutUnit logicalRightMargin = containingBlock.style().isLeftToRightDirection() ? containingBlock.marginEndForChild(m_renderer) : containingBlock.marginStartForChild(m_renderer);
+                LayoutUnit rawRightMarginBoxDelta = segments.last().logicalRight - containingBlock.logicalWidthForChild(m_renderer) - logicalRightMargin;
</ins><span class="cx">                 m_rightMarginBoxDelta = clampTo&lt;LayoutUnit&gt;(rawRightMarginBoxDelta, -floatMarginBoxWidth, LayoutUnit());
</span><span class="cx">                 m_lineOverlapsShape = true;
</span><span class="cx">                 return;
</span><span class="lines">@@ -98,10 +100,10 @@
</span><span class="cx">     return m_renderer.style().shapeOutside();
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-WritingMode ShapeOutsideInfo::writingMode() const
</del><ins>+const RenderStyle&amp; ShapeOutsideInfo::styleForWritingMode() const
</ins><span class="cx"> {
</span><span class="cx">     ASSERT(m_renderer.containingBlock());
</span><del>-    return m_renderer.containingBlock()-&gt;style().writingMode();
</del><ins>+    return m_renderer.containingBlock()-&gt;style();
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingshapesShapeOutsideInfoh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.h (164362 => 164363)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.h        2014-02-19 10:25:05 UTC (rev 164362)
+++ trunk/Source/WebCore/rendering/shapes/ShapeOutsideInfo.h        2014-02-19 15:20:01 UTC (rev 164363)
</span><span class="lines">@@ -81,7 +81,7 @@
</span><span class="cx">         return computedShape().getExcludedIntervals(lineTop, lineHeight, segments);
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    virtual WritingMode writingMode() const;
</del><ins>+    virtual const RenderStyle&amp; styleForWritingMode() const override;
</ins><span class="cx"> 
</span><span class="cx">     LayoutUnit m_leftMarginBoxDelta;
</span><span class="cx">     LayoutUnit m_rightMarginBoxDelta;
</span></span></pre>
</div>
</div>

</body>
</html>