<!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>[164998] 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/164998">164998</a></dd>
<dt>Author</dt> <dd>betravis@adobe.com</dd>
<dt>Date</dt> <dd>2014-03-03 12:24:30 -0800 (Mon, 03 Mar 2014)</dd>
</dl>

<h3>Log Message</h3>
<pre>[CSS Shapes] Serialize circle positions
https://bugs.webkit.org/show_bug.cgi?id=129404

Reviewed by Dirk Schulze.

Source/WebCore:

Circle positions should always be present when serialized, and should
only have the 2 or 4-valued form. Keywords are converted to percentages
and simplified where possible. This patch adds some additional processing
that converts the parsed position into the serialized format, before
converting it to text. See http://dev.w3.org/csswg/css-shapes/#basic-shape-serialization.

Updated existing parsing tests.

* css/CSSBasicShapes.cpp:
(WebCore::serializePositionOffset): Convert a position offset to a serialized string.
The offset must be a pair, as generated by buildSerializablePositionOffset.
(WebCore::buildSerializablePositionOffset): Generates a keyword + offset pair for each
position offset. The keywords may later be dropped during serialization.
(WebCore::CSSBasicShapeCircle::cssText): Use the new serialization methods.

LayoutTests:

Modify each circle test to have a correctly serialized position.

* fast/masking/parsing-clip-path-shape-expected.html: Updated result.
* fast/masking/parsing-clip-path-shape.html: Updated test.
* fast/shapes/parsing/parsing-shape-inside-expected.txt: Updated results.
* fast/shapes/parsing/parsing-shape-outside-expected.txt: Updated results.
* fast/shapes/parsing/parsing-test-utils.js: Updated serialization results.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsfastmaskingparsingclippathshapeexpectedtxt">trunk/LayoutTests/fast/masking/parsing-clip-path-shape-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastmaskingparsingclippathshapehtml">trunk/LayoutTests/fast/masking/parsing-clip-path-shape.html</a></li>
<li><a href="#trunkLayoutTestsfastshapesparsingparsingshapeinsideexpectedtxt">trunk/LayoutTests/fast/shapes/parsing/parsing-shape-inside-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastshapesparsingparsingshapeoutsideexpectedtxt">trunk/LayoutTests/fast/shapes/parsing/parsing-shape-outside-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastshapesparsingparsingtestutilsjs">trunk/LayoutTests/fast/shapes/parsing/parsing-test-utils.js</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorecssCSSBasicShapescpp">trunk/Source/WebCore/css/CSSBasicShapes.cpp</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/ChangeLog        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -1,3 +1,18 @@
</span><ins>+2014-03-03  Bear Travis  &lt;betravis@adobe.com&gt;
+
+        [CSS Shapes] Serialize circle positions
+        https://bugs.webkit.org/show_bug.cgi?id=129404
+
+        Reviewed by Dirk Schulze.
+
+        Modify each circle test to have a correctly serialized position.
+
+        * fast/masking/parsing-clip-path-shape-expected.html: Updated result.
+        * fast/masking/parsing-clip-path-shape.html: Updated test.
+        * fast/shapes/parsing/parsing-shape-inside-expected.txt: Updated results.
+        * fast/shapes/parsing/parsing-shape-outside-expected.txt: Updated results.
+        * fast/shapes/parsing/parsing-test-utils.js: Updated serialization results.
+
</ins><span class="cx"> 2014-03-03  Dirk Schulze  &lt;krit@webkit.org&gt;
</span><span class="cx"> 
</span><span class="cx">         Transform CSS clip-path pixel tests to ref tests
</span></span></pre></div>
<a id="trunkLayoutTestsfastmaskingparsingclippathshapeexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/masking/parsing-clip-path-shape-expected.txt (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/masking/parsing-clip-path-shape-expected.txt        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/fast/masking/parsing-clip-path-shape-expected.txt        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -7,7 +7,7 @@
</span><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(-1px, +1px, 1px)&quot;) is &quot;circle(-1px, 1px, 1px)&quot;
</span><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(-1.5px, +1.5px, 1.5px)&quot;) is &quot;circle(-1.5px, 1.5px, 1.5px)&quot;
</span><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(-.5px, +.5px, .5px)&quot;) is &quot;circle(-0.5px, 0.5px, 0.5px)&quot;
</span><del>-PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(0 at 0 0)&quot;) is &quot;circle(0px at 0px 0px)&quot;
</del><ins>+PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(0 at 0 0)&quot;) is &quot;circle(0px at 0% 0%)&quot;
</ins><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(1px at -1px +1px)&quot;) is &quot;circle(1px at -1px 1px)&quot;
</span><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(1.5px at -1.5px +1.5px)&quot;) is &quot;circle(1.5px at -1.5px 1.5px)&quot;
</span><span class="cx"> PASS innerStyle(&quot;-webkit-clip-path&quot;, &quot;circle(.5px at -.5px +.5px)&quot;) is &quot;circle(0.5px at -0.5px 0.5px)&quot;
</span></span></pre></div>
<a id="trunkLayoutTestsfastmaskingparsingclippathshapehtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/masking/parsing-clip-path-shape.html (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/masking/parsing-clip-path-shape.html        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/fast/masking/parsing-clip-path-shape.html        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -46,7 +46,7 @@
</span><span class="cx"> testInner(&quot;-webkit-clip-path&quot;, &quot;circle(-1.5px, +1.5px, 1.5px)&quot;, &quot;circle(-1.5px, 1.5px, 1.5px)&quot;);
</span><span class="cx"> testInner(&quot;-webkit-clip-path&quot;, &quot;circle(-.5px, +.5px, .5px)&quot;, &quot;circle(-0.5px, 0.5px, 0.5px)&quot;);
</span><span class="cx"> 
</span><del>-testInner(&quot;-webkit-clip-path&quot;, &quot;circle(0 at 0 0)&quot;, &quot;circle(0px at 0px 0px)&quot;);
</del><ins>+testInner(&quot;-webkit-clip-path&quot;, &quot;circle(0 at 0 0)&quot;, &quot;circle(0px at 0% 0%)&quot;);
</ins><span class="cx"> testInner(&quot;-webkit-clip-path&quot;, &quot;circle(1px at -1px +1px)&quot;, &quot;circle(1px at -1px 1px)&quot;);
</span><span class="cx"> testInner(&quot;-webkit-clip-path&quot;, &quot;circle(1.5px at -1.5px +1.5px)&quot;, &quot;circle(1.5px at -1.5px 1.5px)&quot;);
</span><span class="cx"> testInner(&quot;-webkit-clip-path&quot;, &quot;circle(.5px at -.5px +.5px)&quot;, &quot;circle(0.5px at -0.5px 0.5px)&quot;);
</span></span></pre></div>
<a id="trunkLayoutTestsfastshapesparsingparsingshapeinsideexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/shapes/parsing/parsing-shape-inside-expected.txt (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/parsing/parsing-shape-inside-expected.txt        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/fast/shapes/parsing/parsing-shape-inside-expected.txt        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -69,13 +69,13 @@
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;inset(10px 20px 30px 40px round 5px 6px 7px 8px / 50px 60px 70px 80px)&quot;) is &quot;inset(10px 20px 30px 40px round 5px 6px 7px 8px / 50px 60px 70px 80px)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px, 20px, 30px)&quot;) is &quot;circle(10px, 20px, 30px)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px, 20px, 30px)&quot;) is &quot;circle(10px, 20px, 30px)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle()&quot;) is &quot;circle()&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle()&quot;) is &quot;circle(at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle()&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px at 50% 50%)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at 10px)&quot;) is &quot;circle(10px at 10px 50%)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at 10px)&quot;) is &quot;circle(10px at 10px 50%)&quot;
</span><span class="lines">@@ -89,10 +89,14 @@
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(at top left)&quot;) is &quot;circle(closest-side at 0% 0%)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(at right bottom)&quot;) is &quot;circle(at 100% 100%)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(at right bottom)&quot;) is &quot;circle(closest-side at 100% 100%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at left 0% top 10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at 0% 10px)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at 0% 10px)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at left 10px top 10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at 10px 10px)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at 10px 10px)&quot;
</span><ins>+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 10% bottom 10%)&quot;) is &quot;circle(10px at 90% 90%)&quot;
+PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 10% bottom 10%)&quot;) is &quot;circle(10px at 90% 90%)&quot;
+PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 0px bottom 0px)&quot;) is &quot;circle(10px at 100% 100%)&quot;
+PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 0px bottom 0px)&quot;) is &quot;circle(10px at 100% 100%)&quot;
</ins><span class="cx"> PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 10px bottom 10px)&quot;) is &quot;circle(10px at right 10px bottom 10px)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-inside&quot;, &quot;circle(10px at right 10px bottom 10px)&quot;) is &quot;circle(10px at right 10px bottom 10px)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-inside&quot;, &quot;ellipse(10px, 20px, 30px, 40px)&quot;) is &quot;ellipse(10px, 20px, 30px, 40px)&quot;
</span></span></pre></div>
<a id="trunkLayoutTestsfastshapesparsingparsingshapeoutsideexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/shapes/parsing/parsing-shape-outside-expected.txt (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/parsing/parsing-shape-outside-expected.txt        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/fast/shapes/parsing/parsing-shape-outside-expected.txt        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -69,13 +69,13 @@
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;inset(10px 20px 30px 40px round 5px 6px 7px 8px / 50px 60px 70px 80px)&quot;) is &quot;inset(10px 20px 30px 40px round 5px 6px 7px 8px / 50px 60px 70px 80px)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px, 20px, 30px)&quot;) is &quot;circle(10px, 20px, 30px)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px, 20px, 30px)&quot;) is &quot;circle(10px, 20px, 30px)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle()&quot;) is &quot;circle()&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle()&quot;) is &quot;circle(at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle()&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(farthest-side)&quot;) is &quot;circle(farthest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(closest-side)&quot;) is &quot;circle(closest-side at 50% 50%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px at 50% 50%)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px)&quot;) is &quot;circle(10px at 50% 50%)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at 10px)&quot;) is &quot;circle(10px at 10px 50%)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at 10px)&quot;) is &quot;circle(10px at 10px 50%)&quot;
</span><span class="lines">@@ -89,10 +89,14 @@
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(at top left)&quot;) is &quot;circle(closest-side at 0% 0%)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(at right bottom)&quot;) is &quot;circle(at 100% 100%)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(at right bottom)&quot;) is &quot;circle(closest-side at 100% 100%)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at left 0% top 10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at 0% 10px)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at left top 10px)&quot;) is &quot;circle(10px at 0% 10px)&quot;
</span><del>-PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at left 10px top 10px)&quot;
</del><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at 10px 10px)&quot;
</ins><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at top 10px left 10px)&quot;) is &quot;circle(10px at 10px 10px)&quot;
</span><ins>+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 10% bottom 10%)&quot;) is &quot;circle(10px at 90% 90%)&quot;
+PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 10% bottom 10%)&quot;) is &quot;circle(10px at 90% 90%)&quot;
+PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 0px bottom 0px)&quot;) is &quot;circle(10px at 100% 100%)&quot;
+PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 0px bottom 0px)&quot;) is &quot;circle(10px at 100% 100%)&quot;
</ins><span class="cx"> PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 10px bottom 10px)&quot;) is &quot;circle(10px at right 10px bottom 10px)&quot;
</span><span class="cx"> PASS getComputedStyleValue(&quot;-webkit-shape-outside&quot;, &quot;circle(10px at right 10px bottom 10px)&quot;) is &quot;circle(10px at right 10px bottom 10px)&quot;
</span><span class="cx"> PASS getCSSText(&quot;-webkit-shape-outside&quot;, &quot;ellipse(10px, 20px, 30px, 40px)&quot;) is &quot;ellipse(10px, 20px, 30px, 40px)&quot;
</span></span></pre></div>
<a id="trunkLayoutTestsfastshapesparsingparsingtestutilsjs"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/shapes/parsing/parsing-test-utils.js (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shapes/parsing/parsing-test-utils.js        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/LayoutTests/fast/shapes/parsing/parsing-test-utils.js        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -42,18 +42,20 @@
</span><span class="cx"> 
</span><span class="cx">     &quot;circle(10px, 20px, 30px)&quot;, // FIXME: Remove this test once we do not support the deprecated CSS Shapes syntax anymore.
</span><span class="cx"> 
</span><del>-    [&quot;circle()&quot;, &quot;circle()&quot;, &quot;circle(closest-side at 50% 50%)&quot;],
-    [&quot;circle(farthest-side)&quot;, &quot;circle(farthest-side)&quot;, &quot;circle(farthest-side at 50% 50%)&quot;],
-    [&quot;circle(closest-side)&quot;, &quot;circle(closest-side)&quot;, &quot;circle(closest-side at 50% 50%)&quot;],
-    [&quot;circle(10px)&quot;, &quot;circle(10px)&quot;, &quot;circle(10px at 50% 50%)&quot;],
</del><ins>+    [&quot;circle()&quot;, &quot;circle(at 50% 50%)&quot;, &quot;circle(closest-side at 50% 50%)&quot;],
+    [&quot;circle(farthest-side)&quot;, &quot;circle(farthest-side at 50% 50%)&quot;, &quot;circle(farthest-side at 50% 50%)&quot;],
+    [&quot;circle(closest-side)&quot;, &quot;circle(closest-side at 50% 50%)&quot;, &quot;circle(closest-side at 50% 50%)&quot;],
+    [&quot;circle(10px)&quot;, &quot;circle(10px at 50% 50%)&quot;, &quot;circle(10px at 50% 50%)&quot;],
</ins><span class="cx">     [&quot;circle(10px at 10px)&quot;, &quot;circle(10px at 10px 50%)&quot;],
</span><span class="cx">     &quot;circle(10px at 10px 10px)&quot;,
</span><span class="cx">     [&quot;circle(at 10px)&quot;, &quot;circle(at 10px 50%)&quot;, &quot;circle(closest-side at 10px 50%)&quot;],
</span><span class="cx">     [&quot;circle(at 10px 10px)&quot;, &quot;circle(at 10px 10px)&quot;, &quot;circle(closest-side at 10px 10px)&quot;],
</span><span class="cx">     [&quot;circle(at top left)&quot;, &quot;circle(at 0% 0%)&quot;, &quot;circle(closest-side at 0% 0%)&quot;],
</span><span class="cx">     [&quot;circle(at right bottom)&quot;, &quot;circle(at 100% 100%)&quot;, &quot;circle(closest-side at 100% 100%)&quot;],
</span><del>-    [&quot;circle(10px at left top 10px)&quot;, &quot;circle(10px at left 0% top 10px)&quot;, &quot;circle(10px at 0% 10px)&quot;],
-    [&quot;circle(10px at top 10px left 10px)&quot;, &quot;circle(10px at left 10px top 10px)&quot;, &quot;circle(10px at 10px 10px)&quot;],
</del><ins>+    [&quot;circle(10px at left top 10px)&quot;, &quot;circle(10px at 0% 10px)&quot;, &quot;circle(10px at 0% 10px)&quot;],
+    [&quot;circle(10px at top 10px left 10px)&quot;, &quot;circle(10px at 10px 10px)&quot;, &quot;circle(10px at 10px 10px)&quot;],
+    [&quot;circle(10px at right 10% bottom 10%)&quot;, &quot;circle(10px at 90% 90%)&quot;],
+    [&quot;circle(10px at right 0px bottom 0px)&quot;, &quot;circle(10px at 100% 100%)&quot;],
</ins><span class="cx">     [&quot;circle(10px at right 10px bottom 10px)&quot;, &quot;circle(10px at right 10px bottom 10px)&quot;],
</span><span class="cx"> 
</span><span class="cx">     &quot;ellipse(10px, 20px, 30px, 40px)&quot;, // FIXME: Remove this test once we do not support the deprecated CSS Shapes syntax anymore.
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/Source/WebCore/ChangeLog        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -1,3 +1,25 @@
</span><ins>+2014-03-03  Bear Travis  &lt;betravis@adobe.com&gt;
+
+        [CSS Shapes] Serialize circle positions
+        https://bugs.webkit.org/show_bug.cgi?id=129404
+
+        Reviewed by Dirk Schulze.
+
+        Circle positions should always be present when serialized, and should
+        only have the 2 or 4-valued form. Keywords are converted to percentages
+        and simplified where possible. This patch adds some additional processing
+        that converts the parsed position into the serialized format, before
+        converting it to text. See http://dev.w3.org/csswg/css-shapes/#basic-shape-serialization.
+
+        Updated existing parsing tests.
+
+        * css/CSSBasicShapes.cpp:
+        (WebCore::serializePositionOffset): Convert a position offset to a serialized string.
+        The offset must be a pair, as generated by buildSerializablePositionOffset.
+        (WebCore::buildSerializablePositionOffset): Generates a keyword + offset pair for each
+        position offset. The keywords may later be dropped during serialization.
+        (WebCore::CSSBasicShapeCircle::cssText): Use the new serialization methods.
+
</ins><span class="cx"> 2014-03-03  Lorenzo Tilve  &lt;ltilve@igalia.com&gt;
</span><span class="cx"> 
</span><span class="cx">         Optimize StylePropertiesSet::findPropertyIndex() to improve CSS properties performance
</span></span></pre></div>
<a id="trunkSourceWebCorecssCSSBasicShapescpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/css/CSSBasicShapes.cpp (164997 => 164998)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/css/CSSBasicShapes.cpp        2014-03-03 20:01:26 UTC (rev 164997)
+++ trunk/Source/WebCore/css/CSSBasicShapes.cpp        2014-03-03 20:24:30 UTC (rev 164998)
</span><span class="lines">@@ -32,6 +32,7 @@
</span><span class="cx"> #include &quot;CSSBasicShapes.h&quot;
</span><span class="cx"> 
</span><span class="cx"> #include &quot;CSSPrimitiveValueMappings.h&quot;
</span><ins>+#include &quot;CSSValuePool.h&quot;
</ins><span class="cx"> #include &quot;Pair.h&quot;
</span><span class="cx"> #include &lt;wtf/text/StringBuilder.h&gt;
</span><span class="cx"> 
</span><span class="lines">@@ -96,6 +97,47 @@
</span><span class="cx">         &amp;&amp; compareCSSValuePtr(m_layoutBox, other.m_layoutBox);
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+static String serializePositionOffset(const Pair&amp; offset, const Pair&amp; other)
+{
+    if ((offset.first()-&gt;getValueID() == CSSValueLeft &amp;&amp; other.first()-&gt;getValueID() == CSSValueTop)
+        || (offset.first()-&gt;getValueID() == CSSValueTop &amp;&amp; other.first()-&gt;getValueID() == CSSValueLeft))
+        return offset.second()-&gt;cssText();
+    return offset.cssText();
+}
+
+static PassRefPtr&lt;CSSPrimitiveValue&gt; buildSerializablePositionOffset(PassRefPtr&lt;CSSPrimitiveValue&gt; offset, CSSValueID defaultSide)
+{
+    CSSValueID side = defaultSide;
+    RefPtr&lt;CSSPrimitiveValue&gt; amount;
+
+    if (!offset)
+        side = CSSValueCenter;
+    else if (offset-&gt;isValueID())
+        side = offset-&gt;getValueID();
+    else if (Pair* pair = offset-&gt;getPairValue()) {
+        side = pair-&gt;first()-&gt;getValueID();
+        amount = pair-&gt;second();
+    } else
+        amount = offset;
+
+    if (side == CSSValueCenter) {
+        side = defaultSide;
+        amount = cssValuePool().createValue(Length(50, Percent));
+    } else if ((side == CSSValueRight || side == CSSValueBottom)
+        &amp;&amp; amount-&gt;isPercentage()) {
+        side = defaultSide;
+        amount = cssValuePool().createValue(Length(100 - amount-&gt;getFloatValue(), Percent));
+    } else if (amount-&gt;isLength() &amp;&amp; !amount-&gt;getFloatValue()) {
+        if (side == CSSValueRight || side == CSSValueBottom)
+            amount = cssValuePool().createValue(Length(100, Percent));
+        else
+            amount = cssValuePool().createValue(Length(0, Percent));
+        side = defaultSide;
+    }
+
+    return cssValuePool().createValue(Pair::create(cssValuePool().createValue(side), amount.release()));
+}
+
</ins><span class="cx"> static String buildCircleString(const String&amp; radius, const String&amp; centerX, const String&amp; centerY, const String&amp; box)
</span><span class="cx"> {
</span><span class="cx">     char opening[] = &quot;circle(&quot;;
</span><span class="lines">@@ -125,9 +167,12 @@
</span><span class="cx"> 
</span><span class="cx"> String CSSBasicShapeCircle::cssText() const
</span><span class="cx"> {
</span><ins>+    RefPtr&lt;CSSPrimitiveValue&gt; normalizedCX = buildSerializablePositionOffset(m_centerX, CSSValueLeft);
+    RefPtr&lt;CSSPrimitiveValue&gt; normalizedCY = buildSerializablePositionOffset(m_centerY, CSSValueTop);
+
</ins><span class="cx">     return buildCircleString(m_radius ? m_radius-&gt;cssText() : String(),
</span><del>-        m_centerX ? m_centerX-&gt;cssText() : String(),
-        m_centerY ? m_centerY-&gt;cssText() : String(),
</del><ins>+        serializePositionOffset(*normalizedCX-&gt;getPairValue(), *normalizedCY-&gt;getPairValue()),
+        serializePositionOffset(*normalizedCY-&gt;getPairValue(), *normalizedCX-&gt;getPairValue()),
</ins><span class="cx">         m_layoutBox ? m_layoutBox-&gt;cssText() : String());
</span><span class="cx"> }
</span><span class="cx"> 
</span></span></pre>
</div>
</div>

</body>
</html>