[CSS Shapes] New positioning model: support for shape-margin
authorbjonesbe@adobe.com <bjonesbe@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Aug 2013 18:53:06 +0000 (18:53 +0000)
committerbjonesbe@adobe.com <bjonesbe@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Aug 2013 18:53:06 +0000 (18:53 +0000)
https://bugs.webkit.org/show_bug.cgi?id=118088

Reviewed by Alexandru Chiculita.

Update simple shape-margin tests to work with new positioning model.
Also move them to the CSSWG's repo.

* TestExpectations: Remove replaced tests.
* csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000-expected.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon-expected.html.
* csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon.html.
* csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001-expected.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon-expected.html.
* csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon.html.

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

LayoutTests/ChangeLog
LayoutTests/TestExpectations
LayoutTests/csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000-expected.html [moved from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon-expected.html with 70% similarity]
LayoutTests/csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000.html [moved from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon.html with 58% similarity]
LayoutTests/csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001-expected.html [moved from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon-expected.html with 69% similarity]
LayoutTests/csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001.html [moved from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon.html with 58% similarity]

index edd6794..3437f37 100644 (file)
@@ -1,3 +1,19 @@
+2013-08-06  Bem Jones-Bey  <bjonesbe@adobe.com>
+
+        [CSS Shapes] New positioning model: support for shape-margin
+        https://bugs.webkit.org/show_bug.cgi?id=118088
+
+        Reviewed by Alexandru Chiculita.
+
+        Update simple shape-margin tests to work with new positioning model.
+        Also move them to the CSSWG's repo.
+
+        * TestExpectations: Remove replaced tests.
+        * csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000-expected.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon-expected.html.
+        * csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-000.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon.html.
+        * csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001-expected.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon-expected.html.
+        * csswg/submitted/shapes/shape-outside/shape-outside-floats-shape-margin-001.html: Renamed from LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon.html.
+
 2013-08-05  Rob Buis  <rwlbuis@webkit.org>
 
         SVG stroke-dasharray is not animatable
index 7cd7b94..0b79583 100644 (file)
@@ -34,12 +34,10 @@ webkit.org/b/119325 dom/xhtml/level3/core/nodecomparedocumentposition38.xhtml [
 # The CSS Shapes spec has changed the positioning model for floats with shape-outside.
 # Thus all of the tests need to be rewitten to work as the implementation of
 # the new model is completed.
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-diamond-margin-polygon.html [ Skip ]
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-bottom.html [ Skip ]
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-left.html [ Skip ]
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-right.html [ Skip ]
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-left-margin-polygon.html [ Skip ]
-webkit.org/b/118088 fast/shapes/shape-outside-floats/shape-outside-floats-right-margin-polygon.html [ Skip ]
+webkit.org/b/119491 fast/shapes/shape-outside-floats/shape-outside-floats-diamond-margin-polygon.html [ Skip ]
+webkit.org/b/119491 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-bottom.html [ Skip ]
+webkit.org/b/119491 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-left.html [ Skip ]
+webkit.org/b/119491 fast/shapes/shape-outside-floats/shape-outside-floats-ellipse-margin-right.html [ Skip ]
 
 webkit.org/b/118301 fast/dom/timer-throttling-hidden-page.html [ Skip ]
 
@@ -1,6 +1,9 @@
 <!DOCTYPE html>
-<html>
-<head>
+<title>CSS RefTest Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="author" title="Hans Muller" href="mailto:hmuller@adobe.com">
+<meta name="flags" content="ahem">
 <style>
 #container-border {
     border: 1px solid black; 
@@ -10,6 +13,7 @@
 
 #container {
     font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
     width: 200px;
     height: 300px;
   }
     float: left;
     position: relative;
     overflow: visible;
+    width: 140px;
+    height: 100px;
 }
 
 #svg-shape {
     position: absolute;
     display:block;
-    top: -1px;
-    left: -1px;
+    top: 0px;
+    left: 0px;
     width: 142px;
     height: 102px;
 }
-
-#expected-text {
-    position: relative;
-    top: 0px;
-    left: 140px;
-}
-
 </style>
 
 <body>
 <p>The left edges of the five black squares should follow the right side of the outer rounded rectangle boundary and each square should appear on a subsequent line.</p>
 <div id="container">
     <div id="float-left">
-        <div id="expected-text">X<br/>X<br/>X<br/>X<br/>X</div>
         <svg id="svg-shape" xmlns="http://www.w3.org/2000/">
             <rect x="20" y="20" width="100" height="60" fill="none" stroke="green"></rect>
             <rect x="1" y="1" width="140" height="100" rx="20" ry="20" fill="none" stroke="green"></rect>
         </svg>
     </div>
+    X<br/>X<br/>X<br/>X<br/>X
 </div>
 </body>
-</html>
-
@@ -1,14 +1,16 @@
 <!DOCTYPE html>
-<html>
+<title>CSS Test: square shape-outside on floats</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="author" title="Hans Muller" href="mailto:hmuller@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-shape-margin-000-ref.html">
+<meta name="flags" content="ahem">
 <head>
-<script>
-    if (window.internals)
-        window.internals.settings.setCSSShapesEnabled(true);
-</script>
-
 <style>
 #container {
     font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
     width: 200px;
     height: 300px;
   }
     float: left;
     position: relative;
     overflow: visible;
-    -webkit-shape-outside: polygon(0px 0px, 100px 0px, 100px 60px, 0px 60px);
+    width: 200px;
+    height: 300px;
+    -webkit-shape-outside: polygon(20px 20px, 120px 20px, 120px 80px, 20px 80px);
     -webkit-shape-margin: 20px;
 }
 
 #svg-shape {
     position: absolute;
     display:block;
-    top: -21px;
-    left: -21px;
+    top: 0px;
+    left: 0px;
     width: 142px;
     height: 102px;
 }
@@ -43,5 +47,3 @@
     X<br/>X<br/>X<br/>X<br/>X
 </div>
 </body>
-</html>
-
@@ -1,6 +1,9 @@
 <!DOCTYPE html>
-<html>
-<head>
+<title>CSS RefTest Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="author" title="Hans Muller" href="mailto:hmuller@adobe.com">
+<meta name="flags" content="ahem">
 <style>
 #container-border {
     border: 1px solid black; 
 
 #container {
     font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
     width: 200px;
     height: 300px;
+    text-align: right;
   }
 
 #float-right {
     float: right;
     position: relative;
     overflow: visible;
+    width: 120px;
+    height: 100px;
 }
 
 #svg-shape {
     position: absolute;
     display:block;
-    top: -1px;
-    left: -141px;
+    top: 0px;
+    right: -20px;
     width: 142px;
     height: 102px;
 }
-
-#expected-text {
-    position: absolute;
-    top: 0px;
-    left: -160px;
-}
-
 </style>
 
 <body>
 <p>The right edges of the five black squares should follow the left side of the outer rounded rectangle boundary and each square should appear on a subsequent line.</p>
 <div id="container">
     <div id="float-right">
-        <div id="expected-text">X<br/>X<br/>X<br/>X<br/>X</div>
         <svg id="svg-shape" xmlns="http://www.w3.org/2000/">
             <rect x="20" y="20" width="100" height="60" fill="none" stroke="green"></rect>
             <rect x="1" y="1" width="140" height="100" rx="20" ry="20" fill="none" stroke="green"></rect>
         </svg>
     </div>
+    X<br/>X<br/>X<br/>X<br/>X
 </div>
 </body>
-</html>
-
@@ -1,14 +1,15 @@
 <!DOCTYPE html>
-<html>
-<head>
-<script>
-    if (window.internals)
-        window.internals.settings.setCSSShapesEnabled(true);
-</script>
-
+<title>CSS Test: square shape-outside on floats</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="author" title="Hans Muller" href="mailto:hmuller@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-shape-margin-001-ref.html">
+<meta name="flags" content="ahem">
 <style>
 #container {
     font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
     width: 200px;
     height: 300px;
     text-align: right;
     float: right;
     position: relative;
     overflow: visible;
-    -webkit-shape-outside: polygon(0px 0px, 100px 0px, 100px 60px, 0px 60px);
+    width: 200px;
+    height: 300px;
+    -webkit-shape-outside: polygon(100px 20px, 200px 20px, 200px 80px, 100px 80px);
     -webkit-shape-margin: 20px;
 }
 
 #svg-shape {
     position: absolute;
     display:block;
-    top: -21px;
-    left: -21px;
+    top: 0px;
+    right: -20px;
     width: 142px;
     height: 102px;
 }
@@ -44,5 +47,3 @@
     X<br/>X<br/>X<br/>X<br/>X
 </div>
 </body>
-</html>
-