1 files changed, 71 insertions, 0 deletions
diff --git a/layout/reftests/svg/dynamic-mask-pre-effects-bbox.html b/layout/reftests/svg/dynamic-mask-pre-effects-bbox.html
new file mode 100644
index 000000000..4ed6f1a37
--- /dev/null
+++ b/layout/reftests/svg/dynamic-mask-pre-effects-bbox.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+  <head>
+    <style>
+      #container {
+        border: 3px dotted black;
+        background: yellow;
+        overflow: hidden;
+        width: 400px;
+        max-height: 25px;
+      }
+
+      #container.masked {
+        mask: url('#fade_mask_bottom');
+      }
+      .item {
+        font-size: 30px;
+      }
+    </style>
+    <script>
+      function go() {
+        clear();
+        insert();
+      }
+
+      function clear() {
+        // Force reflow:
+        container.offsetHeight;
+
+        // Remove mask:
+        container.classList.remove('masked');
+      }
+
+      function insert() {
+        // Add new child:
+        var notificationNode = document.createElement('div');
+        notificationNode.classList.add('item');
+        notificationNode.appendChild(document.createTextNode("PASS"));
+        var container = document.getElementById('container');
+        container.appendChild(notificationNode);
+
+        // Force reflow:
+        container.offsetHeight;
+
+        // Add back mask:
+        container.classList.add('masked');
+
+        document.documentElement.classList.remove('reftest-wait');
+      }
+    </script>
+  </head>
+  <body onload="go();">
+    <div id='container' class="masked"></div>
+
+    <!-- BEGIN SVG MASK: -->
+    <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+      <mask id="fade_mask_bottom"
+            maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox">
+        <linearGradient id="fade_gradient_bottom"
+                        gradientUnits="objectBoundingBox" x2="0" y2="1">
+          <stop stop-color="white" stop-opacity="1" offset="0.7"></stop>
+          <stop stop-color="white" stop-opacity="0" offset="1"></stop>
+        </linearGradient>
+        <rect x="0" y="0" width="1" height="1"
+              fill="url(#fade_gradient_bottom)"></rect>
+      </mask>
+    </svg>
+  <!-- END SVG MASK -->
+
+  </body>
+</html>