refactor: switch to typescript (#322)

.babelrc

@@ -0,0 +1,3 @@
+{
+  "plugins": ["@babel/plugin-proposal-optional-chaining"]
+}

.eslintignore

@@ -1,3 +1,3 @@
 /src/ui/vendor
-/src/background/lib.js
-*.html
+*.html
+/dist

.eslintrc.json

@@ -1,18 +1,19 @@
 {
+  "parserOptions": {
+    "parser": "@typescript-eslint/parser",
+    "ecmaVersion": 2018
+  },
   "env": {
     "browser": true,
     "webextensions": true,
-    "es6": true,
-    "node": true
+    "node": true,
+    "es6": true
   },
   "extends": [
-    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
     "plugin:vue/recommended",
     "plugin:prettier/recommended",
-    "prettier/vue"
-  ],
-  "parserOptions": {
-    "parser": "babel-eslint",
-    "ecmaVersion": 2018
-  }
+    "prettier/vue",
+    "prettier/@typescript-eslint"
+  ]
 }

.travis.yml

@@ -10,7 +10,7 @@ addons:
 
 script:
   - if [[ $TRAVIS_TAG == *"beta"* ]]; then
-    npm run build:sign;
+    npm run build:beta;
     else
     unset WEB_EXT_API_KEY;
     unset WEB_EXT_API_SECRET;

build-sign.js → build-sign.ts

@@ -1,7 +1,9 @@
-const fs = require('fs');
+import fs from 'fs';
+// eslint-disable-next-line @typescript-eslint/no-var-requires
 const manifestJson = require('./src/manifest.json');
 const updateUrl =
   'https://raw.githubusercontent.com/stoically/temporary-containers/beta-updates/updates.json';
+// eslint-disable-next-line @typescript-eslint/camelcase
 manifestJson.applications.gecko.update_url = updateUrl;
 
 // eslint-disable-next-line quotes

package.json

@@ -5,21 +5,26 @@
   "scripts": {
     "coverage": "nyc report --reporter=text-lcov | coveralls",
     "clean": "rimraf web-ext-artifacts .web-ext-artifacts .cache dist",
-    "build": "npm run lint && npm run test && npm run test:functional && npm run build:parcel && npm run build:cp && npm run build:webext && npm run lint:addon && ncu",
-    "build:parcel": "npm run clean && parcel build src/background.js src/*.html --no-minify --no-source-maps",
-    "build:sign": "node build-sign.js && npm run lint && npm run test && npm run test:functional && npm run build:parcel && npm run build:cp && npm run build:webext:sign && git checkout -- src/manifest.json && ncu",
+    "build": "npm-run-all build:core build:webext lint:addon check:dependencies",
+    "build:core": "npm-run-all lint test test:functional build:parcel build:contentscript build:cp",
+    "build:parcel": "npm run clean && parcel build src/background.ts src/*.html --no-minify --no-source-maps",
+    "build:contentscript": "tsc -p tsconfig.build.json",
     "build:webext": "web-ext build -s dist",
-    "build:webext:sign": "web-ext sign --channel unlisted -s dist",
-    "build:cp": "cp README.md LICENSE dist",
-    "lint": "eslint {*,src/**/*,test/**/*}.{js,vue}",
+    "build:cp": "copyfiles README.md LICENSE dist",
+    "build:beta": "npm-run-all build:beta:sign build:core build:beta:webext build:beta:checkout",
+    "build:beta:sign": "ts-node build-sign.ts",
+    "build:beta:checkout": "git checkout -- src/manifest.json",
+    "build:beta:webext": "web-ext sign --channel unlisted -s dist",
+    "lint": "npm run lint:eslint && tsc",
+    "lint:eslint": "eslint *.js src/**/*.{ts,js,vue} test/**/*.ts",
     "lint:addon": "addons-linter web-ext-artifacts/temporary_containers-*.zip",
     "format": "prettier --write '{*,src/**/*,test/**/*}.{html,css,json,yml,md}'",
-    "test": "npm run build:parcel && nyc --reporter=html --reporter=text mocha --reporter=progress ./test/setup.js test/*.test.js --timeout 60000",
-    "test:watch": "mocha ./test/setup.js test/*.test.js -b --reporter=progress --watch --watch-files 'src/**/*.js' --delay --inspect",
-    "test:watch:verbose": "mocha ./test/setup.js test/*.test.js -b --reporter=spec --tmp-debug --watch --inspect",
-    "test:functional": "npm run build:parcel && mocha ./test/functional/*.test.js --timeout 10000",
+    "test": "nyc --reporter=html --reporter=text ts-mocha --paths -p tsconfig.json -b --reporter=progress test/*.test.ts",
+    "test:watch": "ts-mocha --paths -p tsconfig.json test/*.test.ts -b --reporter=progress --watch",
+    "test:watch:verbose": "ts-mocha --paths -p tsconfig.json test/*.test.ts -b --reporter=spec --tmp-debug --watch",
+    "test:functional": "npm run build:parcel && ts-mocha ./test/functional/*.test.ts --timeout 10000",
     "check:dependencies": "ncu",
-    "watch": "rimraf dist && parcel src/background.js src/*.html --hmr-hostname=localhost"
+    "watch": "rimraf dist && parcel src/background.ts src/*.html --hmr-hostname=localhost"
   },
   "repository": {
     "type": "git",
@@ -33,33 +38,56 @@
   "homepage": "https://github.com/stoically/temporary-containers#readme",
   "dependencies": {
     "delay": "4.3.0",
-    "p-queue": "6.2.0",
-    "psl": "1.4.0"
+    "p-queue": "6.2.1",
+    "psl": "1.4.0",
+    "vue": "2.6.10"
   },
   "peerDependencies": {
     "jquery": "3.4.1",
     "jquery-address": "1.6.0",
     "semantic-ui": "2.4.2",
     "sortablejs": "1.10.1",
-    "vue": "2.6.10",
     "vuedraggable": "2.23.2"
   },
   "devDependencies": {
+    "@babel/core": "^7.7.4",
+    "@babel/plugin-proposal-optional-chaining": "^7.7.4",
     "@commitlint/cli": "^8.2.0",
     "@commitlint/config-conventional": "^8.2.0",
-    "@vue/component-compiler-utils": "^3.0.0",
-    "addons-linter": "^1.15.3",
+    "@istanbuljs/nyc-config-typescript": "^0.1.3",
+    "@types/chai": "^4.2.5",
+    "@types/firefox-webext-browser": "github:stoically/DefinitelyTyped#firefox-webext-browser-dist",
+    "@types/jquery": "^3.3.31",
+    "@types/jquery.address": "^1.5.29",
+    "@types/jsdom-global": "^3.0.1",
+    "@types/mocha": "^5.2.7",
+    "@types/psl": "^1.1.0",
+    "@types/semantic-ui": "^2.2.7",
+    "@types/semantic-ui-dropdown": "github:stoically/DefinitelyTyped#semantic-ui-dropdown-dist",
+    "@types/semantic-ui-form": "github:stoically/DefinitelyTyped#semantic-ui-form-dist",
+    "@types/sinon": "^7.5.1",
+    "@types/sinon-chai": "^3.2.3",
+    "@types/sinon-chrome": "^2.2.6",
+    "@typescript-eslint/eslint-plugin": "^2.9.0",
+    "@typescript-eslint/parser": "^2.9.0",
+    "@vue/component-compiler-utils": "^3.0.2",
+    "addons-linter": "^1.17.0",
     "babel-eslint": "^10.0.3",
     "chai": "^4.2.0",
-    "coveralls": "^3.0.7",
-    "eslint": "^6.6.0",
-    "eslint-config-prettier": "^6.5.0",
+    "chai-deep-match": "^1.2.1",
+    "copyfiles": "^2.1.1",
+    "coveralls": "^3.0.8",
+    "eslint": "^6.7.1",
+    "eslint-config-prettier": "^6.7.0",
     "eslint-plugin-prettier": "^3.1.1",
-    "eslint-plugin-vue": "^6.0.0",
-    "husky": "^3.0.9",
+    "eslint-plugin-vue": "^6.0.1",
+    "husky": "^3.1.0",
+    "jsdom": "^15.2.1",
+    "jsdom-global": "^3.0.2",
     "lint-staged": "^10.0.0-1",
     "mocha": "^6.2.2",
-    "npm-check-updates": "^3.1.26",
+    "npm-check-updates": "^3.2.2",
+    "npm-run-all": "^4.1.5",
     "nyc": "^14.1.1",
     "parcel-bundler": "^1.12.4",
     "parcel-plugin-html-externals": "^0.1.2",
@@ -68,14 +96,19 @@
     "rimraf": "^3.0.0",
     "sinon": "^7.5.0",
     "sinon-chai": "^3.3.0",
+    "ts-mocha": "^6.0.0",
+    "ts-node": "^8.5.2",
+    "tsconfig-paths": "^3.9.0",
+    "typescript": "^3.7.2",
     "vue-hot-reload-api": "^2.3.4",
     "vue-template-compiler": "^2.6.10",
-    "web-ext": "^3.2.0",
-    "webextensions-geckodriver": "^0.6.1",
-    "webextensions-jsdom": "^0.18.1"
+    "vue-typed-mixins": "^0.2.0",
+    "web-ext": "^3.2.1",
+    "webextensions-api-fake": "^1.0.1",
+    "webextensions-geckodriver": "^0.6.1"
   },
   "browserslist": [
-    "Firefox >= 60"
+    "Firefox >= 67"
   ],
   "staticFiles": {
     "staticPath": [
@@ -87,7 +120,7 @@
     ],
     "watcherGlob": "**",
     "excludeGlob": [
-      "background.js",
+      "background.ts",
       "background",
       "background/**",
       "*.html",
@@ -113,19 +146,20 @@
     }
   },
   "lint-staged": {
-    "*.+(js|vue)": [
+    "*.{ts,js,vue}": [
       "eslint --fix",
       "git add"
     ],
-    "*.+(html|css|json|yml|md)": [
+    "*.{html,css,json,yml,md}": [
       "prettier --write",
       "git add"
     ]
   },
   "private": true,
   "nyc": {
+    "extends": "@istanbuljs/nyc-config-typescript",
     "exclude": [
-      "test/**/*.js"
+      "test/**/*.ts"
     ]
   },
   "prettier": {

src/.eslintrc.json

@@ -1,14 +1,5 @@
 {
   "env": {
-    "browser": true,
     "node": false
-  },
-  "globals": {
-    "tmp": "readonly",
-    "debug": "readonly",
-    "psl": "readonly",
-    "log": "readonly",
-    "delay": "readonly",
-    "PQueue": "readonly"
   }
 }