layout/style/test/test_computed_style_grid_with_pseudo.html
author Brian Grinstead <bgrinstead@mozilla.com>
Tue, 16 Apr 2019 03:50:44 +0000
changeset 469640 c9c0c6f2eed54a187e124942e53c3660b4cf17d8
parent 417756 70754a946fde161c04f86df1b67e3913c8ec590a
permissions -rw-r--r--
Bug 1544322 - Part 2.1 - Remove the [type] attribute for one-liner <script> tags loading files in /tests/SimpleTest/ in everything except for dom/ r=bzbarsky This excludes dom/, otherwise the file size is too large for phabricator to handle. This is an autogenerated commit to handle scripts loading mochitest harness files, in the simple case where the script src is on the same line as the tag. This was generated with https://bug1544322.bmoattachments.org/attachment.cgi?id=9058170 using the `--part 2` argument. Differential Revision: https://phabricator.services.mozilla.com/D27456

<!DOCTYPE HTML>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=1350780
-->
<head>
<title>Test for Bug 1350780</title>
<script 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: "::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>