Bug 1350780 Part 2: Add a test of getComputedStyle with pseudo element styling on an unflowed display:grid element. r=mats
authorBrad Werth <bwerth@mozilla.com>
Mon, 13 Nov 2017 17:45:29 -0800
changeset 436564 cd4e8b6932498eb87729bf7dffa2c754e1129dd1
parent 436563 c5dc9b4abb084fb9e5d2878a3411640cc3eafedd
child 436565 4d02718fccf05f6c8fbc76eb7cc6cf5eaffa59bb
push id117
push userfmarier@mozilla.com
push dateTue, 28 Nov 2017 20:17:16 +0000
reviewersmats
bugs1350780
milestone59.0a1
Bug 1350780 Part 2: Add a test of getComputedStyle with pseudo element styling on an unflowed display:grid element. r=mats MozReview-Commit-ID: KEk4cz5bEb0
layout/style/test/mochitest.ini
layout/style/test/test_computed_style_grid_with_pseudo.html
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@@ -169,16 +169,17 @@ skip-if = !stylo # This is a stylo test;
 [test_ch_ex_no_infloops.html]
 [test_change_hint_optimizations.html]
 [test_clip-path_polygon.html]
 [test_color_rounding.html]
 [test_compute_data_with_start_struct.html]
 skip-if = toolkit == 'android'
 [test_computed_style.html]
 [test_computed_style_bfcache_display_none.html]
+[test_computed_style_grid_with_pseudo.html]
 [test_computed_style_in_created_document.html]
 [test_computed_style_min_size_auto.html]
 [test_computed_style_no_flush.html]
 skip-if = !stylo # gecko will fail without some hack, see bug 1401857
 [test_computed_style_no_pseudo.html]
 [test_computed_style_prefs.html]
 [test_condition_text.html]
 [test_condition_text_assignment.html]
new file mode 100644
--- /dev/null
+++ b/layout/style/test/test_computed_style_grid_with_pseudo.html
@@ -0,0 +1,91 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1350780
+-->
+<head>
+<title>Test for Bug 1350780</title>
+<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+
+<style>
+#container {
+  width: 100px;
+}
+
+.gridBefore::before {
+  content: "";
+  display: grid;
+  grid-template-columns: auto;
+}
+
+.gridBeforeNoContent::before {
+  display: grid;
+  grid-template-columns: 40px;
+}
+</style>
+
+<script type="application/javascript">
+
+SimpleTest.waitForExplicitFinish();
+
+function checkTemplateWithData(data) {
+  let obj = document.createElement("div");
+
+  // We need either a template or an additionalClass.
+  if (typeof(data.template != "undefined")) {
+    obj.style.display = "grid";
+    obj.style.gridTemplateColumns = data.template;
+  }
+
+  if (typeof(data.additionalClass != "undefined")) {
+    obj.className = data.additionalClass;
+  }
+
+  let container = document.getElementById("container");
+  container.appendChild(obj);
+
+  let computedStyle = getComputedStyle(obj, data.pseudo);
+  let computedTemplate = computedStyle.getPropertyValue("grid-template-columns");
+
+  let message = "Got expected template with pseudo " + data.pseudo;
+  if (typeof(data.additionalClass != "undefined")) {
+    message += " with class " + data.additionalClass;
+  }
+  message += ".";
+
+  is(computedTemplate, data.expected, message);
+
+  container.removeChild(obj);
+}
+
+function runTest() {
+  let dataToTest = [
+    { template: "40px",
+      pseudo: "::-moz-selection",
+      expected: "none"},
+    { template: "40px",
+      pseudo: "::before",
+      expected: "none" },
+    { additionalClass: "gridBefore",
+      pseudo: "::before",
+      expected: "100px" },
+    { additionalClass: "gridBeforeNoContent",
+      pseudo: "::before",
+      expected: "40px" },
+  ];
+
+  for (let i = 0; i < dataToTest.length; ++i) {
+    checkTemplateWithData(dataToTest[i]);
+  }
+
+  SimpleTest.finish();
+}
+
+</script>
+</head>
+<body onload="runTest()">
+<div id="container"></div>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1350780">Mozilla Bug 1350780</a>
+</body>
+</html>