Issue 4796 - Use a modern JS engine in the browser tests and convert all files to ECMAScript 6

test/browser/elemHideEmulation.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2017 eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  * GNU General Public License for more details.
  *
  * You should have received a copy of the GNU General Public License
  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-// We are currently limited to ECMAScript 5 in this file, because it is being
-// used in the browser tests. See https://issues.adblockplus.org/ticket/4796
+"use strict";
 
-// TODO: This should be using document.currentScript once supported by
-// PhantomJS.
-var myUrl = document.head.lastChild.src;
+/* globals ElemHideEmulation */
 
-exports.setUp = function(callback)
-{
-  // 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;
-    };
-  }
-
-  callback();
-};
+let myUrl = document.currentScript.src;

[kzar, 2017/04/27 15:19:36]

Nit: Perhaps append the "/../../.." part here and rename to baseUrl? We seem to
do that every time myUrl is used anyway. That would have the bonus of making
line 87 less than 80 characters.

[Wladimir Palant, 2017/04/27 18:04:50]

I have a better idea - loadScript() should expect relative URLs. That's
something for another commit however, here I wanted to keep changes to the logic
minimal.

[kzar, 2017/04/28 09:03:31]

Acknowledged.

 
 exports.tearDown = function(callback)
 {
-  var styleElements = document.head.getElementsByTagName("style");
+  let styleElements = document.head.getElementsByTagName("style");
   while (styleElements.length)
     styleElements[0].parentNode.removeChild(styleElements[0]);
   callback();
 };
 
+function unexpectedError(error)
+{
+  console.error(error);
+  this.ok(false, "Unexpected error: " + error);
+}
+
 function expectHidden(test, element)
 {
   test.equal(window.getComputedStyle(element).display, "none",
              "The element's display property should be set to 'none'");
 }
 
 function expectVisible(test, element)
 {
   test.notEqual(window.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);
+  let 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");
+  let styleElement;
+  let 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");
+  let element = document.createElement("div");
   element.id = findUniqueId();
   document.body.appendChild(element);
   insertStyleRule("#" + element.id + " " + styleBlock);
   return element;
 }
 
-function applyElemHideEmulation(selectors, callback)
+function applyElemHideEmulation(selectors)
 {
   if (typeof ElemHideEmulation == "undefined")
   {
-    loadScript(myUrl + "/../../../lib/common.js", function()
+    return loadScript(myUrl + "/../../../lib/common.js").then(() =>
     {
-      loadScript(myUrl + "/../../../chrome/content/elemHideEmulation.js",
-          function()
-          {
-            applyElemHideEmulation(selectors, callback);
-          });
+      return loadScript(myUrl + "/../../../chrome/content/elemHideEmulation.js");
+    }).then(() =>
+    {
+      return applyElemHideEmulation(selectors);
     });
-    return;
   }
 
-  var elemHideEmulation = new ElemHideEmulation(
+  let elemHideEmulation = new ElemHideEmulation(
     window,
-    function(callback)
+    callback =>
     {
-      var patterns = [];
-      selectors.forEach(function(selector)
+      let patterns = [];
+      selectors.forEach(selector =>
       {
-        patterns.push({selector: selector});
+        patterns.push({selector});
       });
       callback(patterns);
-    },
-    function(selectors)
+    }, newSelectors =>
     {
-      if (!selectors.length)
+      if (!newSelectors.length)
         return;
-      var selector = selectors.join(", ");
+      let selector = newSelectors.join(", ");
       insertStyleRule(selector + "{display: none !important;}");
     }
   );
 
   elemHideEmulation.apply();
-  callback();
+  return Promise.resolve();
 }
 
 exports.testVerbatimPropertySelector = function(test)
 {
-  var toHide = createElementWithStyle("{background-color: #000}");
+  let toHide = createElementWithStyle("{background-color: #000}");
   applyElemHideEmulation(
-    ["[-abp-properties='background-color: rgb(0, 0, 0)']"],
-    function()
-    {
-      expectHidden(test, toHide);
-      test.done();
-    }
-  );
+    ["[-abp-properties='background-color: rgb(0, 0, 0)']"]
+  ).then(() =>
+  {
+    expectHidden(test, toHide);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
 
 exports.testPropertySelectorWithWildcard = function(test)
 {
-  var toHide = createElementWithStyle("{background-color: #000}");
+  let toHide = createElementWithStyle("{background-color: #000}");
   applyElemHideEmulation(
-    ["[-abp-properties='*color: rgb(0, 0, 0)']"],
-    function()
-    {
-      expectHidden(test, toHide);
-      test.done();
-    }
-  );
+    ["[-abp-properties='*color: rgb(0, 0, 0)']"]
+  ).then(() =>
+  {
+    expectHidden(test, toHide);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
 
 exports.testPropertySelectorWithRegularExpression = function(test)
 {
-  var toHide = createElementWithStyle("{background-color: #000}");
+  let toHide = createElementWithStyle("{background-color: #000}");
   applyElemHideEmulation(
-    ["[-abp-properties='/.*color: rgb\\(0, 0, 0\\)/']"],
-    function()
-    {
-      expectHidden(test, toHide);
-      test.done();
-    }
-  );
+    ["[-abp-properties='/.*color: rgb\\(0, 0, 0\\)/']"]
+  ).then(() =>
+  {
+    expectHidden(test, toHide);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
 
 exports.testPropertySelectorWithEscapedBrace = function(test)
 {
-  var toHide = createElementWithStyle("{background-color: #000}");
+  let toHide = createElementWithStyle("{background-color: #000}");
   applyElemHideEmulation(
-    ["[-abp-properties='/background.\\x7B 0,6\\x7D : rgb\\(0, 0, 0\\)/']"],
-    function()
-    {
-      expectHidden(test, toHide);
-      test.done();
-    }
-  );
+    ["[-abp-properties='/background.\\x7B 0,6\\x7D : rgb\\(0, 0, 0\\)/']"]
+  ).then(() =>
+  {
+    expectHidden(test, toHide);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
 
 exports.testPropertySelectorWithImproperlyEscapedBrace = function(test)
 {
-  var toHide = createElementWithStyle("{background-color: #000}");
+  let toHide = createElementWithStyle("{background-color: #000}");
   applyElemHideEmulation(
-    ["[-abp-properties='/background.\\x7B0,6\\x7D: rgb\\(0, 0, 0\\)/']"],
-    function()
-    {
-      expectVisible(test, toHide);
-      test.done();
-    }
-  );
+    ["[-abp-properties='/background.\\x7B0,6\\x7D: rgb\\(0, 0, 0\\)/']"]
+  ).then(() =>
+  {
+    expectVisible(test, toHide);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
 
 exports.testDynamicallyChangedProperty = function(test)
 {
-  var toHide = createElementWithStyle("{}");
+  let toHide = createElementWithStyle("{}");
   applyElemHideEmulation(
-    ["[-abp-properties='background-color: rgb(0, 0, 0)']"],
-    function()
+    ["[-abp-properties='background-color: rgb(0, 0, 0)']"]
+  ).then(() =>
+  {
+    expectVisible(test, toHide);
+    insertStyleRule("#" + toHide.id + " {background-color: #000}");
+    return new Promise((resolve, reject) =>
     {
-      expectVisible(test, toHide);
-      insertStyleRule("#" + toHide.id + " {background-color: #000}");
-      window.setTimeout(function()
+      window.setTimeout(() =>
       {
         expectHidden(test, toHide);
-        test.done();
+        resolve();
       }, 0);
-    }
-  );
+    });
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
 };