From a06e965dfb201acc0ffbdf696f1bb963ccc75cdb Mon Sep 17 00:00:00 2001
From: Robert Longson <longsonr@gmail.com>
Date: Tue, 28 Jun 2022 10:30:49 +0000
Subject: [PATCH] Bug 1762792 - SVG <use> elements should render despite zero
 values in their width and height attributes (unless they're referencing a
 <svg> or <symbol> element) r=emilio

Differential Revision: https://phabricator.services.mozilla.com/D150258
---
 dom/svg/SVGUseElement.cpp              |  4 ++++
 layout/reftests/svg/dynamic-use-03.svg |  4 +++-
 layout/reftests/svg/dynamic-use-04.svg | 14 +++++++-------
 layout/reftests/svg/reftest.list       |  1 +
 layout/reftests/svg/use-01.svg         | 10 +++++++---
 layout/reftests/svg/use-02.svg         | 17 +++++++++++++++++
 6 files changed, 39 insertions(+), 11 deletions(-)
 create mode 100644 layout/reftests/svg/use-02.svg

diff --git a/dom/svg/SVGUseElement.cpp b/dom/svg/SVGUseElement.cpp
index a90cceb4ddc9..25521a5ba857 100644
--- a/dom/svg/SVGUseElement.cpp
+++ b/dom/svg/SVGUseElement.cpp
@@ -577,6 +577,10 @@ gfxMatrix SVGUseElement::PrependLocalTransformsTo(
 
 /* virtual */
 bool SVGUseElement::HasValidDimensions() const {
+  if (!OurWidthAndHeightAreUsed()) {
+    return true;
+  }
+
   return (!mLengthAttributes[ATTR_WIDTH].IsExplicitlySet() ||
           mLengthAttributes[ATTR_WIDTH].GetAnimValInSpecifiedUnits() > 0) &&
          (!mLengthAttributes[ATTR_HEIGHT].IsExplicitlySet() ||
diff --git a/layout/reftests/svg/dynamic-use-03.svg b/layout/reftests/svg/dynamic-use-03.svg
index 345d7b30c8ee..542b7e93559b 100644
--- a/layout/reftests/svg/dynamic-use-03.svg
+++ b/layout/reftests/svg/dynamic-use-03.svg
@@ -6,7 +6,9 @@
      xmlns:xlink="http://www.w3.org/1999/xlink"
      style="background: lime;" class="reftest-wait">
   <defs>
-    <rect fill="red" width="100%" height="100%" id="r"/>
+    <symbol id="r">
+      <rect fill="red" width="100%" height="100%"/>
+    </symbol>
   </defs>
   <use id="u" xlink:href="#r" />
   <script type="text/javascript">
diff --git a/layout/reftests/svg/dynamic-use-04.svg b/layout/reftests/svg/dynamic-use-04.svg
index 71f96472f38c..9fa46322091d 100644
--- a/layout/reftests/svg/dynamic-use-04.svg
+++ b/layout/reftests/svg/dynamic-use-04.svg
@@ -6,7 +6,9 @@
      xmlns:xlink="http://www.w3.org/1999/xlink"
      style="background: red;" class="reftest-wait">
   <defs>
-    <rect fill="lime" width="100%" height="100%" id="r"/>
+    <symbol id="r">
+      <rect fill="lime" width="100%" height="100%"/>
+    </symbol>
   </defs>
   <use id="u" xlink:href="#r" width="0" />
   <script type="text/javascript">
@@ -16,13 +18,11 @@
     setTimeout(doTest, 4000); // fallback for running outside reftest
 
     function doTest() {
-        // Since the <use> does not reference an <svg> or <symbol>, the value
-        // of its 'width' attribute is ignored except to disable/enable its
-        // rendering by setting it to zero/non-zero. Setting it to a non-zero
-        // value here should show the entire referenced <rect>. See
-        // http://www.w3.org/TR/SVG11/struct.html#UseElement
+        // Setting a non-zero value for width here should show the entire
+        // referenced <rect>. See
+        // https://www.w3.org/TR/SVG2/struct.html#UseElement
         var u = document.getElementById("u");
-        u.setAttribute("width", "1");
+        u.setAttribute("width", "100%");
         document.documentElement.removeAttribute('class');
       }
 
diff --git a/layout/reftests/svg/reftest.list b/layout/reftests/svg/reftest.list
index dcd543033e25..e23842be774c 100644
--- a/layout/reftests/svg/reftest.list
+++ b/layout/reftests/svg/reftest.list
@@ -557,6 +557,7 @@ fuzzy(0-1,0-100) == tspan-xy-anchor-end-01.svg tspan-xy-anchor-end-ref.svg
 pref(layout.css.devPixelsPerPx,"1.0") == svg-blurry-with-subpixel-position.html svg-blurry-with-subpixel-position-ref.html
 
 == use-01.svg pass.svg
+== use-02.svg pass.svg
 == use-01-extref.svg pass.svg
 == use-02-extref.svg use-02-extref-ref.svg
 == use-extref-dataURI-01.svg pass.svg
diff --git a/layout/reftests/svg/use-01.svg b/layout/reftests/svg/use-01.svg
index 7daba86253ae..9f92754186ba 100644
--- a/layout/reftests/svg/use-01.svg
+++ b/layout/reftests/svg/use-01.svg
@@ -6,12 +6,16 @@
      xmlns:xlink="http://www.w3.org/1999/xlink">
   <title>Testing that 'use' with zero width/height is not displayed</title>
   <defs>
-    <rect id="red" width="100" height="100" fill="red"/>
-    <rect id="lime" width="100" height="100" fill="lime"/>
+    <symbol id="red">
+      <rect width="100" height="100" fill="red"/>
+    </symbol>
+    <symbol id="lime">
+      <rect width="100" height="100" fill="lime"/>
+    </symbol>
   </defs>
   <rect width="100%" height="100%" fill="lime"/>
   
-  <!-- zero width/height should disable -->
+  <!-- zero width/height pointing at symbol should disable -->
   <use x="0" y="0" width="0" xlink:href="#red"/>
   <use x="150" y="0" height="0" xlink:href="#red"/>
   
diff --git a/layout/reftests/svg/use-02.svg b/layout/reftests/svg/use-02.svg
new file mode 100644
index 000000000000..5ebaed85dc1f
--- /dev/null
+++ b/layout/reftests/svg/use-02.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <title>Testing that 'use' with zero width/height is displayed when
+         not referencing svg or symbol elements</title>
+  <defs>
+    <rect id="to-cover" x="2" y="2" height="96" width="96" fill="red"/>
+    <rect id="r" x="0" y="0" height="100" width="100" fill="lime"/>
+  </defs>
+  <rect width="100%" height="100%" fill="lime"/>
+
+  <use href="#to-cover"/>
+  <use x="110" href="#to-cover"/>
+  <use y="110" href="#to-cover"/>
+
+  <use href="#r" width="0" height="0" />
+  <use x="110" href="#r" width="0" />
+  <use y="110" href="#r" height="0" />
+</svg>