Bug 1302341 - Part 2: SVGTextFrame should be valid when unioning borderBoxes; r=heycam

MozReview-Commit-ID: 8R9f8viFt30

--HG--
extra : rebase_source : 79520efa988275af28552db566665bfc46b0238f

layout/generic/nsFrame.cpp

@@ -8558,12 +8558,13 @@ UnionBorderBoxes(nsIFrame* aFrame, bool aApplyTransform,
   const nsRect bounds(nsPoint(0, 0),
                       aSizeOverride ? *aSizeOverride : aFrame->GetSize());
 
-  // The SVG container frames do not maintain an accurate mRect.
-  // It will make the outline be larger than we expect, we need
-  // to make them narrow to their children's outline.
+  // The SVG container frames besides SVGTextFrame do not maintain
+  // an accurate mRect. It will make the outline be larger than
+  // we expect, we need to make them narrow to their children's outline.
   // aOutValid is set to false if the returned nsRect is not valid
   // and should not be included in the outline rectangle.
-  aOutValid = !aFrame->IsFrameOfType(nsIFrame::eSVGContainer);
+  aOutValid = !aFrame->IsFrameOfType(nsIFrame::eSVGContainer)
+              || aFrame->GetType() == nsGkAtoms::svgTextFrame;
 
   // Start from our border-box, transformed.  See comment below about
   // transform of children.

layout/reftests/svg/outline-ref.html

@@ -31,6 +31,11 @@
     <svg x="300" y="250">
       <rect id="innerRect" x="30" y="10" height="50" width="50" style="fill: red"/>
     </svg>
+    <a xlink:href="#" id="link">
+      <text x="300" y="350" font-family="Verdana" font-size="20">
+        link
+      </text>
+    </a>
   </g>
 </svg>
 <script>
@@ -45,7 +50,7 @@ function createOutline(boundingRect) {
   var height = boundingRect.height;
 
   var lines = document.createElement("div");
-  var styles = 'border: 1px solid;'
+  var styles = 'border: 1px solid black;'
                + 'width: ' + width + 'px;'
                + 'height: ' + height + 'px;'
                + 'position: absolute;'
@@ -60,7 +65,7 @@ window.onload = function drawOutline() {
   var elements = ['rect', 'foreignObject', 'circle',
                   'ellipse', 'image', 'line', 'path',
                   'polygon', 'polyline', 'text','gCircle',
-                  'innerRect'];
+                  'innerRect', 'link'];
   elements.forEach(id => {
     var element = document.getElementById(id);
     createOutline(element.getBoundingClientRect());

layout/reftests/svg/outline.html

@@ -11,7 +11,7 @@ line,
 path,
 polygon,
 polyline {
-  outline: 1px solid;
+  outline: 1px solid black;
 }
 
 </style>
@@ -46,6 +46,11 @@ polyline {
     <svg x="300" y="250">
       <rect x="30" y="10" height="50" width="50" style="fill: red"/>
     </svg>
+    <a xlink:href="#" id="link">
+      <text x="300" y="350" font-family="Verdana" font-size="20">
+        link
+      </text>
+    </a>
   </g>
 </svg>
 </body>