Fixes #2346 - Update eslint and prettier packages. Format JS files

Gruntfile.js

@@ -10,7 +10,8 @@ module.exports = function(grunt) {
     jsDistPath: "<%= jsPath %>/dist",
     cssPath: "webcompat/static/css",
     imgPath: "webcompat/static/img",
-    banner: "/*! <%= pkg.title %>\n" +
+    banner:
+      "/*! <%= pkg.title %>\n" +
       ' *  Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>\n' +
       " *\n" +
       " *  This code is licensed under the MPL 2.0 License, except where\n" +

grunt-tasks/cssnext.js

@@ -23,7 +23,8 @@ module.exports = function(grunt) {
     },
     dist: {
       files: {
-        "<%= cssPath %>/dist/webcompat.min.css": "<%= cssPath %>/webcompat.dev.css"
+        "<%= cssPath %>/dist/webcompat.min.css":
+          "<%= cssPath %>/webcompat.dev.css"
       }
     }
   });

package.json

@@ -25,9 +25,9 @@
     "yargs": "^11.0.0"
   },
   "devDependencies": {
-    "eslint": "~3.19.0",
-    "eslint-config-prettier": "^1.7.0",
-    "eslint-plugin-prettier": "^2.0.1",
+    "eslint": "^4.19.1",
+    "eslint-config-prettier": "^2.9.0",
+    "eslint-plugin-prettier": "^2.6.0",
     "grunt": "^1.0.1",
     "grunt-check-dependencies": "^1.0.0",
     "grunt-cli": "^1.2.0",
@@ -49,7 +49,7 @@
     "postcss-import": "^8.2.0",
     "postcss-reporter": "^3.0.0",
     "postcss-url": "^5.1.2",
-    "prettier": "1.1.0",
+    "prettier": "^1.12.1",
     "stylelint": "^8.4.0",
     "stylelint-config-standard": "^18.0.0",
     "stylelint-order": "^0.8.1",

tests/functional/index-non-auth.js

@@ -101,7 +101,7 @@ registerSuite("Index", {
         .then(function(text) {
           assert.match(
             text,
-            /^Opened:\s\d{4}\-\d{2}\-\d{2}/,
+            /^Opened:\s\d{4}-\d{2}-\d{2}/,
             "Issue should display creation date"
           );
         })

tests/functional/issue-list-non-auth.js

@@ -67,7 +67,7 @@ registerSuite("Issue-list", {
         .then(function(text) {
           assert.match(
             text,
-            /^Opened:\s\d{4}\-\d{2}\-\d{2}/,
+            /^Opened:\s\d{4}-\d{2}-\d{2}/,
             "Issue should display creation date"
           );
         })

tests/functional/lib/helpers.js

@@ -45,7 +45,9 @@ function login(context) {
 }
 
 function logout(context) {
-  return openPage(context, url("/logout"), "body").clearCookies().end();
+  return openPage(context, url("/logout"), "body")
+    .clearCookies()
+    .end();
 }
 
 module.exports = {

tests/functional/search-auth.js

@@ -8,9 +8,10 @@ const { registerSuite } = intern.getInterface("object");
 const FunctionalHelpers = require("./lib/helpers.js");
 
 var url = function(path, params) {
-  var fullUrl = params !== undefined
-    ? intern.config.siteRoot + path + params
-    : intern.config.siteRoot + path;
+  var fullUrl =
+    params !== undefined
+      ? intern.config.siteRoot + path + params
+      : intern.config.siteRoot + path;
   return fullUrl;
 };
 

tests/functional/user-activity-auth.js

@@ -83,7 +83,7 @@ registerSuite("User Activity (auth)", {
         .then(function(text) {
           assert.match(
             text,
-            /^Opened:\s\d{4}\-\d{2}\-\d{2}/,
+            /^Opened:\s\d{4}-\d{2}-\d{2}/,
             "Issue should display creation date"
           );
         })

webcompat/static/js/lib/bugform.js

@@ -38,7 +38,8 @@ function BugForm() {
       el: $("#image"),
       // image should be valid by default because it's optional
       valid: true,
-      helpText: "Image must be one of the following: jpe, jpg, jpeg, png, gif, or bmp.",
+      helpText:
+        "Image must be one of the following: jpe, jpg, jpeg, png, gif, or bmp.",
       altHelpText: "Please choose a smaller image (< 4MB)"
     },
     browser: {
@@ -348,9 +349,10 @@ function BugForm() {
 
     var inlineHelp = $("<small></small>", {
       class: "label-icon-message form-message-error",
-      text: opts && opts.altHelp
-        ? this.inputs[id].altHelpText
-        : this.inputs[id].helpText
+      text:
+        opts && opts.altHelp
+          ? this.inputs[id].altHelpText
+          : this.inputs[id].helpText
     });
 
     this.inputs[id].valid = false;

webcompat/static/js/lib/contributors.js

@@ -21,8 +21,14 @@ $(function() {
   // try to open the right section and scroll there.
   var id;
   if ((id = location.hash)) {
-    if (!$(id).find(".contributors__item__btn").hasClass(ACTIVE_CLASS)) {
-      $(id).parent().trigger("click");
+    if (
+      !$(id)
+        .find(".contributors__item__btn")
+        .hasClass(ACTIVE_CLASS)
+    ) {
+      $(id)
+        .parent()
+        .trigger("click");
     }
     window.scrollTo(0, $(id).offset().top);
   }

webcompat/static/js/lib/editor.js

@@ -105,7 +105,7 @@ issues.CategoryEditorView = Backbone.View.extend({
     }, 100);
 
     var escape = function(s) {
-      return s.replace(/[-\/\\^$*+?:.()|[\]{}]/g, "\\$&");
+      return s.replace(/[-/\\^$*+?:.()|[\]{}]/g, "\\$&");
     };
     var re = new RegExp("^" + escape(e.target.value), "i");
     var toHide = _.filter(this.model.toArray(), function(label) {
@@ -124,7 +124,9 @@ issues.CategoryEditorView = Backbone.View.extend({
   }, 100),
   checkUncheckItems: _.debounce(function(e) {
     if (e.keyCode === 13) {
-      $(e.target).click().addClass("focused");
+      $(e.target)
+        .click()
+        .addClass("focused");
     }
   }, 100),
   focusSaveClose: _.debounce(function(e) {
@@ -135,7 +137,9 @@ issues.CategoryEditorView = Backbone.View.extend({
   }, 1),
   removeFocus: _.debounce(function(e) {
     if (e.keyCode === 9) {
-      $(e.target).closest("label").removeClass("focused");
+      $(e.target)
+        .closest("label")
+        .removeClass("focused");
     }
   }, 100),
   backToTop: _.debounce(function(e) {

webcompat/static/js/lib/flash-message.js

@@ -24,7 +24,11 @@ var FlashMessageView = Backbone.View.extend({
     wcEvents.on("flash:thanks", _.bind(this.showThanks, this));
   },
   render: function(message) {
-    this.$el.html(message).addClass("is-active").appendTo("body").show();
+    this.$el
+      .html(message)
+      .addClass("is-active")
+      .appendTo("body")
+      .show();
 
     return this;
   },

webcompat/static/js/lib/homepage.js

@@ -13,9 +13,10 @@ function HomePage() {
 
   this.init = function() {
     reportButton.add(reportLink).on("click", this.toggleForm);
-    var htmlClass = "ontouchstart" in window || "createTouch" in document
-      ? "touch"
-      : "no-touch";
+    var htmlClass =
+      "ontouchstart" in window || "createTouch" in document
+        ? "touch"
+        : "no-touch";
     document.documentElement.classList.add(htmlClass);
 
     // Open the form if we've got open=1 param in the URL

webcompat/static/js/lib/issue-list.js

@@ -71,7 +71,10 @@ issueList.DropdownView = Backbone.View.extend({
       e.preventDefault();
     }
 
-    option.addClass("is-active").siblings().removeClass("is-active");
+    option
+      .addClass("is-active")
+      .siblings()
+      .removeClass("is-active");
   },
   manuallyUpdateDropdownTitle: function(optionElm, e) {
     // make sure we're only updating the title if we're operating
@@ -122,7 +125,10 @@ issueList.FilterView = Backbone.View.extend({
       btn = $(e.target);
     }
 
-    btn.toggleClass("is-active").siblings().removeClass("is-active");
+    btn
+      .toggleClass("is-active")
+      .siblings()
+      .removeClass("is-active");
 
     // Clear the search field
     issueList.events.trigger("search:clear");

webcompat/static/js/lib/issues.js

@@ -147,7 +147,10 @@ issues.BodyView = Backbone.View.extend({
       .addClass("is-hidden");
 
     if (this.mainView._isNSFW) {
-      issueDesc.find("img").closest("p").addClass("wc-Comment-content-nsfw");
+      issueDesc
+        .find("img")
+        .closest("p")
+        .addClass("wc-Comment-content-nsfw");
     }
 
     return this;
@@ -189,7 +192,8 @@ issues.ImageUploadView = Backbone.View.extend({
       elm: ".js-buttonUpload",
       // image should be valid by default because it's optional
       valid: true,
-      helpText: "Please select an image of the following type: jpg, png, gif, or bmp."
+      helpText:
+        "Please select an image of the following type: jpg, png, gif, or bmp."
     }
   },
   validateAndUpload: function(e) {
@@ -242,7 +246,9 @@ issues.ImageUploadView = Backbone.View.extend({
   },
   // Adapted from bugform.js
   checkImageTypeValidity: function(input) {
-    var splitImg = $(input).val().split(".");
+    var splitImg = $(input)
+      .val()
+      .split(".");
     var ext = splitImg[splitImg.length - 1];
     var allowed = ["jpg", "jpeg", "jpe", "png", "gif", "bmp"];
     if (!_.includes(allowed, ext)) {
@@ -481,7 +487,9 @@ issues.MainView = Backbone.View.extend(
 
       if (this._isNSFW) {
         _.each(commentElm.find("img"), function(elm) {
-          $(elm).closest("p").addClass("wc-Comment-content-nsfw");
+          $(elm)
+            .closest("p")
+            .addClass("wc-Comment-content-nsfw");
         });
       }
     },
@@ -513,10 +521,13 @@ issues.MainView = Backbone.View.extend(
       // make sure we've got a reference to the <img> element,
       // (small images won't extend to the width of the containing
       // p.nsfw)
-      var target = e.target.nodeName === "IMG"
-        ? e.target
-        : e.target.nodeName === "P" && e.target.firstElementChild;
-      $(target).parent().toggleClass("wc-Comment-content-nsfw--display");
+      var target =
+        e.target.nodeName === "IMG"
+          ? e.target
+          : e.target.nodeName === "P" && e.target.firstElementChild;
+      $(target)
+        .parent()
+        .toggleClass("wc-Comment-content-nsfw--display");
     },
     render: function() {
       this.$el.removeClass("is-hidden");

webcompat/static/js/lib/mixins/extend-md-sanitizer.js

@@ -7,7 +7,7 @@ function MarkdownSanitizerMixin() {
     // specify only valid tags. we don't want to inject evil <script> tags or stuff like that
     ["details", "summary"].forEach(function(tag) {
       md = md.replace(
-        new RegExp("&lt;(\/?)" + tag + "&gt;", "g"),
+        new RegExp("&lt;(/?)" + tag + "&gt;", "g"),
         "<$1" + tag + ">"
       );
     });

webcompat/static/js/lib/models/comment.js

@@ -26,15 +26,16 @@ issues.Comment = Backbone.Model.extend({
       body: md.render(response.body),
       commenter: response.user.login,
       commentLinkId: "issuecomment-" + response.id,
-      createdAt: moment(Date.now()).diff(response.created_at, "weeks") > 1
-        ? moment(response.created_at).format("YYYY-MM-DD")
-        : moment(response.created_at).fromNow(),
+      createdAt:
+        moment(Date.now()).diff(response.created_at, "weeks") > 1
+          ? moment(response.created_at).format("YYYY-MM-DD")
+          : moment(response.created_at).fromNow(),
       rawBody: response.body
     });
     var linkHeader = jqXHR.xhr.getResponseHeader("Link");
     if (linkHeader !== null && !!this.parseHeader(linkHeader).last) {
       response.lastPageNumber = this.parseHeader(linkHeader).last.split(
-        "\?page\="
+        "?page="
       )[1];
     } else {
       response.lastPageNumber = "1";
@@ -53,7 +54,7 @@ issues.Comment = Backbone.Model.extend({
     var result = {};
     var entries = linkHeader.split(",");
     var relsRegExp = /\brel="?([^"]+)"?\s*;?/;
-    var keysRegExp = /(\b[0-9a-z\.-]+\b)/g;
+    var keysRegExp = /(\b[0-9a-z.-]+\b)/g;
     var sourceRegExp = /^<(.*)>/;
 
     for (var i = 0; i < entries.length; i++) {

webcompat/static/js/lib/models/issue.js

@@ -158,7 +158,7 @@ issueList.IssueCollection = Backbone.Collection.extend({
     var result = {};
     var entries = linkHeader.split(",");
     var relsRegExp = /\brel="?([^"]+)"?\s*;?/;
-    var keysRegExp = /(\b[0-9a-z\.-]+\b)/g;
+    var keysRegExp = /(\b[0-9a-z.-]+\b)/g;
     var sourceRegExp = /^<(.*)>/;
 
     for (var i = 0; i < entries.length; i++) {
@@ -208,7 +208,7 @@ issueList.IssueCollection = Backbone.Collection.extend({
       creator: "author",
       mentioned: "mentions"
     };
-    var sitesearchRegExp = /site:([\w-\.]+(:\d+)?)/g;
+    var sitesearchRegExp = /site:([\w-.]+(:\d+)?)/g;
     var repoPath = $("main").data("repoPath");
 
     if (_.isString(paramsArg)) {

webcompat/static/js/lib/models/label-list.js

@@ -5,22 +5,22 @@
 var issues = issues || {}; // eslint-disable-line no-use-before-define
 
 /**
-* A LabelList is a list of labels.
-*
-* It takes care of all namespace prefixing and unprefixing, so that
-* the rest of the app doesn't ever need to worry about those details.
-* To initialize, either pass in a list of labels as an array of strings
-* or an array of objects:
-*
-* new issues.LabelList({labels: ['firefox', 'ie', 'chrome']});
-*
-* new issues.LabelList({labels: [{name:'status-worksforme', url:'...',
-*    color:'cccccc'}]});
-*
-* Or a URL to a JSON file describing the labels:
-*
-* new issues.LabelList({url:'/path/to/labels.json'});
-*/
+ * A LabelList is a list of labels.
+ *
+ * It takes care of all namespace prefixing and unprefixing, so that
+ * the rest of the app doesn't ever need to worry about those details.
+ * To initialize, either pass in a list of labels as an array of strings
+ * or an array of objects:
+ *
+ * new issues.LabelList({labels: ['firefox', 'ie', 'chrome']});
+ *
+ * new issues.LabelList({labels: [{name:'status-worksforme', url:'...',
+ *    color:'cccccc'}]});
+ *
+ * Or a URL to a JSON file describing the labels:
+ *
+ * new issues.LabelList({url:'/path/to/labels.json'});
+ */
 
 issues.LabelList = Backbone.Model.extend({
   initialize: function() {