Issue 4871 - Start using ESLint for adblockplusui

background.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2016 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/>.
  */
 
-(function(global)
+"use strict";
+
 {
   function EventEmitter()
   {
     this._listeners = Object.create(null);
   }
   EventEmitter.prototype = {
-    on: function(name, listener)
+    on(name, listener)
     {
       if (name in this._listeners)
         this._listeners[name].push(listener);
       else
         this._listeners[name] = [listener];
     },
-    off: function(name, listener)
+    off(name, listener)
     {
-      var listeners = this._listeners[name];
+      let listeners = this._listeners[name];
       if (listeners)
       {
-        var idx = listeners.indexOf(listener);
+        let idx = listeners.indexOf(listener);
         if (idx != -1)
           listeners.splice(idx, 1);
       }
     },
-    emit: function(name)
+    emit(name, ...args)
     {
-      var listeners = this._listeners[name];
+      let listeners = this._listeners[name];
       if (listeners)
       {
-        for (var i = 0; i < listeners.length; i++)
-          listeners[i].apply(null, Array.prototype.slice.call(arguments, 1));
+        for (let i = 0; i < listeners.length; i++)
+          listeners[i](...args);
       }
     }
   };
 
   function updateFromURL(data)
   {
     if (window.location.search)
     {
-      var params = window.location.search.substr(1).split("&");
-      for (var i = 0; i < params.length; i++)
+      let params = window.location.search.substr(1).split("&");
+      for (let i = 0; i < params.length; i++)
       {
-        var parts = params[i].split("=", 2);
+        let parts = params[i].split("=", 2);
         if (parts.length == 2 && parts[0] in data)
           data[parts[0]] = decodeURIComponent(parts[1]);
       }
     }
   }
 
-  var params = {
+  let params = {
     blockedURLs: "",
     filterlistsReinitialized: false,
     addSubscription: false,
     filterError: false,
     downloadStatus: "synchronize_ok",
     showNotificationUI: false
   };
   updateFromURL(params);
 
-  var modules = {};
-  global.require = function(module)
+  let modules = {};
+  window.require = function(module)
   {
     return modules[module];
   };
 
   modules.utils = {
     Utils: {
-      getDocLink: function(link)
+      getDocLink(link)
       {
         return "https://adblockplus.org/redirect?link=" + encodeURIComponent(link);
       },
       get appLocale()
       {
         return parent.ext.i18n.getMessage("@@ui_locale").replace(/_/g, "-");
       }
     }
   };
 
   modules.prefs = {Prefs: new EventEmitter()};
-  var prefs = {
+  let prefs = {
     notifications_ignoredcategories: (params.showNotificationUI) ? ["*"] : [],
     notifications_showui: params.showNotificationUI,
     shouldShowBlockElementMenu: true,
     show_devtools_panel: true,
     subscriptions_exceptionsurl: "https://easylist-downloads.adblockplus.org/exceptionrules.txt"
   };
-  Object.keys(prefs).forEach(function(key)
+  Object.keys(prefs).forEach(key =>

[Thomas Greiner, 2017/03/01 17:39:32]

Detail: Mind keeping the brackets? At least in Flattr Plus we agreed on using
brackets for single argument arrow functions for consistency.

[kzar, 2017/03/02 04:36:01]

I've opened a codereview to add the arrow-parens rule to our ESLint
configuration. Let's clear this up there once and for all
https://codereview.adblockplus.org/29377779/

[kzar, 2017/03/07 12:48:29]

As discussed we've decided against adding the arrow-parens rule globally. I'll
add it to the configuration here instead.

[Thomas Greiner, 2017/03/07 13:33:00]

I appreciate that because according to Felix it's up to the author to decide
whether or not to add parentheses or not.

   {
     Object.defineProperty(modules.prefs.Prefs, key, {
-      get: function()
+      get()
       {
         return prefs[key];
       },
-      set: function(value)
+      set(value)
       {
         prefs[key] = value;
         modules.prefs.Prefs.emit(key);
       }
     });
   });
 
   modules.notification = {
     Notification: {
-      toggleIgnoreCategory: function(category)
+      toggleIgnoreCategory(category)
       {
-        var categories = prefs.notifications_ignoredcategories;
-        var index = categories.indexOf(category);
+        let categories = prefs.notifications_ignoredcategories;
+        let index = categories.indexOf(category);
         if (index == -1)
           categories.push(category);
         else
           categories.splice(index, 1);
         modules.prefs.Prefs.notifications_ignoredcategories = categories;
       }
     }
   };
 
+  /* eslint-disable object-shorthand */

[Thomas Greiner, 2017/03/01 17:39:32]

Detail: What about moving the constructors outside of the object definition
instead? The reasoning behind it being that it might not be wise to disable
rules for larger code blocks.

[kzar, 2017/03/07 12:48:29]

I think I've already done this when addressing Sebastian's feedback.

   modules.subscriptionClasses = {
     Subscription: function(url)
     {
       this.url = url;
       this._disabled = false;
       this._lastDownload = 1234;
       this.homepage = "https://easylist.adblockplus.org/";
       this.downloadStatus = params.downloadStatus;
     },
 
     SpecialSubscription: function(url)
     {
       this.url = url;
       this.disabled = false;
       this.filters = knownFilters.slice();
     }
   };
   modules.subscriptionClasses.Subscription.fromURL = function(url)
   {
     if (url in knownSubscriptions)
       return knownSubscriptions[url];
 
     if (/^https?:\/\//.test(url))
       return new modules.subscriptionClasses.Subscription(url);
-    else
-      return new modules.subscriptionClasses.SpecialSubscription(url);
+    return new modules.subscriptionClasses.SpecialSubscription(url);
   };
-  modules.subscriptionClasses.DownloadableSubscription = modules.subscriptionClasses.Subscription;
+  /* eslint-enable object-shorthand */
+  modules.subscriptionClasses.DownloadableSubscription =
+    modules.subscriptionClasses.Subscription;
 
   modules.subscriptionClasses.Subscription.prototype =
   {
     get disabled()
     {
       return this._disabled;
     },
     set disabled(value)
     {
       this._disabled = value;
       modules.filterNotifier.FilterNotifier.emit("subscription.disabled", this);
     },
     get lastDownload()
     {
       return this._lastDownload;
     },
     set lastDownload(value)
     {
       this._lastDownload = value;
-      modules.filterNotifier.FilterNotifier.emit("subscription.lastDownload", this);
+      modules.filterNotifier.FilterNotifier.emit("subscription.lastDownload",
+                                                 this);
     }
   };
 
 
   modules.filterStorage = {
     FilterStorage: {
       get subscriptions()
       {
-        var subscriptions = [];
-        for (var url in modules.filterStorage.FilterStorage.knownSubscriptions)
-          subscriptions.push(modules.filterStorage.FilterStorage.knownSubscriptions[url]);
+        let subscriptions = [];
+        for (let url in modules.filterStorage.FilterStorage.knownSubscriptions)
+        {
+          subscriptions.push(
+            modules.filterStorage.FilterStorage.knownSubscriptions[url]
+          );
+        }
         return subscriptions;
       },
 
       get knownSubscriptions()
       {
         return knownSubscriptions;
       },
 
-      addSubscription: function(subscription)
+      addSubscription(subscription)
       {
-        if (!(subscription.url in modules.filterStorage.FilterStorage.knownSubscriptions))
+        let {fromURL} = modules.subscriptionClasses.Subscription;
+        let {FilterStorage} = modules.filterStorage;
+
+        if (!(subscription.url in FilterStorage.knownSubscriptions))
         {
-          knownSubscriptions[subscription.url] = modules.subscriptionClasses.Subscription.fromURL(subscription.url);
-          modules.filterNotifier.FilterNotifier.emit("subscription.added", subscription);
+          knownSubscriptions[subscription.url] = fromURL(subscription.url);
+          modules.filterNotifier.FilterNotifier.emit("subscription.added",
+                                                     subscription);
         }
       },
 
-      removeSubscription: function(subscription)
+      removeSubscription(subscription)
       {
-        if (subscription.url in modules.filterStorage.FilterStorage.knownSubscriptions)
+        let {FilterStorage} = modules.filterStorage;
+
+        if (subscription.url in FilterStorage.knownSubscriptions)
         {
           delete knownSubscriptions[subscription.url];
-          modules.filterNotifier.FilterNotifier.emit("subscription.removed", subscription);
+          modules.filterNotifier.FilterNotifier.emit("subscription.removed",
+                                                     subscription);
         }
       },
 
-      addFilter: function(filter)
+      addFilter(filter)
       {
-        for (var i = 0; i < customSubscription.filters.length; i++)
+        for (let i = 0; i < customSubscription.filters.length; i++)
         {
           if (customSubscription.filters[i].text == filter.text)
             return;
         }
         customSubscription.filters.push(filter);
         modules.filterNotifier.FilterNotifier.emit("filter.added", filter);
       },
 
-      removeFilter: function(filter)
+      removeFilter(filter)
       {
-        for (var i = 0; i < customSubscription.filters.length; i++)
+        for (let i = 0; i < customSubscription.filters.length; i++)
         {
           if (customSubscription.filters[i].text == filter.text)
           {
             customSubscription.filters.splice(i, 1);
-            modules.filterNotifier.FilterNotifier.emit("filter.removed", filter);
+            modules.filterNotifier.FilterNotifier.emit("filter.removed",
+                                                       filter);
             return;
           }
         }
       }
     }
   };
 
+  /* eslint-disable object-shorthand */
   modules.filterClasses = {
-    BlockingFilter: function() {},
+    BlockingFilter: () => {},
     Filter: function(text)
     {
       this.text = text;
       this.disabled = false;
     },
-    RegExpFilter: function() {}
+    RegExpFilter: () => {}
   };
+  /* eslint-enable object-shorthand */
   modules.filterClasses.Filter.fromText = function(text)
   {
     return new modules.filterClasses.Filter(text);
   };
   modules.filterClasses.RegExpFilter.typeMap = Object.create(null);
 
-  modules.filterValidation = 
+  modules.filterValidation =
   {
-    parseFilter: function(text)
+    parseFilter(text)
     {
       if (params.filterError)
         return {error: "Invalid filter"};
       return {filter: modules.filterClasses.Filter.fromText(text)};
     },
-    parseFilters: function(text)
+    parseFilters(text)
     {
       if (params.filterError)
         return {errors: ["Invalid filter"]};
       return {
         filters: text.split("\n")
-          .filter(function(filter) {return !!filter;})
+          .filter(filter => !!filter)
           .map(modules.filterClasses.Filter.fromText),
         errors: []
       };
     }
   };
 
   modules.synchronizer = {
     Synchronizer: {
       _downloading: false,
-      execute: function(subscription, manual) 
+      execute(subscription, manual)
       {
         modules.synchronizer.Synchronizer._downloading = true;
         modules.filterNotifier.FilterNotifier.emit(
           "subscription.downloading", subscription
         );
-        setTimeout(function()
+        setTimeout(() =>
         {
           modules.synchronizer.Synchronizer._downloading = false;
           subscription.lastDownload = Date.now() / 1000;
         }, 500);
       },
-      isExecuting: function(url)
+      isExecuting(url)
       {
         return modules.synchronizer.Synchronizer._downloading;
       }
     }
   };
 
   modules.matcher = {
     defaultMatcher: {
-      matchesAny: function(url, requestType, docDomain, thirdParty)
+      matchesAny(url, requestType, docDomain, thirdParty)
       {
-        var blocked = params.blockedURLs.split(",");
+        let blocked = params.blockedURLs.split(",");
         if (blocked.indexOf(url) >= 0)
           return new modules.filterClasses.BlockingFilter();
-        else
-          return null;
+        return null;
       }
     }
   };
 
   modules.elemHideEmulation = {
     ElemHideEmulation: {}
   };
 
   modules.filterNotifier = {
     FilterNotifier: new EventEmitter()
@@ skipping 15 matching lines @@
 
   modules.messaging = {
     port: new EventEmitter()
   };
 
   window.addEventListener("message", event =>
   {
     if (event.data.type != "message")
       return;
     let message = event.data.payload;
-    let messageId = event.data.messageId;
+    let {messageId} = event.data;
     let sender = {
       page: new ext.Page(event.source)
     };
 
     let listeners = modules.messaging.port._listeners[message.type];
     if (!listeners)
       return;
 
-    function reply(message)
+    function reply(responseMessage)
     {
       event.source.postMessage({
         type: "response",
-        messageId: messageId,
-        payload: message
+        messageId,
+        payload: responseMessage
       }, "*");
     }
 
     for (let listener of listeners)
     {
       let response = listener(message, sender);
       if (response && typeof response.then == "function")
       {
         response.then(
           reply,
-          reason => {
+          reason =>
+          {
             console.error(reason);
             reply(undefined);
           }
         );
       }
       else if (typeof response != "undefined")
-      {
         reply(response);
-      }
     }
   });
 
-  global.Services = {
+  window.Services = {
     vc: {
-      compare: function(v1, v2)
+      compare(v1, v2)
       {
         return parseFloat(v1) - parseFloat(v2);
       }
     }
   };
 
-  var filters = [
+  let filters = [
     "@@||alternate.de^$document",
     "@@||der.postillion.com^$document",
     "@@||taz.de^$document",
     "@@||amazon.de^$document",
     "||biglemon.am/bg_poster/banner.jpg",
     "winfuture.de###header_logo_link",
     "###WerbungObenRechts10_GesamtDIV",
     "###WerbungObenRechts8_GesamtDIV",
     "###WerbungObenRechts9_GesamtDIV",
     "###WerbungUntenLinks4_GesamtDIV",
     "###WerbungUntenLinks7_GesamtDIV",
     "###WerbungUntenLinks8_GesamtDIV",
     "###WerbungUntenLinks9_GesamtDIV",
     "###Werbung_Sky",
     "###Werbung_Wide",
     "###__ligatus_placeholder__",
     "###ad-bereich1-08",
     "###ad-bereich1-superbanner",
     "###ad-bereich2-08",
     "###ad-bereich2-skyscrapper"
   ];
-  var knownFilters = filters.map(modules.filterClasses.Filter.fromText);
+  let knownFilters = filters.map(modules.filterClasses.Filter.fromText);
 
-  var subscriptions = [
+  let subscriptions = [
     "https://easylist-downloads.adblockplus.org/easylistgermany+easylist.txt",
     "https://easylist-downloads.adblockplus.org/exceptionrules.txt",
     "https://easylist-downloads.adblockplus.org/fanboy-social.txt",
     "~user~786254"
   ];
-  var knownSubscriptions = Object.create(null);
-  for (var subscriptionUrl of subscriptions)
-    knownSubscriptions[subscriptionUrl] = modules.subscriptionClasses.Subscription.fromURL(subscriptionUrl);
-  var customSubscription = knownSubscriptions["~user~786254"];
+  let knownSubscriptions = Object.create(null);
+  for (let subscriptionUrl of subscriptions)
+  {
+    knownSubscriptions[subscriptionUrl] =
+      modules.subscriptionClasses.Subscription.fromURL(subscriptionUrl);
+  }
+  let customSubscription = knownSubscriptions["~user~786254"];
 
   if (params.addSubscription)
   {
     // We don't know how long it will take for the page to fully load
     // so we'll post the message after one second
-    setTimeout(function()
+    setTimeout(() =>
     {
       window.postMessage({
         type: "message",
         payload: {
           title: "Custom subscription",
           url: "http://example.com/custom.txt",
           confirm: true,
           type: "subscriptions.add"
         }
       }, "*");
     }, 1000);
   }
 
-  ext.devtools.onCreated.addListener(function(panel)
+  ext.devtools.onCreated.addListener(panel =>
   {
     // blocked request
     panel.sendMessage({
       type: "add-record",
       request: {
         url: "http://adserver.example.com/ad_banner.png",
         type: "IMAGE",
         docDomain: "example.com"
       },
       filter: {
@@ skipping 55 matching lines @@
         docDomain: "example.com"
       },
       filter: {
         text: "||example.com/some-annoying-popup$popup",
         whitelisted: false,
         userDefined: true,
         subscription: null
       }
     });
   });
-})(this);
+}