1 files changed, 114 insertions, 0 deletions
diff --git a/dom/grid/test/chrome/test_grid_object.html b/dom/grid/test/chrome/test_grid_object.html
new file mode 100644
index 0000000000..ab8b9abfa0
--- /dev/null
+++ b/dom/grid/test/chrome/test_grid_object.html
@@ -0,0 +1,114 @@
+<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
+<style>
+body {
+  margin: 40px;
+}
+.wrapper {
+  display: grid;
+  width: 400px;
+  grid-gap: 10px;
+  grid-template-columns: 100px 1fr 1fr 100px;
+}
+.oh {
+  overflow: hidden;
+}
+.box {
+  background-color: #444;
+  color: #fff;
+}
+</style>
+
+<script>
+"use strict";
+
+SimpleTest.waitForExplicitFinish();
+
+function runTests() {
+  // Test 1: elements styled with display:grid
+  let idsWithGrid = [
+    "gridDiv",
+    "gridFieldset",
+    "gridButton",
+    "gridDivOh",
+    "gridFieldsetOh",
+    "gridButtonOh",
+  ];
+
+  for (let id of idsWithGrid) {
+    let wrapper = document.getElementById(id);
+
+    // test function existence
+    is(typeof(wrapper.getGridFragments), "function",
+      id + ": getGridFragments function exists."
+    );
+
+    // test that wrapper has one grid
+    let gridFragments = wrapper.getGridFragments();
+    is(gridFragments.length, 1,
+      id + ": one grid on an un-fragmented display:grid styled element."
+    );
+
+    // test that the grid has cols and rows properties
+    if (gridFragments.length) {
+      let grid = gridFragments[0];
+      isnot(typeof(grid.cols), "undefined", id + ": Grid.cols property exists.");
+      isnot(typeof(grid.rows), "undefined", id + ": Grid.rows property exists.");
+    }
+  }
+
+  // Test 2: elements styled without display:grid
+  let idsWithoutGrid = [
+    "boxA",
+  ];
+
+  for (let id of idsWithoutGrid) {
+    let wrapper = document.getElementById(id);
+
+    // test that wrapper has no grid
+    let gridFragments = wrapper.getGridFragments();
+    is(gridFragments.length, 0,
+      id + ": no grid on element."
+    );
+  }
+
+  SimpleTest.finish();
+}
+</script>
+</head>
+<body onLoad="runTests();">
+
+  <div id="gridDiv" class="wrapper">
+    <div id="boxA" class="box">A</div>
+  </div>
+
+  <fieldset id="gridFieldset" class="wrapper">
+  <legend>a fieldset</legend>
+  <label for="name">name</label>
+  <input id="name">
+  </fieldset>
+
+  <button id="gridButton" class="wrapper">
+  <span style="grid-row:2">test</span>
+  </button>
+
+  <div id="gridDivOh" class="wrapper oh">
+    <div id="boxAOh" class="box">A</div>
+  </div>
+
+  <fieldset id="gridFieldsetOh" class="wrapper oh">
+  <legend>a fieldset</legend>
+  <label for="nameOh">name</label>
+  <input id="nameOh">
+  </fieldset>
+
+  <button id="gridButtonOh" class="wrapper oh">
+  <span style="grid-row:2">test</span>
+  </button>
+
+</body>
+</html>