diff --git a/dom/base/DOMIntersectionObserver.cpp b/dom/base/DOMIntersectionObserver.cpp
index 7aaafa53ba56..dbe439d1a9e5 100644
--- a/dom/base/DOMIntersectionObserver.cpp
+++ b/dom/base/DOMIntersectionObserver.cpp
@@ -436,13 +436,15 @@ DOMIntersectionObserver::Update(nsIDocument* aDocument, DOMHighResTimeStamp time
       }
     }
 
-    double targetArea = targetRect.Width() * targetRect.Height();
-    double intersectionArea = !intersectionRect ?
-      0 : intersectionRect->Width() * intersectionRect->Height();
+    int64_t targetArea =
+      (int64_t) targetRect.Width() * (int64_t) targetRect.Height();
+    int64_t intersectionArea = !intersectionRect ? 0 :
+      (int64_t) intersectionRect->Width() *
+      (int64_t) intersectionRect->Height();
 
     double intersectionRatio;
     if (targetArea > 0.0) {
-      intersectionRatio = intersectionArea / targetArea;
+      intersectionRatio = (double) intersectionArea / (double) targetArea;
     } else {
       intersectionRatio = intersectionRect.isSome() ? 1.0 : 0.0;
     }
diff --git a/dom/base/test/mochitest.ini b/dom/base/test/mochitest.ini
index 596595edc29e..ff03a6db5e10 100644
--- a/dom/base/test/mochitest.ini
+++ b/dom/base/test/mochitest.ini
@@ -626,6 +626,7 @@ skip-if = toolkit == 'android'
 skip-if = toolkit == 'android'
 [test_bug1399603.html]
 [test_bug1399605.html]
+[test_bug1406102.html]
 [test_caretPositionFromPoint.html]
 [test_change_policy.html]
 [test_clearTimeoutIntervalNoArg.html]
diff --git a/dom/base/test/test_bug1406102.html b/dom/base/test/test_bug1406102.html
new file mode 100644
index 000000000000..78a3ddb2960f
--- /dev/null
+++ b/dom/base/test/test_bug1406102.html
@@ -0,0 +1,38 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test for Bug 1406102</title>
+  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <style type="text/css">
+    html {
+        height: 100%;
+    }
+    body {
+        height: 2866px;
+    }
+  </style>
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1406102">Mozilla Bug 1406102</a>
+<p id="display"></p>
+<div id="content">
+  <div id="target"></div>
+</div>
+<pre id="test">
+<script type="application/javascript">
+
+  let observer = new IntersectionObserver(function (changes) {
+    ok(changes[0].intersectionRatio > 0, 'intersectionRatio should be greater than zero');
+    SimpleTest.finish();
+  });
+  observer.observe(document.body);
+  SimpleTest.waitForExplicitFinish();
+
+</script>
+</pre>
+<div id="log">
+</div>
+</body>
+</html>
