Issue 4726 - Add tests for the element hiding emulation content script

test/browser/elemHideEmulation.js

Index: test/browser/elemHideEmulation.js
===================================================================
new file mode 100644
--- /dev/null
+++ b/test/browser/elemHideEmulation.js
@@ -0,0 +1,153 @@
+QUnit.module("Element hiding emulation",
+{
+  before: function()
+  {
+    // The URL object in PhantomJS 2.1.7 does not implement any properties, so
+    // we need a polyfill.
+    if (!URL || !("origin" in URL))
+    {
+      var doc = document.implementation.createHTMLDocument();
+      var anchor = doc.createElement("a");
+      doc.body.appendChild(anchor);
+      URL = function(url)
+      {
+        if (!url)
+          throw "Invalid URL";
+        anchor.href = url;
+        this.origin = anchor.origin;
+      };
+    }
+  },
+  afterEach: function()
+  {
+    var styleElements = document.head.getElementsByTagName("style");
+    for (var i = 0; i < styleElements.length; i++)
+      document.head.removeChild(styleElements[0]);
+  }
+});
+
+QUnit.assert.hidden = function(element)
+{
+  this.equal(getComputedStyle(element).display, "none",
+             "The element's display property should be set to 'none'");
+};
+
+QUnit.assert.visible = function(element)
+{
+  this.notEqual(getComputedStyle(element).display, "none",
+                "The element's display property should not be set to 'none'");
+};
+
+function findUniqueId()
+{
+  var id = "elemHideEmulationTest-" + Math.floor(Math.random() * 10000);
+  if (!document.getElementById(id))
+    return id;
+  return findUniqueId();
+}
+
+function insertStyleRule(rule)
+{
+  var styleElement;
+  var styleElements = document.head.getElementsByTagName("style");
+  if (styleElements.length)
+    styleElement = styleElements[0];
+  else
+  {
+    styleElement = document.createElement("style");
+    document.head.appendChild(styleElement);
+  }
+  styleElement.sheet.insertRule(rule, styleElement.sheet.cssRules.length);
+}
+
+function createElementWithStyle(styleBlock)
+{
+  var element = document.createElement("div");
+  element.id = findUniqueId();
+  document.body.appendChild(element);
+  insertStyleRule("#" + element.id + " " + styleBlock);
+  return element;
+}
+
+function applyElemHideEmulation(selectors, callback)
+{
+  var elemHideEmulation = new ElemHideEmulation(
+    window,
+    function(callback)
+    {
+      var patterns = [];
+      selectors.forEach(function(selector)
+      {
+        patterns.push({selector: selector});
+      });
+      callback(patterns);
+    },
+    function(selectors)
+    {
+      if (!selectors.length)
+        return;
+      var selector = selectors.join(", ");
+      insertStyleRule(selector + "{display: none !important;}");
+    }
+  );
+
+  elemHideEmulation.load(function()
+  {
+    elemHideEmulation.apply();
+    callback();
+  });
+}
+
+QUnit.test("Verbatim property selector", function(assert)
+{
+  var done = assert.async();
+  var toHide = createElementWithStyle("{background-color: #000}");
+  applyElemHideEmulation(["[-abp-properties='background-color: rgb(0, 0, 0)']"],
+    function()

[Felix Dahlke, 2016/12/11 12:13:49]

Not so sure about this indentation style - suggestions welcome.

+  {
+    assert.hidden(toHide);
+    done();
+  });
+});
+
+QUnit.test("Property selector with wildcard", function(assert)
+{
+  var done = assert.async();
+  var toHide = createElementWithStyle("{background-color: #000}");
+  applyElemHideEmulation(["[-abp-properties='*color: rgb(0, 0, 0)']"],
+    function()
+  {
+    assert.hidden(toHide);
+    done();
+  });
+});
+
+QUnit.test("Property selector with regular expression", function(assert)
+{
+  var done = assert.async();
+  var toHide = createElementWithStyle("{background-color: #000}");
+  applyElemHideEmulation(["[-abp-properties='/.*color: rgb\\(0, 0, 0\\)/']"],
+    function()
+  {
+    assert.hidden(toHide);
+    done();
+  });
+});
+
+QUnit.test("Property selector works for dynamically changed property",
+  function(assert)
+{
+  var done = assert.async();
+  var toHide = createElementWithStyle("{}");
+  applyElemHideEmulation(["[-abp-properties='background-color: rgb(0, 0, 0)']"],
+    function()
+  {
+    assert.visible(toHide);
+    insertStyleRule("#" + toHide.id + " {background-color: #000}");
+    setTimeout(function()
+    {
+      assert.hidden(toHide);
+      done();
+    });
+  });
+});