<!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>[175721] trunk/LayoutTests</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/175721">175721</a></dd>
<dt>Author</dt> <dd>bjonesbe@adobe.com</dd>
<dt>Date</dt> <dd>2014-11-06 15:20:53 -0800 (Thu, 06 Nov 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>[CSS Shapes] the spec-examples reftests are off by a few pixels
https://bugs.webkit.org/show_bug.cgi?id=135927
Reviewed by Zoltan Horvath.
Import new versions of the spec example tests that are js tests
instead of ref tests so that they can properly handle the small pixel
differences in rendering between platforms.
* TestExpectations:
* css3/shapes/spec-examples/shape-outside-010-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-010-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-010.html:
* css3/shapes/spec-examples/shape-outside-011-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-011-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-011.html:
* css3/shapes/spec-examples/shape-outside-012-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-012-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-012.html:
* css3/shapes/spec-examples/shape-outside-013-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-013-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-013.html:
* css3/shapes/spec-examples/shape-outside-014-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-014-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-014.html:
* css3/shapes/spec-examples/shape-outside-015-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-015-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-015.html:
* css3/shapes/spec-examples/shape-outside-016-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-016-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-016.html:
* css3/shapes/spec-examples/shape-outside-017-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-017-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-017.html:
* css3/shapes/spec-examples/shape-outside-018-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-018-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-018.html:
* css3/shapes/spec-examples/shape-outside-019-expected.html: Removed.
* css3/shapes/spec-examples/shape-outside-019-expected.txt: Added.
* css3/shapes/spec-examples/shape-outside-019.html:
* css3/shapes/spec-examples/support/spec-example-utils.js: Added.
(.runTest):
(approxShapeTest):
* css3/shapes/spec-examples/support/w3c-import.log:
* css3/shapes/spec-examples/w3c-import.log:</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsTestExpectations">trunk/LayoutTests/TestExpectations</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside010html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside011html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside012html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside013html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside014html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside015html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside016html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside017html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside018html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside019html">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplessupportw3cimportlog">trunk/LayoutTests/css3/shapes/spec-examples/support/w3c-import.log</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesw3cimportlog">trunk/LayoutTests/css3/shapes/spec-examples/w3c-import.log</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside010expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside011expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside012expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside013expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside014expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside015expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside016expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside017expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside018expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside019expectedtxt">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplessupportspecexampleutilsjs">trunk/LayoutTests/css3/shapes/spec-examples/support/spec-example-utils.js</a></li>
</ul>
<h3>Removed Paths</h3>
<ul>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside010expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside011expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside012expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside013expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside014expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside015expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside016expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside017expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside018expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.html</a></li>
<li><a href="#trunkLayoutTestscss3shapesspecexamplesshapeoutside019expectedhtml">trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/ChangeLog 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,3 +1,51 @@
</span><ins>+2014-11-06 Bem Jones-Bey <bjonesbe@adobe.com>
+
+ [CSS Shapes] the spec-examples reftests are off by a few pixels
+ https://bugs.webkit.org/show_bug.cgi?id=135927
+
+ Reviewed by Zoltan Horvath.
+
+ Import new versions of the spec example tests that are js tests
+ instead of ref tests so that they can properly handle the small pixel
+ differences in rendering between platforms.
+
+ * TestExpectations:
+ * css3/shapes/spec-examples/shape-outside-010-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-010-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-010.html:
+ * css3/shapes/spec-examples/shape-outside-011-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-011-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-011.html:
+ * css3/shapes/spec-examples/shape-outside-012-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-012-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-012.html:
+ * css3/shapes/spec-examples/shape-outside-013-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-013-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-013.html:
+ * css3/shapes/spec-examples/shape-outside-014-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-014-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-014.html:
+ * css3/shapes/spec-examples/shape-outside-015-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-015-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-015.html:
+ * css3/shapes/spec-examples/shape-outside-016-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-016-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-016.html:
+ * css3/shapes/spec-examples/shape-outside-017-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-017-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-017.html:
+ * css3/shapes/spec-examples/shape-outside-018-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-018-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-018.html:
+ * css3/shapes/spec-examples/shape-outside-019-expected.html: Removed.
+ * css3/shapes/spec-examples/shape-outside-019-expected.txt: Added.
+ * css3/shapes/spec-examples/shape-outside-019.html:
+ * css3/shapes/spec-examples/support/spec-example-utils.js: Added.
+ (.runTest):
+ (approxShapeTest):
+ * css3/shapes/spec-examples/support/w3c-import.log:
+ * css3/shapes/spec-examples/w3c-import.log:
+
</ins><span class="cx"> 2014-11-06 Dean Jackson <dino@apple.com>
</span><span class="cx">
</span><span class="cx"> [filters2] Support for backdrop-filter
</span></span></pre></div>
<a id="trunkLayoutTestsTestExpectations"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/TestExpectations (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/TestExpectations 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/TestExpectations 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -137,17 +137,6 @@
</span><span class="cx"> webkit.org/b/135923 css3/shapes/shape-outside/shape-image/gradients/shape-outside-radial-gradient-003.html [ ImageOnlyFailure ]
</span><span class="cx"> webkit.org/b/135923 css3/shapes/shape-outside/shape-image/gradients/shape-outside-radial-gradient-004.html [ ImageOnlyFailure ]
</span><span class="cx">
</span><del>-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-010.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-011.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-012.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-013.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-014.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-015.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-016.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-017.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-018.html [ ImageOnlyFailure ]
-webkit.org/b/135927 css3/shapes/spec-examples/shape-outside-019.html [ ImageOnlyFailure ]
-
</del><span class="cx"> webkit.org/b/137788 css3/shapes/shape-outside/shape-image/shape-image-010.html [ ImageOnlyFailure ]
</span><span class="cx"> webkit.org/b/137788 css3/shapes/shape-outside/shape-image/shape-image-024.html [ ImageOnlyFailure ]
</span><span class="cx">
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside010expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,44 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 300px;
- }
- #content {
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #image { float: left; }
- #line-1 { margin-left: 182px; }
- #line-2 { margin-left: 199px; }
- #line-3 { margin-left: 201px; }
- #line-4 { margin-left: 199px; }
- #line-5 { margin-left: 182px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the circle,
- the long green bar is beneath the circle, and no bars intersect the circle. There
- should be no red.
- </p>
- <div class="container">
- <img id="image" src="support/circle-no-shadow.png"/>
- </div>
- <div id="content" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside010expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the circle, the long green bar is beneath the circle, and no bars intersect the circle. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from image - url(), alpha channel, opacity 0
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside010html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-010.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,19 +3,17 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from image - url(), alpha channel, opacity 0</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-010-ref.html"/>
- <meta name="flags" content="ahem"/>
- <meta name="assert" content="This test verifies that the content flows around the
</del><ins>+ <meta name="flags" content="ahem dom"/>
+ <meta name="assert" content="This test verifies that the content flows around the
</ins><span class="cx"> shape defined in the images alpha channel that is completely
</span><span class="cx"> transparent."/>
</span><span class="cx"> <!-- This test is derived from Example 7 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><span class="cx"> .container {
</span><del>- position: absolute;
- top: 70px;
</del><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="lines">@@ -28,33 +26,29 @@
</span><span class="cx"> float: left;
</span><span class="cx"> -webkit-shape-outside: url("support/circle-no-shadow.png");
</span><span class="cx"> }
</span><del>- #failure {
- width: 300px;
- color: red;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 182px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 201px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the short green horizontal bars are the right of the circle,
</span><span class="cx"> the long green bar is beneath the circle, and no bars intersect the circle. There
</span><span class="cx"> should be no red.
</span><del>- </p>
</del><ins>+ </p>
</ins><span class="cx"> <div id="test" class="container">
</span><span class="cx"> <img id="image" src="support/circle-no-shadow.png"/>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [182, 199, 201, 199, 182, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside011expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,44 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 300px;
- }
- #content {
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #image { float: left; }
- #line-1 { margin-left: 218px; }
- #line-2 { margin-left: 236px; }
- #line-3 { margin-left: 238px; }
- #line-4 { margin-left: 236px; }
- #line-5 { margin-left: 218px; }
- #line-6 { margin-left: 160px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the green horizontal bars are to the right of the circle,
- and no bars intersect the circle's shadow. There should be no red.
- </p>
- <div class="container">
- <img id="image" src="support/circle-shadow.png"/>
- </div>
- <div id="content" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- <div id="line-6">XXXXXX</div>
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside011expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the green horizontal bars are to the right of the circle, and no bars intersect the circle's shadow. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX
+
+PASS CSS Test: Shape from image - url(), alpha channel, opacity > 0
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside011html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-011.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,19 +3,17 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from image - url(), alpha channel, opacity > 0</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-011-ref.html"/>
- <meta name="flags" content="ahem"/>
- <meta name="assert" content="This test verifies that the content flows around the
</del><ins>+ <meta name="flags" content="ahem dom"/>
+ <meta name="assert" content="This test verifies that the content flows around the
</ins><span class="cx"> shape defined in the images alpha channel that has some
</span><span class="cx"> opacity."/>
</span><span class="cx"> <!-- This test is derived from Example 7 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><span class="cx"> .container {
</span><del>- position: absolute;
- top: 70px;
</del><span class="cx"> width: 400px;
</span><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="lines">@@ -28,33 +26,28 @@
</span><span class="cx"> float: left;
</span><span class="cx"> -webkit-shape-outside: url("support/circle-shadow.png");
</span><span class="cx"> }
</span><del>- #failure {
- width: 300px;
- color: red;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 218px; }
- #line-2, #line-4 { margin-left: 236px; }
- #line-3 { margin-left: 238px; }
- #line-6 { margin-left: 160px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the green horizontal bars are to the right of the circle,
</span><span class="cx"> and no bars intersect the circle's shadow. There should be no red.
</span><del>- </p>
</del><ins>+ </p>
</ins><span class="cx"> <div id="test" class="container">
</span><span class="cx"> <img id="image" src="support/circle-shadow.png"/>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><span class="cx"> <span id="line-5">XXXXXX</span>
</span><del>- <div id="line-6">XXXXXX</div>
</del><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [218, 236, 238, 236, 218, 160]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside012expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,44 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 300px;
- }
- #content {
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #image { float: left; }
- #line-1 { margin-left: 181px; }
- #line-2 { margin-left: 199px; }
- #line-3 { margin-left: 201px; }
- #line-4 { margin-left: 199px; }
- #line-5 { margin-left: 181px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the circle, all
- intersect the shadow, none intersect the circle and the long green bar is beneath the
- circle. There should be no red.
- </p>
- <div class="container">
- <img id="image" src="support/circle-shadow.png"/>
- </div>
- <div id="content" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside012expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the circle, all intersect the shadow, none intersect the circle and the long green bar is beneath the circle. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from image - shape-image-threshold - 0.9
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside012html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-012.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,22 +3,20 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from image - shape-image-threshold - 0.9</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-image-threshold-property"/>
</span><span class="cx"> <link rel="match" href="reference/shape-outside-012-ref.html"/>
</span><del>- <meta name="flags" content="ahem"/>
- <meta name="assert" content="This test verifies content flows around a shape that is
- defined in the image's alpha channel and adjusted by the
</del><ins>+ <meta name="flags" content="ahem dom"/>
+ <meta name="assert" content="This test verifies content flows around a shape that is
+ defined in the image's alpha channel and adjusted by the
</ins><span class="cx"> image-threshold" />
</span><span class="cx"> <!-- This test is derived from Example 7 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><span class="cx"> .container {
</span><del>- position: absolute;
- top: 70px;
</del><span class="cx"> width: 400px;
</span><del>- height: 105px;
</del><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="lines">@@ -31,33 +29,29 @@
</span><span class="cx"> -webkit-shape-outside: url("support/circle-shadow.png");
</span><span class="cx"> -webkit-shape-image-threshold: 0.9;
</span><span class="cx"> }
</span><del>- #failure {
- width: 300px;
- color: red;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 181px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 201px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><del>- The test passes if the short green horizontal bars are the right of the circle, all
- intersect the shadow, none intersect the circle and the long green bar is beneath the
</del><ins>+ The test passes if the short green horizontal bars are the right of the circle, all
+ intersect the shadow, none intersect the circle and the long green bar is beneath the
</ins><span class="cx"> circle. There should be no red.
</span><span class="cx"> </p>
</span><span class="cx"> <div id="test" class="container">
</span><span class="cx"> <img id="test-image" src="support/circle-shadow.png"/>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [181, 199, 201, 199, 181, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside013expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,57 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 85px;
- left: 25px;
- width: 300px;
- }
- #content {
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #margin-circle {
- position: absolute;
- top: 70px;
- left: 10px;
- width: 230px;
- height: 230px;
- background-color: blue;
- border-radius: 150px;
- }
- #image { float: left; }
- #line-1 { margin-left: 200px; }
- #line-2 { margin-left: 214px; }
- #line-3 { margin-left: 216px; }
- #line-4 { margin-left: 214px; }
- #line-5 { margin-left: 200px; }
- #line-6 { margin-left: 158px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the circle,
- the long green bar is beneath the circle, and no bars intersect the circle. There
- should be no red.
- </p>
- <div id="margin-circle"></div>
- <div class="container">
- <img id="image" src="support/circle-no-shadow.png"/>
- </div>
- <div id="content" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- <span id="line-6">XXXXXX</span>
- XXXXXXXXXXXXX
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside013expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the circle, the long green bar is beneath the circle, and no bars intersect the circle. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXX
+
+PASS CSS Test: Shape from image - shape-margin
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside013html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-013.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,27 +3,23 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from image - shape-margin</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-013-ref.html"/>
- <meta name="flags" content="ahem"/>
- <meta name="assert" content="This test verifies that the content flows around the
- shape defined in the images alpha channel and adjusted by
</del><ins>+ <meta name="flags" content="ahem dom"/>
+ <meta name="assert" content="This test verifies that the content flows around the
+ shape defined in the images alpha channel and adjusted by
</ins><span class="cx"> the shape-margin."/>
</span><span class="cx"> <!-- This test is derived from Example 7 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 85px;
- left: 25px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- }
</del><span class="cx"> #test {
</span><ins>+ position: relative;
</ins><span class="cx"> width: 400px;
</span><span class="cx"> color: green;
</span><ins>+ font-family: Ahem;
+ font-size: 20px;
+ line-height: 2em;
</ins><span class="cx"> }
</span><span class="cx"> #test-image {
</span><span class="cx"> float: left;
</span><span class="lines">@@ -32,23 +28,18 @@
</span><span class="cx"> }
</span><span class="cx"> #margin-circle {
</span><span class="cx"> position: absolute;
</span><del>- top: 70px;
- left: 10px;
</del><ins>+ top: -15px;
+ left: -15px;
</ins><span class="cx"> width: 230px;
</span><span class="cx"> height: 230px;
</span><span class="cx"> background-color: blue;
</span><span class="cx"> border-radius: 150px;
</span><del>- }
- #failure {
- width: 300px;
- color: red;
</del><span class="cx"> z-index: -1;
</span><span class="cx"> }
</span><del>- #line-1, #line-5 { margin-left: 200px; }
- #line-2, #line-4 { margin-left: 214px; }
- #line-3 { margin-left: 216px; }
- #line-6 { margin-left: 158px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="lines">@@ -56,19 +47,20 @@
</span><span class="cx"> the long green bar is beneath the circle, and no bars intersect the circle. There
</span><span class="cx"> should be no red.
</span><span class="cx"> </p>
</span><del>- <div id="margin-circle"></div>
- <div id="test" class="container">
</del><ins>+ <div id="test">
</ins><span class="cx"> <img id="test-image" src="support/circle-no-shadow.png"/>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <div id="margin-circle"></div>
+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><span class="cx"> <span id="line-5">XXXXXX</span>
</span><del>- <span id="line-6">XXXXXX</span>
- XXXXXXXXXXXXX
</del><ins>+ <span id="line-6">XXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [200, 214, 216, 214, 200, 158, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside014expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,45 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #shape {
- width: 160px;
- height: 160px;
- background-color: lightblue;
- border: 20px solid lightblue;
- border-radius: 90px;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 180px; }
- #line-2, #line-4 { margin-left: 198px; }
- #line-3 { margin-left: 200px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the shape,
- the long green bar is beneath it, and no bars intersect it. There should be no red.
- </p>
- <div id="shape" class="container"></div>
- <div id="lines" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside014expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the shape, the long green bar is beneath it, and no bars intersect it. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from box value - margin-box
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside014html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-014.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,26 +3,23 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from box value - margin-box</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-014-ref.html"/>
- <meta name="flags" content="ahem"/>
</del><ins>+ <meta name="flags" content="ahem dom"/>
</ins><span class="cx"> <meta name="assert" content="This test verifies that content wraps around a shape
</span><span class="cx"> defined by its margin box."/>
</span><span class="cx"> <!-- This test is derived from Examples 8 and 9 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
</del><ins>+ #test {
+ color: green;
+ position: relative;
</ins><span class="cx"> width: 400px;
</span><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="cx"> }
</span><del>- #test {
- color: green;
- }
</del><span class="cx"> #box {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 120px;
</span><span class="lines">@@ -33,6 +30,9 @@
</span><span class="cx"> -webkit-shape-outside: margin-box;
</span><span class="cx"> }
</span><span class="cx"> #border-shape {
</span><ins>+ position: absolute;
+ top: 0px;
+ left: 0px;
</ins><span class="cx"> width: 160px;
</span><span class="cx"> height: 160px;
</span><span class="cx"> background-color: lightblue;
</span><span class="lines">@@ -40,15 +40,10 @@
</span><span class="cx"> border-radius: 90px;
</span><span class="cx"> z-index: -1;
</span><span class="cx"> }
</span><del>- #failure {
- color: red;
- z-index: -2;
- }
- #line-1, #line-5 { margin-left: 180px; }
- #line-2, #line-4 { margin-left: 198px; }
- #line-3 { margin-left: 200px; }
-
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="lines">@@ -57,16 +52,17 @@
</span><span class="cx"> </p>
</span><span class="cx"> <div id="test" class="container">
</span><span class="cx"> <div id="box"></div>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="border-shape" class="container"></div>
- <div id="failure" class="container">
</del><ins>+ <div id="border-shape"></div>
+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 3, [182, 198, 200, 198, 182, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside015expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,45 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #shape {
- width: 160px;
- height: 160px;
- background-color: lightblue;
- border: 20px solid lightblue;
- border-radius: 90px;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the shape,
- the long green bar is beneath it, and no bars intersect it. There should be no red.
- </p>
- <div id="shape" class="container"></div>
- <div id="lines" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside015expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the shape, the long green bar is beneath it, and no bars intersect it. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from box value - border-box
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside015html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-015.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,26 +3,22 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from box value - border-box</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-015-ref.html"/>
- <meta name="flags" content="ahem"/>
</del><ins>+ <meta name="flags" content="ahem dom"/>
</ins><span class="cx"> <meta name="assert" content="This test verifies that content wraps around a shape
</span><span class="cx"> defined by its border box."/>
</span><span class="cx"> <!-- This test is derived from Examples 8 and 9 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
</del><ins>+ #test {
</ins><span class="cx"> width: 400px;
</span><ins>+ color: green;
</ins><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="cx"> }
</span><del>- #test {
- color: green;
- }
</del><span class="cx"> #box {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 120px;
</span><span class="lines">@@ -32,32 +28,28 @@
</span><span class="cx"> border-radius: 90px;
</span><span class="cx"> -webkit-shape-outside: border-box;
</span><span class="cx"> }
</span><del>- #failure {
- color: red;
- z-index: -2;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
-
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the short green horizontal bars are the right of the shape,
</span><span class="cx"> the long green bar is beneath it, and no bars intersect it. There should be no red.
</span><span class="cx"> </p>
</span><del>- <div id="test" class="container">
</del><ins>+ <div id="test">
</ins><span class="cx"> <div id="box"></div>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [185, 199, 200, 199, 185, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside016expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,45 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #shape {
- width: 160px;
- height: 160px;
- background-color: lightblue;
- border: 20px solid lightblue;
- border-radius: 90px;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the shape,
- the long green bar is beneath it, and no bars intersect it. There should be no red.
- </p>
- <div id="shape" class="container"></div>
- <div id="lines" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside016expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the shape, the long green bar is beneath it, and no bars intersect it. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from box value - padding-box
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside016html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-016.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,26 +3,22 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from box value - padding-box</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-015-ref.html"/>
- <meta name="flags" content="ahem"/>
</del><ins>+ <meta name="flags" content="ahem dom"/>
</ins><span class="cx"> <meta name="assert" content="This test verifies that content wraps around a shape
</span><span class="cx"> defined by its padding box."/>
</span><span class="cx"> <!-- This test is derived from Examples 8 and 9 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
</del><ins>+ #test {
+ color: green;
</ins><span class="cx"> width: 400px;
</span><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="cx"> }
</span><del>- #test {
- color: green;
- }
</del><span class="cx"> #box {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 120px;
</span><span class="lines">@@ -32,31 +28,28 @@
</span><span class="cx"> border-radius: 90px;
</span><span class="cx"> -webkit-shape-outside: padding-box;
</span><span class="cx"> }
</span><del>- #failure {
- color: red;
- z-index: -2;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the short green horizontal bars are the right of the shape,
</span><span class="cx"> the long green bar is beneath it, and no bars intersect it. There should be no red.
</span><span class="cx"> </p>
</span><del>- <div id="test" class="container">
</del><ins>+ <div id="test">
</ins><span class="cx"> <div id="box"></div>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [185, 199, 200, 199, 185, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside017expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,45 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #shape {
- width: 160px;
- height: 160px;
- background-color: lightblue;
- border: 20px solid lightblue;
- border-radius: 90px;
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the shape,
- the long green bar is beneath it, and no bars intersect it. There should be no red.
- </p>
- <div id="shape" class="container"></div>
- <div id="lines" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
- </div>
-
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside017expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the shape, the long green bar is beneath it, and no bars intersect it. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from box value - content-box
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside017html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-017.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,26 +3,22 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from box value - content-box</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-015-ref.html"/>
- <meta name="flags" content="ahem"/>
</del><ins>+ <meta name="flags" content="ahem dom"/>
</ins><span class="cx"> <meta name="assert" content="This test verifies that content wraps around a shape
</span><span class="cx"> defined by its content box."/>
</span><span class="cx"> <!-- This test is derived from Examples 8 and 9 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
</del><ins>+ #test {
+ color: green;
</ins><span class="cx"> width: 400px;
</span><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="cx"> }
</span><del>- #test {
- color: green;
- }
</del><span class="cx"> #box {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 200px;
</span><span class="lines">@@ -31,32 +27,28 @@
</span><span class="cx"> border-radius: 90px;
</span><span class="cx"> -webkit-shape-outside: content-box;
</span><span class="cx"> }
</span><del>- #failure {
- color: red;
- z-index: -2;
- }
- #line-1, #line-5 { margin-left: 185px; }
- #line-2, #line-4 { margin-left: 199px; }
- #line-3 { margin-left: 200px; }
-
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the short green horizontal bars are the right of the shape,
</span><span class="cx"> the long green bar is beneath it, and no bars intersect it. There should be no red.
</span><span class="cx"> </p>
</span><del>- <div id="test" class="container">
</del><ins>+ <div id="test">
</ins><span class="cx"> <div id="box"></div>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="failure" class="container">
</del><ins>+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><del>- <span id="line-5">XXXXXX</span>
- XXXXXXXXXXXXXXX
</del><ins>+ <span id="line-5">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [185, 199, 200, 199, 185, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside018expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,42 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- img {
- position: absolute;
- top: 70px;
- }
- #line-1 { margin-left: 48px; }
- #line-2 { margin-left: 88px; }
- #line-3 { margin-left: 128px; }
- #line-4 { margin-left: 168px; }
- #line-5 { margin-left: 180px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the longest green horizontal bar is beneath the triangle and the
- rest of them are to its right and none intersect it. There should be no red.
- </p>
- <img src="support/rounded-triangle.svg">
- <div id="lines" class="container">
- <span id="line-1">XXXXXXXXXX</span>
- <span id="line-2">XXXXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXX</span>
- <span id="line-5">XXX</span>
- XXXXXXXXXXXX
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside018expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the longest green horizontal bar is beneath the triangle and the rest of them are to its right and none intersect it. There should be no red.
+
+XXXXXXXXXX XXXXXXXX XXXXXX XXXX XXX XXXXXXXXXXXX
+
+PASS CSS Test: shape-margin offset from a polygonal shape-outside
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside018html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-018.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,26 +3,23 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: shape-margin offset from a polygonal shape-outside</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-018-ref.html"/>
- <meta name="flags" content="ahem"/>
</del><ins>+ <meta name="flags" content="ahem dom"/>
</ins><span class="cx"> <meta name="assert" content="This test verifies that that content flows around the shape-margin
</span><span class="cx"> defined on a polygonal shape-outside."/>
</span><span class="cx"> <!-- This test is derived from Example 10 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
</del><ins>+ #test {
+ position: relative;
+ color: green;
</ins><span class="cx"> width: 300px;
</span><span class="cx"> font-family: Ahem;
</span><span class="cx"> font-size: 20px;
</span><span class="cx"> line-height: 2em;
</span><span class="cx"> }
</span><del>- #test {
- color: green;
- }
</del><span class="cx"> #shape-box {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 200px;
</span><span class="lines">@@ -32,37 +29,33 @@
</span><span class="cx"> }
</span><span class="cx"> img {
</span><span class="cx"> position: absolute;
</span><del>- top: 70px;
</del><ins>+ top: 0px;
+ left: 0px;
</ins><span class="cx"> z-index: -1;
</span><span class="cx"> }
</span><del>- #failure {
- color: red;
- z-index: -2;
- }
- #line-1 { margin-left: 48px; }
- #line-2 { margin-left: 88px; }
- #line-3 { margin-left: 128px; }
- #line-4 { margin-left: 168px; }
- #line-5 { margin-left: 180px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><del>- The test passes if the longest green horizontal bar is beneath the triangle and the
</del><ins>+ The test passes if the longest green horizontal bar is beneath the triangle and the
</ins><span class="cx"> rest of them are to its right and none intersect it. There should be no red.
</span><span class="cx"> </p>
</span><del>- <div id="test" class="container">
</del><ins>+ <div id="test">
</ins><span class="cx"> <div id="shape-box"></div>
</span><del>- XXXXXXXXXX XXXXXXXX XXXXXX XXXX XXX XXXXXXXXXXXX
</del><ins>+ <img src="support/rounded-triangle.svg">
+ <span id="line-0">XXXXXXXXXX</span>
+ <span id="line-1">XXXXXXXX</span>
+ <span id="line-2">XXXXXX</span>
+ <span id="line-3">XXXX</span>
+ <span id="line-4">XXX</span>
+ <span id="line-5">XXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><del>- <img src="support/rounded-triangle.svg">
- <div id="failure" class="container">
- <span id="line-1">XXXXXXXXXX</span>
- <span id="line-2">XXXXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXX</span>
- <span id="line-5">XXX</span>
- XXXXXXXXXXXX
- </div>
</del><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [48, 88, 128, 168, 180, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside019expectedhtml"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -1,57 +0,0 @@
</span><del>-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reference File</title>
- <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
- <style type="text/css">
- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- color: green;
- }
- #image {
- float: left;
- -webkit-shape-outside: url("support/circle-shadow.png");
- -webkit-shape-margin: 20px;
- }
- #margin-circle {
- position: absolute;
- top: 70px;
- left: 10px;
- width: 300px;
- height: 300px;
- background-color: black;
- -webkit-clip-path: ellipse(115px 100px at 140px 100px);
- z-index: -1;
- }
- #line-1, #line-5 { margin-left: 242px; }
- #line-2, #line-4 { margin-left: 256px; }
- #line-3 { margin-left: 258px; }
- #line-6 { margin-left: 204px; }
- </style>
-</head>
-<body>
- <p>
- The test passes if the short green horizontal bars are the right of the black edge
- of circle, the long green bar is beneath it, and no bars intersect the black.
- There should be no red.
- </p>
- <div class="container">
- <img id="image" src="support/circle-shadow.png"/>
- </div>
- <div id="margin-circle"></div>
- <div id="content" class="container">
- <span id="line-1">XXXXXX</span>
- <span id="line-2">XXXXXX</span>
- <span id="line-3">XXXXXX</span>
- <span id="line-4">XXXXXX</span>
- <span id="line-5">XXXXXX</span>
- <span id="line-6">XXXXXX</span>
- <div id="line-7">XXXXXXXXXXXXXXX</div>
- </div>
-</body>
-</html>
</del><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside019expectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.txt (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.txt 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+The test passes if the short green horizontal bars are the right of the black edge of circle, the long green bar is beneath it, and no bars intersect the black. There should be no red.
+
+XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
+
+PASS CSS Test: Shape from image - alpha channel, opacity > 0 + shape-margin
+
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesshapeoutside019html"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019.html (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019.html 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/shape-outside-019.html 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -3,25 +3,22 @@
</span><span class="cx"> <head>
</span><span class="cx"> <title>CSS Test: Shape from image - alpha channel, opacity > 0 + shape-margin</title>
</span><span class="cx"> <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"/>
</span><ins>+ <link rel="author" title="Bem Jones-Bey" href="mailto:bemjb@adobe.com"/>
</ins><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
</span><span class="cx"> <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
</span><del>- <link rel="match" href="reference/shape-outside-019-ref.html"/>
- <meta name="flags" content="ahem"/>
- <meta name="assert" content="This test verifies that the content flows around the
</del><ins>+ <meta name="flags" content="ahem dom"/>
+ <meta name="assert" content="This test verifies that the content flows around the
</ins><span class="cx"> shape defined in the images alpha channel and the shape-margin."/>
</span><span class="cx"> <!-- This test is derived from Example 11 in this version of the spec:
</span><span class="cx"> http://www.w3.org/TR/2014/WD-css-shapes-1-20140211/ -->
</span><span class="cx"> <style type="text/css">
</span><del>- .container {
- position: absolute;
- top: 70px;
- width: 400px;
- font-family: Ahem;
- font-size: 20px;
- line-height: 2em;
- }
</del><span class="cx"> #test {
</span><ins>+ position: relative;
</ins><span class="cx"> color: green;
</span><ins>+ width: 400px;
+ font-family: Ahem;
+ font-size: 20px;
+ line-height: 2em;
</ins><span class="cx"> }
</span><span class="cx"> #image {
</span><span class="cx"> float: left;
</span><span class="lines">@@ -30,44 +27,39 @@
</span><span class="cx"> }
</span><span class="cx"> #margin-circle {
</span><span class="cx"> position: absolute;
</span><del>- top: 70px;
- left: 10px;
</del><ins>+ top: 0px;
+ left: 0px;
</ins><span class="cx"> width: 300px;
</span><span class="cx"> height: 300px;
</span><span class="cx"> background-color: black;
</span><del>- -webkit-clip-path: ellipse(115px 100px at 140px 100px);
</del><ins>+ -webkit-clip-path: ellipse(141px 127px at 115px 100px);
</ins><span class="cx"> z-index: -1;
</span><span class="cx"> }
</span><del>- #failure {
- width: 300px;
- color: red;
- z-index: -2;
- }
- #line-1, #line-5 { margin-left: 242px; }
- #line-2, #line-4 { margin-left: 256px; }
- #line-3 { margin-left: 258px; }
- #line-6 { margin-left: 204px; }
</del><span class="cx"> </style>
</span><ins>+ <script src="../../../resources/testharness.js"></script>
+ <script src="../../../resources/testharnessreport.js"></script>
+ <script src="support/spec-example-utils.js"></script>
</ins><span class="cx"> </head>
</span><span class="cx"> <body>
</span><span class="cx"> <p>
</span><span class="cx"> The test passes if the short green horizontal bars are the right of the black edge
</span><span class="cx"> of circle, the long green bar is beneath it, and no bars intersect the black.
</span><span class="cx"> There should be no red.
</span><del>- </p>
- <div id="test" class="container">
</del><ins>+ </p>
+ <div id="test">
</ins><span class="cx"> <img id="image" src="support/circle-shadow.png"/>
</span><del>- XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXX XXXXXXXXXXXXXXX
- </div>
- <div id="margin-circle"></div>
- <div id="failure" class="container">
</del><ins>+ <div id="margin-circle"></div>
+ <span id="line-0">XXXXXX</span>
</ins><span class="cx"> <span id="line-1">XXXXXX</span>
</span><span class="cx"> <span id="line-2">XXXXXX</span>
</span><span class="cx"> <span id="line-3">XXXXXX</span>
</span><span class="cx"> <span id="line-4">XXXXXX</span>
</span><span class="cx"> <span id="line-5">XXXXXX</span>
</span><del>- <span id="line-6">XXXXXX</span>
- <div id="line-7">XXXXXXXXXXXXXXX</div>
</del><ins>+ <span id="line-6">XXXXXXXXXXXXXXX</span>
</ins><span class="cx"> </div>
</span><ins>+ <div id="log"></div>
+ <script>
+ approxShapeTest('test', 'line-', 2, [242, 256, 258, 256, 242, 204, 0]);
+ </script>
</ins><span class="cx"> </body>
</span><del>-</html>
</del><span class="cx">\ No newline at end of file
</span><ins>+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplessupportspecexampleutilsjs"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/css3/shapes/spec-examples/support/spec-example-utils.js (0 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/support/spec-example-utils.js (rev 0)
+++ trunk/LayoutTests/css3/shapes/spec-examples/support/spec-example-utils.js 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -0,0 +1,21 @@
</span><ins>+function approxShapeTest(testId, linePrefix, epsilon, lineOffsets) {
+ var isPositioned = { 'relative': true, 'fixed': true, 'absolute': true, 'sticky': true },
+ testDiv = document.getElementById(testId),
+ testOffset = isPositioned[getComputedStyle(testDiv).position] ? 0 : testDiv.offsetLeft,
+ firstLine = document.getElementById(linePrefix + '0');
+
+ function runTest() {
+ if (firstLine.offsetLeft == testOffset) {
+ // wait for the shape image to load and layout to happen
+ window.setTimeout(runTest, 5);
+ return;
+ }
+
+ for (var i = 0; i < lineOffsets.length; i++) {
+ var line = document.getElementById(linePrefix + i);
+ assert_approx_equals(line.offsetLeft, lineOffsets[i] + testOffset, epsilon, 'Line ' + i + ' is positioned properly');
+ }
+ done();
+ }
+ runTest();
+}
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplessupportw3cimportlog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/support/w3c-import.log (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/support/w3c-import.log 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/support/w3c-import.log 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -10,7 +10,7 @@
</span><span class="cx"> Do NOT modify or remove this file
</span><span class="cx">
</span><span class="cx"> ------------------------------------------------------------------------
</span><del>-Last Import: 2014-10-27 11:23
</del><ins>+Last Import: 2014-11-06 09:44
</ins><span class="cx"> ------------------------------------------------------------------------
</span><span class="cx"> Properties requiring vendor prefixes:
</span><span class="cx"> None
</span><span class="lines">@@ -18,6 +18,7 @@
</span><span class="cx"> None
</span><span class="cx"> ------------------------------------------------------------------------
</span><span class="cx"> List of files:
</span><del>-/LayoutTests/css3/shapes/spec-examples/support/circle-no-shadow.png
-/LayoutTests/css3/shapes/spec-examples/support/circle-shadow.png
-/LayoutTests/css3/shapes/spec-examples/support/rounded-triangle.svg
</del><ins>+/LayoutTests/w3c/css-shapes-1/spec-examples/support/circle-no-shadow.png
+/LayoutTests/w3c/css-shapes-1/spec-examples/support/circle-shadow.png
+/LayoutTests/w3c/css-shapes-1/spec-examples/support/rounded-triangle.svg
+/LayoutTests/w3c/css-shapes-1/spec-examples/support/spec-example-utils.js
</ins></span></pre></div>
<a id="trunkLayoutTestscss3shapesspecexamplesw3cimportlog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/shapes/spec-examples/w3c-import.log (175720 => 175721)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/shapes/spec-examples/w3c-import.log 2014-11-06 23:17:32 UTC (rev 175720)
+++ trunk/LayoutTests/css3/shapes/spec-examples/w3c-import.log 2014-11-06 23:20:53 UTC (rev 175721)
</span><span class="lines">@@ -10,7 +10,7 @@
</span><span class="cx"> Do NOT modify or remove this file
</span><span class="cx">
</span><span class="cx"> ------------------------------------------------------------------------
</span><del>-Last Import: 2014-10-27 11:23
</del><ins>+Last Import: 2014-11-06 09:44
</ins><span class="cx"> ------------------------------------------------------------------------
</span><span class="cx"> Properties requiring vendor prefixes:
</span><span class="cx"> clip-path
</span><span class="lines">@@ -21,39 +21,29 @@
</span><span class="cx"> None
</span><span class="cx"> ------------------------------------------------------------------------
</span><span class="cx"> List of files:
</span><del>-/LayoutTests/css3/shapes/spec-examples/shape-outside-001-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-001.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-002-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-002.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-003-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-003.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-004-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-004.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-005-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-005.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-006-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-006.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-007-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-007.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-008-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-008.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-010-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-010.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-011-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-011.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-012-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-012.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-013-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-013.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-014-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-014.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-015-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-015.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-016-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-016.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-017-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-017.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-018-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-018.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-019-expected.html
-/LayoutTests/css3/shapes/spec-examples/shape-outside-019.html
</del><ins>+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-001-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-001.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-002-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-002.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-003-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-003.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-004-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-004.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-005-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-005.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-006-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-006.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-007-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-007.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-008-expected.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-008.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-010.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-011.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-012.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-013.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-014.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-015.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-016.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-017.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-018.html
+/LayoutTests/w3c/css-shapes-1/spec-examples/shape-outside-019.html
</ins></span></pre>
</div>
</div>
</body>
</html>