Introduce Prettier (#15131)

.prettierignore

@@ -0,0 +1,29 @@
+# exclude everything by default
+*.*
+
+# exclude these files
+Dockerfile*
+LICENSE
+Makefile*
+
+# exclude these directories
+.pytest_cache/
+.tox/
+/docker/
+/docs/
+/private/
+/scripts/
+/site-static/
+/src/
+/storage/
+__pycache__/
+i18n/
+img/
+node_lib/
+
+# safe-list files we want to process
+!*.js
+
+# exclude generated JS files
+*-all.js
+*-min.js

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "arrowParens": "always",
+  "singleQuote": true,
+  "trailingComma": "all",
+  "proseWrap": "never"
+}

Makefile-docker

@@ -190,6 +190,7 @@ setup-codestyle:
 .PHONY: lint
 lint: ## lint the code
 	flake8 src/ services/ tests/
+	$(shell npm $(NPM_ARGS) bin)/prettier --check '**'
 
 lint-codestyle: lint
 
@@ -250,6 +251,10 @@ run_js_tests: ## Run the JavaScript test suite (requires compiled/compressed ass
 watch_js_tests: ## Run+watch the JavaScript test suite (requires compiled/compressed assets).
 	NODE_PATH=$(NODE_MODULES) $$(npm bin $(NPM_ARGS))/jest --watch
 
+.PHONY: format
+format: ## Autoformat our codebase.
+	$(shell npm $(NPM_ARGS) bin)/prettier --write '**'
+
 .PHONY: help_submake
 help_submake:
 	@grep -E '^[a-zA-Z_-]+:.*?## .*$$' Makefile-docker | sort | awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}'

package.json

@@ -6,16 +6,16 @@
     "node": ">= 10.13"
   },
   "dependencies": {
+    "@claviska/jquery-minicolors": "2.3.5",
     "addons-linter": "2.1.0",
     "clean-css": "4.2.3",
     "clean-css-cli": "4.3.0",
     "jqmodal": "1.4.2",
     "jquery": "3.5.1",
-    "jquery.browser": "0.1.0",
-    "jquery.cookie": "1.4.1",
-    "@claviska/jquery-minicolors": "2.3.5",
     "jquery-pjax": "2.0.1",
     "jquery-ui": "1.12.1",
+    "jquery.browser": "0.1.0",
+    "jquery.cookie": "1.4.1",
     "jszip": "3.5.0",
     "less": "3.12.2",
     "source-map": "0.7.3",
@@ -25,6 +25,7 @@
   },
   "devDependencies": {
     "jest": "^26.1.0",
-    "jest-date-mock": "^1.0.8"
+    "jest-date-mock": "^1.0.8",
+    "prettier": "^2.0.5"
   }
 }

static/js/admin/l10n.js

@@ -8,19 +8,19 @@
  */
 
 django.jQuery(document).ready(function ($) {
-    if (!$('body.change-form').length) {
-        // This is only for change forms.
-        return;
-    }
+  if (!$('body.change-form').length) {
+    // This is only for change forms.
+    return;
+  }
 
-    // Each localized field will be inside a <div class="trans">. We are
-    // displaying all of them, so we want to add individual labels to let the
-    // user know which one is for which locale.
-    $('div.trans :input:visible').before(function() {
-        let $elm = $(this);
-        let $label = $('<label>');
-        $label.prop('for', $elm.attr('id'))
-        $label.text('[' + $elm.attr('lang') + ']');
-        return $label;
-    })
+  // Each localized field will be inside a <div class="trans">. We are
+  // displaying all of them, so we want to add individual labels to let the
+  // user know which one is for which locale.
+  $('div.trans :input:visible').before(function () {
+    let $elm = $(this);
+    let $label = $('<label>');
+    $label.prop('for', $elm.attr('id'));
+    $label.text('[' + $elm.attr('lang') + ']');
+    return $label;
+  });
 });

static/js/admin/recalc_hash.js

@@ -1,31 +1,30 @@
-django.jQuery(document).ready(function ($){
-    "use strict";
+django.jQuery(document).ready(function ($) {
+  'use strict';
 
-    // Recalculate Hash
-    $('.recalc').click(function(e) {
-        var $this = $(this),
-            csrf = $("input[name='csrfmiddlewaretoken']").val();
-        e.preventDefault();
+  // Recalculate Hash
+  $('.recalc').click(function (e) {
+    var $this = $(this),
+      csrf = $("input[name='csrfmiddlewaretoken']").val();
+    e.preventDefault();
 
-        $.ajax($this.attr('href'), {
-
-            "headers": {'X-CSRFToken': csrf},
-            "dataType": "json",
-            "method": "POST",
-            "beforeSend": function () {
-                $this.html('Recalcing…');
-            },
-            "success": function() {
-                $this.text('Done!');
-            },
-            "error": function() {
-                $this.text('Error :(');
-            },
-            "complete": function() {
-                setTimeout(function() {
-                    $this.text('Recalc Hash');
-                }, 2000);
-            }
-        });
+    $.ajax($this.attr('href'), {
+      headers: { 'X-CSRFToken': csrf },
+      dataType: 'json',
+      method: 'POST',
+      beforeSend: function () {
+        $this.html('Recalcing…');
+      },
+      success: function () {
+        $this.text('Done!');
+      },
+      error: function () {
+        $this.text('Error :(');
+      },
+      complete: function () {
+        setTimeout(function () {
+          $this.text('Recalc Hash');
+        }, 2000);
+      },
     });
+  });
 });

static/js/amo2009/addons.js

@@ -1,24 +1,30 @@
-
 /* TODO(jbalogh): save from amo2009. */
 /**
  * bandwagon: fire a custom refresh event for bandwagon extension
  * @return void
  */
 function bandwagonRefreshEvent() {
-    if (document.createEvent) {
-        var bandwagonSubscriptionsRefreshEvent = document.createEvent("Events");
-        bandwagonSubscriptionsRefreshEvent.initEvent("bandwagonRefresh", true, false);
-        document.dispatchEvent(bandwagonSubscriptionsRefreshEvent);
-    }
+  if (document.createEvent) {
+    var bandwagonSubscriptionsRefreshEvent = document.createEvent('Events');
+    bandwagonSubscriptionsRefreshEvent.initEvent(
+      'bandwagonRefresh',
+      true,
+      false,
+    );
+    document.dispatchEvent(bandwagonSubscriptionsRefreshEvent);
+  }
 }
 
 /* TODO(jbalogh): save from amo2009. */
 /* Remove "Go" buttons from <form class="go" */
-$(document).ready(function(){
-    $('form.go').change(function() { this.submit(); })
-        .find('button').hide();
+$(document).ready(function () {
+  $('form.go')
+    .change(function () {
+      this.submit();
+    })
+    .find('button')
+    .hide();
 });
 
-
 // TODO(jbalogh): save from amo2009.
 var AMO = {};