Update dependencies and add npm setup script

- Introduce `fresh-npm-install.sh` to automate clean npm environment
  setup.
- Revert workaround 924b326244, resolved
  by updating Font Awesome.
- Remove `vue-template-compiler` and `@vue/test-utils` from
  dependencies, they're obsolete in 2.7.
- Update anchor references to start with lower case in line with
  MD051/link-fragments, introduced by updated `markdownlint`.
- Upgrade cypress to > 10, which includes:
  - Change spec extensions from `*.spec.js` to `*.cy.js`.
  - Change configuration file from `cypress.json` to
    `cypress.config.ts`.
  - Remove most configurations from `cypress/plugins/index.js`. These
    configurations were initially generated by Vue CLI but obsoleted in
    newer cypress versions.
- Lock Typescript version to 4.6.x due to lack of support in
  unmaintained Vue CLI TypeScript plugin (see vuejs/vue-cli#7401).
- Use `setWindowOpenHandler` on Electron, replacing deprecated
  `new-event` event.
- Document inability to upgrade `typescript-eslint` dependencies because
  `@vue/eslint-config-typescript` does not support them. See
   vuejs/eslint-config-typescript#60, vuejs/eslint-config-typescript#59,
   vuejs/eslint-config-typescript#57.
- Fix `typescript` version to 4.6.X and `tslib` version to 2.4.x,
  unit tests exit with a maximum call stack size exceeded error:

  ```
    ...
    MOCHA  Testing...
    RUNTIME EXCEPTION  Exception occurred while loading your tests
    [=========================] 100% (completed)
    RangeError: Maximum call stack size exceeded
      at RegExp.exec (<anonymous>)
      at retrieveSourceMapURL (/project/node_modules/source-map-support/source-map-support.js:174:21)
      at Array.<anonymous> (/project/node_modules/source-map-support/source-map-support.js:186:26)
      at /project/node_modules/source-map-support/source-map-support.js:85:24
      at mapSourcePosition (/project/node_modules/source-map-support/source-map-support.js:216:21)
    ...
  ```

  Issue has been reported but not fixed, suggested solutions did not
  work, see evanw/node-source-map-support#252.
- Update `vue-cli-plugin-electron-builder` to latest alpha version. This
  allows upgrading `ts-loader` to latest and using latest
  `electron-builder`. Change `main` property value in `package.json` to
  `index.js` for successful electron builds (see
  nklayman/vue-cli-plugin-electron-builder#188).

.eslintrc.js

@@ -27,7 +27,14 @@ module.exports = {
     '@vue/typescript/recommended',
   ],
   parserOptions: {
-    ecmaVersion: 'latest',
+    ecmaVersion: 12, // ECMA 2021
+    /*
+      Having 'latest' leads to:
+      ```
+        Parsing error: ecmaVersion must be a number. Received value of type string instead
+      ```
+      For .js files in the project
+    */
   },
   rules: {
     ...getOwnRules(),

cypress.config.ts

@@ -0,0 +1,14 @@
+import { defineConfig } from 'cypress'
+
+export default defineConfig({
+  fixturesFolder: 'tests/e2e/fixtures',
+  screenshotsFolder: 'tests/e2e/screenshots',
+  videosFolder: 'tests/e2e/videos',
+  e2e: {
+    setupNodeEvents(on, config) {
+      return require('./tests/e2e/plugins/index.js')(on, config)
+    },
+    specPattern: 'tests/e2e/specs/**/*.cy.{js,jsx,ts,tsx}',
+    supportFile: 'tests/e2e/support/index.js',
+  },
+});

cypress.json

@@ -1,3 +0,0 @@
-{
-  "pluginsFile": "tests/e2e/plugins/index.js"
-}

docs/collection-files.md

@@ -2,8 +2,8 @@
 
 - privacy.sexy is a data-driven application where it reads the necessary OS-specific logic from yaml files in [`application/collections`](./../src/application/collections/)
 - 💡 Best practices
-  - If you repeat yourself, try to utilize [YAML-defined functions](#Function)
+  - If you repeat yourself, try to utilize [YAML-defined functions](#function)
-  - Always try to add documentation and a way to revert a tweak in [scripts](#Script)
+  - Always try to add documentation and a way to revert a tweak in [scripts](#script)
 - 📖 Types in code: [`collection.yaml.d.ts`](./../src/application/collections/collection.yaml.d.ts)
 
 ## Objects
@@ -13,19 +13,19 @@
 - A collection simply defines:
   - different categories and their scripts in a tree structure
   - OS specific details
-- Also allows defining common [function](#Function)s to be used throughout the collection if you'd like different scripts to share same code.
+- Also allows defining common [function](#function)s to be used throughout the collection if you'd like different scripts to share same code.
 
 #### `Collection` syntax
 
 - `os:` *`string`*  (**required**)
   - Operating system that the [Collection](#collection) is written for.
   - 📖 See [OperatingSystem.ts](./../src/domain/OperatingSystem.ts) enumeration for allowed values.
-- `actions: [` ***[`Category`](#Category)*** `, ... ]` **(required)**
+- `actions: [` ***[`Category`](#category)*** `, ... ]` **(required)**
   - Each [category](#category) is rendered as different cards in card presentation.
   - ❗ A [Collection](#collection) must consist of at least one category.
-- `functions: [` ***[`Function`](#Function)*** `, ... ]`
+- `functions: [` ***[`Function`](#function)*** `, ... ]`
   - Functions are optionally defined to re-use the same code throughout different scripts.
-- `scripting:` ***[`ScriptingDefinition`](#ScriptingDefinition)*** **(required)**
+- `scripting:` ***[`ScriptingDefinition`](#scriptingdefinition)*** **(required)**
   - Defines the scripting language that the code of other action uses.
 
 ### `Category`
@@ -38,7 +38,7 @@
 - `category:` *`string`*  (**required**)
   - Name of the category
   - ❗ Must be unique throughout the [Collection](#collection)
-- `children: [` ***[`Category`](#Category)*** `|` [***`Script`***](#Script) `, ... ]`  (**required**)
+- `children: [` ***[`Category`](#category)*** `|` [***`Script`***](#script) `, ... ]`  (**required**)
   - ❗ Category must consist of at least one subcategory or script.
   - Children can be combination of scripts and subcategories.
 - `docs`: *`string`* | `[`*`string`*`, ... ]`
@@ -70,7 +70,7 @@
   - E.g. let's say `code` sets an environment variable as `setx POWERSHELL_TELEMETRY_OPTOUT 1`
     - then `revertCode` should be doing `setx POWERSHELL_TELEMETRY_OPTOUT 0`
   - ❗ Do not define if `call` is defined.
-- `call`: ***[`FunctionCall`](#FunctionCall)*** | `[` ***[`FunctionCall`](#FunctionCall)*** `, ... ]` (may be **required**)
+- `call`: ***[`FunctionCall`](#functioncall)*** | `[` ***[`FunctionCall`](#functioncall)*** `, ... ]` (may be **required**)
   - A shared function or sequence of functions to call (called in order)
   - ❗ If not defined `code` must be defined
 - `docs`: *`string`* | `[`*`string`*`, ... ]`
@@ -123,7 +123,7 @@
   - Convention is to use camelCase, and be verbs.
   - E.g. `uninstallStoreApp`
   - ❗ Function names must be unique
-- `parameters`: `[` ***[`FunctionParameter`](#FunctionParameter)*** `, ... ]`
+- `parameters`: `[` ***[`FunctionParameter`](#functionparameter)*** `, ... ]`
   - List of parameters that function code refers to.
   - ❗ Must be defined to be able use in [`FunctionCall`](#functioncall) or [expressions (templating)](./templating.md#expressions)
  `code`: *`string`* (**required** if `call` is undefined)
@@ -136,7 +136,7 @@
   - E.g. let's say `code` sets an environment variable as `setx POWERSHELL_TELEMETRY_OPTOUT 1`
     - then `revertCode` should be doing `setx POWERSHELL_TELEMETRY_OPTOUT 0`
   - 💡 [Expressions (templating)](./templating.md#expressions) can be used in code
-- `call`: ***[`FunctionCall`](#FunctionCall)*** | `[` ***[`FunctionCall`](#FunctionCall)*** `, ... ]` (may be **required**)
+- `call`: ***[`FunctionCall`](#functioncall)*** | `[` ***[`FunctionCall`](#functioncall)*** `, ... ]` (may be **required**)
   - A shared function or sequence of functions to call (called in order)
   - The parameter values that are sent can use [expressions (templating)](./templating.md#expressions)
   - ❗ If not defined `code` must be defined
@@ -144,7 +144,7 @@
 ### `FunctionParameter`
 
 - Defines a parameter that function requires optionally or mandatory.
-- Its arguments are provided by a [Script](#script) through a [FunctionCall](#FunctionCall).
+- Its arguments are provided by a [Script](#script) through a [FunctionCall](#functioncall).
 
 #### `FunctionParameter` syntax
 

docs/tests.md

@@ -72,7 +72,7 @@ Common aspects for all tests:
 - Vue CLI plugin  [`e2e-cypress`](https://github.com/vuejs/vue-cli/tree/dev/packages/@vue/cli-plugin-e2e-cypress#readme) configures E2E tests.
 - Test names and folders have logical structure based on tests executed.
 - The structure is following:
-  - [`cypress.json`](./../cypress.json): Cypress configuration file.
+  - [`cypress.config.ts`](./../cypress.config.ts): Cypress configuration file.
   - [`./tests/e2e/`](./../tests/e2e/): Base Cypress folder.
     - [`/specs/`](./../tests/e2e/specs/): Test files named with `.spec.js` extension.
     - [`/plugins/index.js`](./../tests/e2e/plugins/index.js): Plugin file executed before loading project.

fresh-npm-install.sh

@@ -0,0 +1,95 @@
+#!/usr/bin/env bash
+
+# Description:
+#   This script ensures npm is available, removes existing node modules, optionally
+#   removes package-lock.json (when -n flag is used), installs dependencies and runs unit tests.
+# Usage:
+#   ./fresh-npm-install.sh         # Regular execution
+#   ./fresh-npm-install.sh -n      # Non-deterministic mode (removes package-lock.json)
+
+declare NON_DETERMINISTIC_FLAG=0
+
+
+main() {
+  parse_args "$@"
+  ensure_npm_is_available
+  ensure_npm_root
+  remove_existing_modules
+  if [[ $NON_DETERMINISTIC_FLAG -eq 1 ]]; then
+    remove_package_lock_json
+  fi
+  install_dependencies
+  run_unit_tests
+}
+
+ensure_npm_is_available() {
+  if ! command -v npm &> /dev/null; then
+    log::fatal 'npm could not be found, please install it first.'
+  fi
+}
+
+ensure_npm_root() {
+  if [ ! -f package.json ]; then
+    log::fatal 'Current directory is not a npm root. Please run the script in a npm root directory.'
+  fi
+}
+
+remove_existing_modules() {
+  if [ -d ./node_modules ]; then
+    log::info 'Removing existing node modules...'
+    if ! rm -rf ./node_modules; then
+      log::fatal 'Could not remove existing node modules.'
+    fi
+  fi
+}
+
+install_dependencies() {
+  log::info 'Installing dependencies...'
+  if ! npm install; then
+    log::fatal 'Failed to install dependencies.'
+  fi
+}
+
+remove_package_lock_json() {
+  if [ -f ./package-lock.json ]; then
+    log::info 'Removing package-lock.json...'
+    if ! rm -rf ./package-lock.json; then
+      log::fatal 'Could not remove package-lock.json.'
+    fi
+  fi
+}
+
+run_unit_tests() {
+  log::info 'Running unit tests...'
+  if ! npm run test:unit; then
+    pwd
+    log::fatal 'Failed to run unit tests.'
+  fi
+}
+
+log::info() {
+  local -r message="$1"
+  echo "📣 ${message}"
+}
+
+log::fatal() {
+  local -r message="$1"
+  echo "❌ ${message}" >&2
+  exit 1
+}
+
+parse_args() {
+  while getopts "n" opt; do
+    case ${opt} in
+      n)
+        NON_DETERMINISTIC_FLAG=1
+        ;;
+      \?)
+        echo "Invalid option: $OPTARG" 1>&2
+        exit 1
+        ;;
+    esac
+  done
+}
+
+main "$1"

package.json

@@ -7,92 +7,94 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "create-icons": "node img/logo-update.mjs",
     "test:unit": "vue-cli-service test:unit",
     "test:e2e": "vue-cli-service test:e2e",
     "lint": "npm run lint:md && npm run lint:md:consistency && npm run lint:md:relative-urls && npm run lint:eslint && npm run lint:yaml",
+    "create-icons": "node img/logo-update.mjs",
     "electron:build": "vue-cli-service electron:build",
     "electron:serve": "vue-cli-service electron:serve",
+    "lint:eslint": "vue-cli-service lint --no-fix --mode production",
     "lint:md": "markdownlint **/*.md --ignore node_modules",
     "lint:md:consistency": "remark . --frail --use remark-preset-lint-consistent",
     "lint:md:relative-urls": "remark . --frail --use remark-validate-links",
-    "lint:eslint": "vue-cli-service lint --no-fix --mode production",
     "lint:yaml": "yamllint **/*.yaml --ignore=node_modules/**/*.yaml",
     "postinstall": "electron-builder install-app-deps",
     "postuninstall": "electron-builder install-app-deps",
     "test:integration": "vue-cli-service test:unit \"tests/integration/**/*.spec.ts\""
   },
-  "main": "background.js",
+  "main": "index.js",
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.3.0",
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
-    "@fortawesome/free-brands-svg-icons": "^6.0.0",
+    "@fortawesome/free-brands-svg-icons": "^6.4.0",
-    "@fortawesome/free-regular-svg-icons": "^6.0.0",
+    "@fortawesome/free-regular-svg-icons": "^6.4.0",
-    "@fortawesome/free-solid-svg-icons": "^6.0.0",
+    "@fortawesome/free-solid-svg-icons": "^6.4.0",
-    "@fortawesome/vue-fontawesome": "^2.0.6",
+    "@fortawesome/vue-fontawesome": "^2.0.9",
-    "@juggle/resize-observer": "^3.3.1",
+    "@juggle/resize-observer": "^3.4.0",
-    "ace-builds": "^1.4.14",
+    "ace-builds": "^1.23.4",
-    "core-js": "^3.21.1",
+    "core-js": "^3.32.0",
-    "cross-fetch": "^3.1.5",
+    "cross-fetch": "^4.0.0",
-    "electron-progressbar": "^2.0.1",
+    "electron-progressbar": "^2.1.0",
     "file-saver": "^2.0.5",
     "install": "^0.13.0",
     "liquor-tree": "^0.2.70",
     "markdown-it": "^13.0.1",
-    "npm": "^8.5.3",
+    "npm": "^9.8.1",
     "v-tooltip": "2.1.3",
-    "vue": "^2.6.14",
+    "vue": "^2.7.14",
     "vue-class-component": "^7.2.6",
     "vue-js-modal": "^2.0.1",
     "vue-property-decorator": "^9.1.2"
   },
   "devDependencies": {
     "@types/ace": "^0.0.48",
-    "@types/chai": "^4.3.0",
+    "@types/chai": "^4.3.5",
     "@types/file-saver": "^2.0.5",
-    "@types/mocha": "^9.1.0",
+    "@types/mocha": "^10.0.1",
-    "@typescript-eslint/eslint-plugin": "^5.13.0",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
-    "@typescript-eslint/parser": "^5.13.0",
+    "@typescript-eslint/parser": "^5.62.0",
-    "@vue/cli-plugin-babel": "~5.0.1",
+    "@vue/cli-plugin-babel": "~5.0.8",
-    "@vue/cli-plugin-e2e-cypress": "~5.0.1",
+    "@vue/cli-plugin-e2e-cypress": "~5.0.8",
-    "@vue/cli-plugin-eslint": "~5.0.1",
+    "@vue/cli-plugin-eslint": "~5.0.8",
-    "@vue/cli-plugin-typescript": "~5.0.1",
+    "@vue/cli-plugin-typescript": "~5.0.8",
-    "@vue/cli-plugin-unit-mocha": "~5.0.1",
+    "@vue/cli-plugin-unit-mocha": "~5.0.8",
-    "@vue/cli-service": "~5.0.1",
+    "@vue/cli-service": "~5.0.8",
     "@vue/eslint-config-airbnb": "^6.0.0",
-    "@vue/eslint-config-typescript": "^10.0.0",
+    "@vue/eslint-config-typescript": "^11.0.3",
-    "@vue/test-utils": "1.3.0",
+    "chai": "^4.3.7",
-    "chai": "^4.3.6",
+    "cypress": "^12.17.2",
-    "cypress": "^9.5.1",
+    "electron": "^25.3.2",
-    "electron": "^17.1.0",
+    "electron-builder": "^24.6.3",
-    "electron-builder": "^22.14.13",
     "electron-devtools-installer": "^3.2.0",
     "electron-icon-builder": "^2.0.1",
-    "electron-log": "^4.4.6",
+    "electron-log": "^4.4.8",
-    "electron-updater": "^5.0.0",
+    "electron-updater": "^6.1.4",
-    "eslint": "7.32.0",
+    "eslint": "^8.46.0",
-    "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-vue": "^8.5.0",
+    "eslint-plugin-vue": "^9.6.0",
-    "eslint-plugin-vuejs-accessibility": "^1.1.1",
+    "eslint-plugin-vuejs-accessibility": "^1.2.0",
     "icon-gen": "^3.0.1",
     "js-yaml-loader": "^1.2.2",
-    "markdownlint-cli": "^0.31.1",
+    "markdownlint-cli": "^0.35.0",
-    "remark-cli": "^10.0.1",
+    "remark-cli": "^11.0.0",
     "remark-lint-no-dead-urls": "^1.1.0",
-    "remark-preset-lint-consistent": "^5.1.1",
+    "remark-preset-lint-consistent": "^5.1.2",
-    "remark-validate-links": "^11.0.2",
+    "remark-validate-links": "^12.1.1",
-    "sass": "^1.49.9",
+    "sass": "^1.64.1",
-    "sass-loader": "^12.6.0",
+    "sass-loader": "^13.3.2",
     "svgexport": "^0.4.2",
-    "ts-loader": "9.0.1",
+    "ts-loader": "^9.4.4",
-    "tslib": "^2.3.1",
+    "typescript": "~4.6.2",
-    "typescript": "^4.6.2",
+    "vue-cli-plugin-electron-builder": "^3.0.0-alpha.4",
-    "vue-cli-plugin-electron-builder": "^2.1.1",
+    "yaml-lint": "^1.7.0"
-    "vue-template-compiler": "^2.6.14",
-    "yaml-lint": "^1.2.4"
   },
   "//devDependencies": {
-    "ts-loader": "Here as workaround for vue-cli-plugin-electron-builder using older webpack 4",
+    "typescript": [
-    "eslint": "Stuck at 7.32.0 because Vue CLI not supporting 8.x.x"
+      "Cannot upgrade to 5.X.X due to unmaintained @vue/cli-plugin-typescript, https://github.com/vuejs/vue-cli/issues/7401",
+      "Cannot upgrade to > 4.6.X otherwise unit tests do not work, https://github.com/evanw/node-source-map-support/issues/252"
+    ],
+    "tslib": "Cannot upgrade to > 2.4.X otherwise unit tests do not work, https://github.com/evanw/node-source-map-support/issues/252",
+    "@typescript-eslint/eslint-plugin": "Cannot upgrade to 6.X.X due to @vue/eslint-config-typescript, https://github.com/vuejs/eslint-config-typescript/pull/60",
+    "@typescript-eslint/parser": "Cannot upgrade to 6.X.X due to @vue/eslint-config-typescript, https://github.com/vuejs/eslint-config-typescript/pull/60"
   },
   "homepage": "https://privacy.sexy",
   "repository": {

src/presentation/electron/main.ts

@@ -134,11 +134,9 @@ function loadApplication(window: BrowserWindow) {
 }
 
 function configureExternalsUrlsOpenBrowser(window: BrowserWindow) {
-  window.webContents.on('new-window', (event, url) => { // handle redirect
+  window.webContents.setWindowOpenHandler(({ url }) => {
-    if (url !== win.webContents.getURL()) {
-      event.preventDefault();
     shell.openExternal(url);
-    }
+    return { action: 'deny' };
   });
 }
 

tests/e2e/plugins/index.js

@@ -1,5 +1,5 @@
 /* eslint-disable arrow-body-style */
-// https://docs.cypress.io/guides/guides/plugins-guide.html
+// https://docs.cypress.io/guides/tooling/plugins-guide
 
 // if you need a custom webpack configuration you can uncomment the following import
 // and then use the `file:preprocessor` event
@@ -17,10 +17,5 @@ module.exports = (on, config) => {
 
   return {
     ...config,
-    fixturesFolder: 'tests/e2e/fixtures',
-    integrationFolder: 'tests/e2e/specs',
-    screenshotsFolder: 'tests/e2e/screenshots',
-    videosFolder: 'tests/e2e/videos',
-    supportFile: 'tests/e2e/support/index.js',
   };
 };

tsconfig.json

@@ -29,9 +29,6 @@
       ],
       "@tests/*": [
         "tests/*"
-      ],
-      "@fortawesome/fontawesome-common-types": [
-        "./node_modules/@fortawesome/fontawesome-common-types/index"
       ]
     }
   },