Bug 1582473 [wpt PR 19161] - SVG Geometry Properties, a=testonly
authorEric Willigers <ewilligers@users.noreply.github.com>
Mon, 23 Sep 2019 12:23:54 +0000
changeset 494683 f870360d6b26323795dfd16f34cb5b236bf02c63
parent 494682 d24d00b719aac4882dc4b23e2a6220cf5d535ca2
child 494684 be8f9407ca9a7242b13154bb99917cdd80417b73
push id114126
push userwptsync@mozilla.com
push dateTue, 24 Sep 2019 19:34:44 +0000
treeherdermozilla-inbound@068d8731f1c4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1582473, 19161
milestone71.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1582473 [wpt PR 19161] - SVG Geometry Properties, a=testonly Automatic update from web-platform-tests SVG Geometry Properties (#19161) Geometry properties may be specified using CSS: cx/cy/r/rx/ry/x/y/width/height Percentages for cx/rx/x/width refer to the viewport width. Percentages for cy/ry/y/height refer to the viewport height. Percentages for r refer to the normalized diagonal. https://svgwg.org/svg2-draft/geometry.html https://svgwg.org/svg2-draft/coords.html#Units -- wpt-commits: 5fb59ff645a8885f41a6b13f783cd8d1a8899e57 wpt-pr: 19161
testing/web-platform/tests/svg/geometry/reftests/circle-001.svg
testing/web-platform/tests/svg/geometry/reftests/circle-002.svg
testing/web-platform/tests/svg/geometry/reftests/circle-003.svg
testing/web-platform/tests/svg/geometry/reftests/circle-004.svg
testing/web-platform/tests/svg/geometry/reftests/circle-ref.svg
testing/web-platform/tests/svg/geometry/reftests/ellipse-001.svg
testing/web-platform/tests/svg/geometry/reftests/ellipse-002.svg
testing/web-platform/tests/svg/geometry/reftests/ellipse-003.svg
testing/web-platform/tests/svg/geometry/reftests/ellipse-004.svg
testing/web-platform/tests/svg/geometry/reftests/ellipse-ref.svg
testing/web-platform/tests/svg/geometry/reftests/rect-001.svg
testing/web-platform/tests/svg/geometry/reftests/rect-002.svg
testing/web-platform/tests/svg/geometry/reftests/rect-003.svg
testing/web-platform/tests/svg/geometry/reftests/rect-004.svg
testing/web-platform/tests/svg/geometry/reftests/rect-ref.svg
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/circle-001.svg
@@ -0,0 +1,16 @@
+<svg width="340" height="140"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Circle coordinates and radius specified by properties</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="circle-ref.svg" />
+  <style>
+    circle {
+      cx: 204px;
+      cy: 56px;
+      r: 65px;
+      fill: blue;
+    }
+  </style>
+  <circle />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/circle-002.svg
@@ -0,0 +1,16 @@
+<svg width="340" height="140" viewBox="60000 70000 3400 1400"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Circle coordinates and radius specified in user units</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="circle-ref.svg" />
+  <style>
+    circle {
+      cx: 62040px;
+      cy: 70560px;
+      r: 650px;
+      fill: blue;
+    }
+  </style>
+  <circle />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/circle-003.svg
@@ -0,0 +1,16 @@
+<svg width="340" height="140"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Circle coordinates and radius specified by percentage</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="circle-ref.svg" />
+  <style>
+    circle {
+      cx: 60%; /* 60% of width 340 */
+      cy: 40%; /* 40% of height 140 */
+      r: 25%; /* 25% of normalized diagonal 260 */
+      fill: blue;
+    }
+  </style>
+  <circle />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/circle-004.svg
@@ -0,0 +1,15 @@
+<svg width="340" height="140"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Circle coordinates and radius specified using calc</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="circle-ref.svg" />
+  <style>
+    circle {
+      fill: blue;
+      font-size: 40px;
+    }
+  </style>
+  <circle cx="calc(80px + 60% - 2em)" cy="calc(80px + 40% - 2em)"
+    r="calc(5 * 5%)" />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/circle-ref.svg
@@ -0,0 +1,4 @@
+<svg width="340" height="140"
+  xmlns="http://www.w3.org/2000/svg">
+  <circle cx="204" cy="56" r="65" fill="blue" />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-001.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Ellipse coordinates and radii specified by properties</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="ellipse-ref.svg" />
+  <style>
+    ellipse {
+      cx: 75px;
+      cy: 120px;
+      rx: 60px;
+      ry: 50px;
+      fill: blue;
+    }
+  </style>
+  <ellipse />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-002.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200" viewBox="6000 7000 600 400"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Ellipse coordinates and radii specified in user units</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="ellipse-ref.svg" />
+  <style>
+    ellipse {
+      cx: 6150px;
+      cy: 7240px;
+      rx: 120px;
+      ry: 100px;
+      fill: blue;
+    }
+  </style>
+  <ellipse />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-003.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Ellipse coordinates and radii specified by percentage</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="ellipse-ref.svg" />
+  <style>
+    ellipse {
+      cx: 25%;
+      cy: 60%;
+      rx: 20%;
+      ry: 25%;
+      fill: blue;
+    }
+  </style>
+  <ellipse />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-004.svg
@@ -0,0 +1,15 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Ellipse coordinates and radii specified using calc</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="ellipse-ref.svg" />
+  <style>
+    ellipse {
+      fill: blue;
+      font-size: 40px;
+    }
+  </style>
+  <ellipse cx="calc(80px + 25% - 2em)" cy="calc(80px + 60% - 2em)"
+    rx="calc(4 * 5%)" ry="calc(5 * 5%)" />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/ellipse-ref.svg
@@ -0,0 +1,4 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg">
+  <ellipse cx="75" cy="120" rx="60" ry="50" fill="blue" />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/rect-001.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Rectangle coordinates and sizes specified by properties</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="rect-ref.svg" />
+  <style>
+    rect {
+      x: 30px;
+      y: 60px;
+      width: 120px;
+      height: 100px;
+      fill: blue;
+    }
+  </style>
+  <rect />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/rect-002.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200" viewBox="600 700 150 100"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Rectangle coordinates and sizes specified in user units</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="rect-ref.svg" />
+  <style>
+    rect {
+      x: 615px;
+      y: 730px;
+      width: 60px;
+      height: 50px;
+      fill: blue;
+    }
+  </style>
+  <rect />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/rect-003.svg
@@ -0,0 +1,17 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Rectangle coordinates and sizes specified by percentage</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="rect-ref.svg" />
+  <style>
+    rect {
+      x: 10%;
+      y: 30%;
+      width: 40%;
+      height: 50%;
+      fill: blue;
+    }
+  </style>
+  <rect />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/rect-004.svg
@@ -0,0 +1,15 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <title>Rectangle coordinates and sizes specified using calc</title>
+  <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/>
+  <html:link rel="match"  href="rect-ref.svg" />
+  <style>
+    rect {
+      fill: blue;
+      font-size: 40px;
+    }
+  </style>
+  <rect x="calc(80px + 10% - 2em)" y="calc(80px + 30% - 2em)"
+    width="calc(8 * 5%)" height="calc(10 * 5%)" />
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/geometry/reftests/rect-ref.svg
@@ -0,0 +1,4 @@
+<svg width="300" height="200"
+  xmlns="http://www.w3.org/2000/svg">
+  <rect x="30" y="60" width="120" height="100" fill="blue" />
+</svg>