Adding eslint to do basic linting for JS and HTML files

Change-Id: Id37e35c3fff08b0a13ca8cad8f23a1b925fafa35

.gitignore

@@ -1,6 +1,7 @@
 # Coverage File
 coverage.out
 tools/bin
+tools/*node*
 
 # Generated binaries
 bin

Makefile

@@ -1,13 +1,18 @@
 # Copyright (c) 2019 VMware, Inc. All Rights Reserved.
 # SPDX-License-Identifier: Apache-2.0
 
+# Export path so that the JS linting tools can get access to npm & node
+# this has to be done before the shell invocation
 SHELL=/bin/bash
+
 # Obtain the version and git commit info
 GIT_VERSION=$(shell git describe --match 'v*' --always)
 
 TOOLBINDIR    := tools/bin
+WEBDIR        := web
 LINTER        := $(TOOLBINDIR)/golangci-lint
 LINTER_CONFIG := .golangci.yaml
+JSLINTER_BIN  := $(realpath tools)/node-v12.16.3/bin
 
 COVERAGE_OUTPUT := coverage.out
 
@@ -80,6 +85,8 @@ docs:
 .PHONY: lint
 lint: $(LINTER)
 	$(LINTER) run --config $(LINTER_CONFIG)
+	cd $(WEBDIR) && (PATH="$(PATH):$(JSLINTER_BIN)"; $(JSLINTER_BIN)/npx --no-install eslint js) && cd ..
+	cd $(WEBDIR) && (PATH="$(PATH):$(JSLINTER_BIN)"; $(JSLINTER_BIN)/npx --no-install eslint --ext .html .) && cd ..
 
 $(LINTER):
 	@mkdir -p $(TOOLBINDIR)

tools/install_linter

@@ -4,8 +4,50 @@ set -x
 tools_bin_dir="${BASH_SOURCE%/*}"
 download_url=https://raw.githubusercontent.com/golangci/golangci-lint/master/install.sh
 version=v1.24.0
+node_version=v12.16.3
 
 if ! curl -sfL "$download_url" | sh -s -- -b "$tools_bin_dir/bin" "$version"; then
   printf "Something went wrong while installing golangci-lint\n" 1>&2
   exit 1
 fi
+
+if [[ "$OSTYPE" == "linux-gnu"* ]]; then
+  # Linux
+  if ! curl -sfL "https://nodejs.org/dist/$node_version/node-$node_version-linux-x64.tar.gz" | tar zxf - --directory "$tools_bin_dir"; then
+    printf "Something went wrong while installing linux-gnu nodejs\n" 1>&2
+    exit 1
+  else
+    mv $tools_bin_dir/node-$node_version-linux-x64 $tools_bin_dir/node-$node_version
+  fi
+elif [[ "$OSTYPE" == "darwin"* ]]; then
+  # Mac OSX        
+  if ! curl -sfL "https://nodejs.org/dist/$node_version/node-$node_version-darwin-x64.tar.gz" | tar zxf - --directory "$tools_bin_dir"; then
+    printf "Something went wrong while installing Mac OSX nodejs\n" 1>&2
+    exit 1
+  else
+    mv $tools_bin_dir/node-$node_version-darwin-x64 $tools_bin_dir/node-$node_version
+  fi
+elif [[ "$OSTYPE" == "cygwin" ]]; then
+  # Windows
+  if ! wget -qO- https://nodejs.org/dist/$node_version/node-$node_version-win-x64.zip | bsdtar -xf- -C tools; then
+    printf "Something went wrong while installing Windows nodejs\n" 1>&2
+    exit 1
+  else
+    mv $tools_bin_dir/node-$node_version-win-x64 $tools_bin_dir/node-$node_version
+    # the windows install doesn't conform to the same directory structure so making it conform
+    mkdir $tools_bin_dir/node-$node_version/bin
+    mv $tools_bin_dir/node-$node_version/n* $tools_bin_dir/node-$node_version/bin
+    chmod -R a+x $tools_bin_dir/node-$node_version/bin
+  fi
+fi
+
+# npm requires node to also be on the path
+export PATH=$(realpath $tools_bin_dir)/node-$node_version/bin:$PATH
+
+# npm will write to a node_modules even with the --directory flag it's better to be in the root of where you want this to live
+cd web
+if ! npm install eslint-plugin-html@latest --save-dev; then
+  printf "Something went wrong while installing eslint-plugin-html\n" 1>&2
+  exit 1
+fi
+cd ..

web/.eslintignore

@@ -0,0 +1 @@
+js/main.js

web/.eslintrc.json

@@ -0,0 +1,34 @@
+{
+    "parserOptions": {
+        "ecmaVersion": 6,
+        "sourceType": "module",
+        "ecmaFeatures": {
+            "jsx": true
+        }
+    },
+    "env": {
+        "browser": true,
+        "es6": true
+    },
+    "plugins": [
+        "eslint-plugin-html",
+        "html"
+    ],
+    "rules": {
+        "array-bracket-newline": "error",
+        "curly": "error",
+        "eqeqeq": "error",
+        "no-redeclare": "error",
+        "no-unused-expressions": "error",
+        "no-unused-vars": "error",
+        "no-useless-escape": "error",
+        "quotes": [
+            "error",
+            "double"
+        ],
+        "semi-style": [
+            "error",
+            "last"
+        ]
+    }
+}

web/js/common.js

@@ -31,7 +31,7 @@ if (document.addEventListener) {
 }
 
 // add dashboard links to Plugins if present in $HOME/.airshipui/plugins.json
-function addPlugins(json) {
+function addPlugins(json) { // eslint-disable-line no-unused-vars
     let dropdown = document.getElementById("PluginDropdown");
     for (let i = 0; i < json.length; i++) {
         let dash = json[i];
@@ -44,24 +44,24 @@ function addPlugins(json) {
             let view = document.getElementById("DashView");
             view.src = dash["url"];
 
-            document.getElementById("MainDiv").style.display = 'none';
-            document.getElementById("DashView").style.display = '';
+            document.getElementById("MainDiv").style.display = "none";
+            document.getElementById("DashView").style.display = "";
         }
 
         dropdown.appendChild(a);
     }
 }
 
-function authenticate(json) {
+function authenticate(json) { // eslint-disable-line no-unused-vars
     // use webview to display the auth page
     let view = document.getElementById("DashView");
     view.src = json["url"];
 
-    document.getElementById("MainDiv").style.display = 'none';
-    document.getElementById("DashView").style.display = '';
+    document.getElementById("MainDiv").style.display = "none";
+    document.getElementById("DashView").style.display = "";
 }
 
-function removeElement(id) {
+function removeElement(id) { // eslint-disable-line no-unused-vars
     if (document.contains(document.getElementById(id))) {
         document.getElementById(id).remove();
     }

web/js/websocket.js

@@ -25,14 +25,14 @@ if (document.addEventListener) {
 }
 
 // listen for the unload event and close the web socket if open
-document.addEventListener('unload', function () {
+document.addEventListener("unload", function () {
     if (ws !== null) {
         if (ws.readyState !== ws.CLOSED) { ws.close(); }
     }
 });
 
 function register() {
-    if (ws != null) {
+    if (ws !== null) {
         ws.close();
         ws = null;
     }
@@ -48,7 +48,7 @@ function register() {
         close(event.code);
     }
 
-    ws.onopen = function (event) {
+    ws.onopen = function () {
         open();
     }
 
@@ -113,10 +113,10 @@ function close(code) {
 }
 
 function authComplete() {
-    document.getElementById("HeaderDiv").style.display = '';
-    document.getElementById("MainDiv").style.display = '';
-    document.getElementById("DashView").style.display = 'none';
-    document.getElementById("FooterDiv").style.display = '';
+    document.getElementById("HeaderDiv").style.display = "";
+    document.getElementById("MainDiv").style.display = "";
+    document.getElementById("DashView").style.display = "none";
+    document.getElementById("FooterDiv").style.display = "";
 }
 
 function keepAlive() {
@@ -132,7 +132,7 @@ function keepAlive() {
     }
 }
 
-function sendMessage(json) {
+function sendMessage(json) { // eslint-disable-line no-unused-vars
     if (ws.readyState === WebSocket.CLOSED) {
         register();
     }

web/package.json

@@ -9,7 +9,9 @@
   "author": "The Airship Authors",
   "license": "ISC",
   "devDependencies": {
-    "electron": "^8.2.5"
+    "electron": "^8.2.5",
+    "eslint": "^6.8.0",
+    "eslint-plugin-html": "^6.0.2"
   },
   "dependencies": {
     "electron-json-config": "^1.5.3",