Update JS dependencies and eslint (#22190)

- Update all JS dependencies to latest version
- Enable unicorn/prefer-node-protocol and autofix issues
- Regenerate SVGs
- Add some comments to eslint rules
- Tested build, Mermaid and Katex rendering

.drone.yml

@@ -551,7 +551,7 @@ steps:
 
   # TODO: We should probably build all dependencies into a test image
   - name: test-e2e
-    image: mcr.microsoft.com/playwright:v1.28.0-focal
+    image: mcr.microsoft.com/playwright:v1.29.0-focal
     commands:
       - curl -sLO https://go.dev/dl/go1.19.linux-amd64.tar.gz && tar -C /usr/local -xzf go1.19.linux-amd64.tar.gz
       - groupadd --gid 1001 gitea && useradd -m --gid 1001 --uid 1001 gitea

.eslintrc.yaml

@@ -255,7 +255,7 @@ rules:
   no-irregular-whitespace: [2]
   no-iterator: [2]
   no-label-var: [2]
-  no-labels: [0]
+  no-labels: [0] # handled by no-restricted-syntax
   no-lone-blocks: [2]
   no-lonely-if: [0]
   no-loop-func: [0]
@@ -335,7 +335,7 @@ rules:
   no-void: [2]
   no-warning-comments: [0]
   no-whitespace-before-property: [2]
-  no-with: [0]
+  no-with: [0] # handled by no-restricted-syntax
   nonblock-statement-body-position: [2]
   object-curly-newline: [0]
   object-curly-spacing: [2, never]
@@ -495,7 +495,7 @@ rules:
   unicorn/prefer-native-coercion-functions: [2]
   unicorn/prefer-negative-index: [2]
   unicorn/prefer-node-append: [0]
-  unicorn/prefer-node-protocol: [0]
+  unicorn/prefer-node-protocol: [2]
   unicorn/prefer-node-remove: [0]
   unicorn/prefer-number-properties: [0]
   unicorn/prefer-object-from-entries: [2]

build/generate-images.js

@@ -2,7 +2,7 @@
 import imageminZopfli from 'imagemin-zopfli';
 import {optimize} from 'svgo';
 import {fabric} from 'fabric';
-import {readFile, writeFile} from 'fs/promises';
+import {readFile, writeFile} from 'node:fs/promises';
 
 function exit(err) {
   if (err) console.error(err);

build/generate-svg.js

@@ -1,9 +1,9 @@
 #!/usr/bin/env node
 import fastGlob from 'fast-glob';
 import {optimize} from 'svgo';
-import {parse} from 'path';
+import {parse} from 'node:path';
-import {readFile, writeFile, mkdir} from 'fs/promises';
+import {readFile, writeFile, mkdir} from 'node:fs/promises';
-import {fileURLToPath} from 'url';
+import {fileURLToPath} from 'node:url';
 
 const glob = (pattern) => fastGlob.sync(pattern, {
   cwd: fileURLToPath(new URL('..', import.meta.url)),

package.json

@@ -13,24 +13,24 @@
     "@citation-js/plugin-software-formats": "0.6.0",
     "@claviska/jquery-minicolors": "2.3.6",
     "@mcaptcha/vanilla-glue": "0.1.0-alpha-3",
-    "@primer/octicons": "17.9.0",
+    "@primer/octicons": "17.10.0",
     "@vue/compiler-sfc": "3.2.45",
     "add-asset-webpack-plugin": "2.0.1",
-    "css-loader": "6.7.2",
+    "css-loader": "6.7.3",
     "dropzone": "6.0.0-beta.2",
     "easymde": "2.18.0",
     "esbuild-loader": "2.20.0",
     "escape-goat": "4.0.0",
     "fast-glob": "3.2.12",
     "font-awesome": "4.7.0",
-    "jquery": "3.6.1",
+    "jquery": "3.6.2",
     "jquery.are-you-sure": "1.9.0",
-    "katex": "0.16.3",
+    "katex": "0.16.4",
     "less": "4.1.3",
     "less-loader": "11.1.0",
     "license-checker-webpack-plugin": "0.2.1",
-    "mermaid": "9.2.2",
+    "mermaid": "9.3.0",
-    "mini-css-extract-plugin": "2.7.0",
+    "mini-css-extract-plugin": "2.7.2",
     "monaco-editor": "0.34.1",
     "monaco-editor-webpack-plugin": "7.0.1",
     "pretty-ms": "8.0.0",
@@ -44,31 +44,31 @@
     "vue-loader": "17.0.1",
     "vue3-calendar-heatmap": "2.0.0",
     "webpack": "5.75.0",
-    "webpack-cli": "5.0.0",
+    "webpack-cli": "5.0.1",
     "workbox-routing": "6.5.4",
     "workbox-strategies": "6.5.4",
     "worker-loader": "3.0.8",
     "wrap-ansi": "8.0.1"
   },
   "devDependencies": {
-    "@playwright/test": "1.28.0",
+    "@playwright/test": "1.29.0",
     "@rollup/pluginutils": "5.0.2",
     "@stoplight/spectral-cli": "6.6.0",
-    "eslint": "8.28.0",
+    "eslint": "8.30.0",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jquery": "1.5.1",
-    "eslint-plugin-sonarjs": "0.16.0",
+    "eslint-plugin-sonarjs": "0.17.0",
-    "eslint-plugin-unicorn": "45.0.0",
+    "eslint-plugin-unicorn": "45.0.2",
-    "eslint-plugin-vue": "9.7.0",
+    "eslint-plugin-vue": "9.8.0",
     "jsdom": "20.0.3",
     "markdownlint-cli": "0.32.2",
     "postcss-less": "6.0.0",
-    "stylelint": "14.15.0",
+    "stylelint": "14.16.0",
     "stylelint-config-standard": "29.0.0",
     "stylelint-declaration-strict-value": "1.9.1",
     "svgo": "3.0.2",
-    "updates": "13.2.1",
+    "updates": "13.2.4",
-    "vitest": "0.25.2"
+    "vitest": "0.26.1"
   },
   "browserslist": [
     "defaults",

public/img/svg/octicon-goal.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-goal" width="16" height="16" aria-hidden="true"><g fill-rule="evenodd"><path d="M13.637 2.363 13.302.687a.25.25 0 0 0-.422-.128l-1.374 1.374a.875.875 0 0 0-.256.619v1.137L8.389 6.551A1.502 1.502 0 0 0 6.5 8a1.5 1.5 0 1 0 2.95-.389l2.86-2.861h1.138a.875.875 0 0 0 .619-.256L15.44 3.12a.25.25 0 0 0-.128-.422l-1.676-.335z"/><path d="M2 8a6 6 0 0 1 7.656-5.769.75.75 0 0 0 .413-1.442 7.5 7.5 0 1 0 5.142 5.142.75.75 0 1 0-1.442.413A6 6 0 1 1 2 8z"/><path d="M5 8a3 3 0 0 1 3.346-2.98.75.75 0 1 0 .17-1.49 4.5 4.5 0 1 0 3.953 3.947.75.75 0 1 0-1.49.172A3 3 0 1 1 5 8z"/></g></svg>

public/img/svg/octicon-read.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-read" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M7.115.65a1.75 1.75 0 0 1 1.77 0l6.25 3.663c.536.314.865.889.865 1.51v6.427A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25V5.823c0-.621.33-1.196.865-1.51L7.115.65zm1.011 1.293a.25.25 0 0 0-.252 0l-5.72 3.353L6.468 7.76a2.75 2.75 0 0 1 3.066 0l4.312-2.464-5.719-3.353zM14.5 6.65l-3.687 2.106 3.687 2.897V6.65zM5.187 8.756 1.5 6.65v5.003l3.687-2.897zM13.15 12.5H2.85l4.378-3.44a1.25 1.25 0 0 1 1.544 0l4.378 3.44z"/></svg>

public/img/svg/octicon-rel-file-path.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-rel-file-path" width="16" height="16" aria-hidden="true"><path d="M13.94 3.045a.75.75 0 0 0-1.38-.59l-4.5 10.5a.75.75 0 1 0 1.38.59l4.5-10.5zM5 11.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/></svg>

public/img/svg/octicon-sponsor-tiers.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-sponsor-tiers" width="16" height="16" aria-hidden="true"><path d="M10.586 1C12.268 1 13.5 2.37 13.5 4.25c0 1.745-.996 3.359-2.622 4.831-.166.15-.336.297-.509.438l1.116 5.584a.75.75 0 0 1-.991.852l-2.409-.876a.25.25 0 0 0-.17 0l-2.409.876a.75.75 0 0 1-.991-.852L5.63 9.519a13.78 13.78 0 0 1-.51-.438C3.497 7.609 2.5 5.995 2.5 4.25 2.5 2.37 3.732 1 5.414 1c.963 0 1.843.403 2.474 1.073L8 2.198l.112-.125a3.385 3.385 0 0 1 2.283-1.068L10.586 1zm-3.621 9.495-.718 3.594 1.155-.42a1.75 1.75 0 0 1 1.028-.051l.168.051 1.154.42-.718-3.592c-.199.13-.37.235-.505.314l-.169.097a.75.75 0 0 1-.72 0 9.54 9.54 0 0 1-.515-.308l-.16-.105zM10.586 2.5c-.863 0-1.611.58-1.866 1.459-.209.721-1.231.721-1.44 0C7.025 3.08 6.277 2.5 5.414 2.5 4.598 2.5 4 3.165 4 4.25c0 1.23.786 2.504 2.128 3.719.49.443 1.018.846 1.546 1.198l.325.21.076-.047.251-.163a13.341 13.341 0 0 0 1.546-1.198C11.214 6.754 12 5.479 12 4.25c0-1.085-.598-1.75-1.414-1.75z"/></svg>

public/img/svg/octicon-unlink.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-unlink" width="16" height="16" aria-hidden="true"><path d="M12.914 5.914a2 2 0 0 0-2.828-2.828l-.837.837a.75.75 0 1 1-1.06-1.061l.836-.837a3.5 3.5 0 1 1 4.95 4.95l-.195.194a.75.75 0 0 1-1.06-1.06l.194-.195zm-1.87 3.482a.759.759 0 0 1-.07.079c-.63.63-1.468 1.108-2.343 1.263-.89.159-1.86-.017-2.606-.763a.75.75 0 1 1 1.06-1.06c.329.327.767.438 1.284.347.493-.088 1.018-.36 1.445-.752l-1.247-.897a.709.709 0 0 1-.01-.008l-.295-.212c-.94-.597-1.984-.499-2.676.193l-2.5 2.5a2 2 0 1 0 2.828 2.828l.837-.836a.75.75 0 0 1 1.06 1.06l-.836.837a3.5 3.5 0 0 1-4.95-4.95l2.5-2.5a3.472 3.472 0 0 1 1.354-.848L2.312 3.109a.75.75 0 0 1 .876-1.218l5.93 4.27c.115.074.226.155.335.24l6.235 4.49a.75.75 0 0 1-.876 1.218l-3.768-2.713z"/></svg>

public/img/svg/octicon-unread.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" class="svg octicon-unread" width="16" height="16" aria-hidden="true"><path d="M10.5 3.5H1.75a.25.25 0 0 0-.25.25v.32L8 7.88l3.02-1.77a.75.75 0 0 1 .758 1.295L8.379 9.397a.75.75 0 0 1-.758 0L1.5 5.809v6.441c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4.5a.75.75 0 0 1 1.5 0v4.5A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25V4.513a.75.75 0 0 1 0-.027V3.75C0 2.784.784 2 1.75 2h8.75a.75.75 0 0 1 0 1.5z"/><path d="M14 6a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"/></svg>

vitest.config.js

@@ -1,7 +1,7 @@
 import {defineConfig} from 'vitest/dist/config.js';
-import {readFile} from 'fs/promises';
+import {readFile} from 'node:fs/promises';
 import {dataToEsm} from '@rollup/pluginutils';
-import {extname} from 'path';
+import {extname} from 'node:path';
 
 function stringPlugin() {
   return {

webpack.config.js

@@ -6,10 +6,10 @@ import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import MonacoWebpackPlugin from 'monaco-editor-webpack-plugin';
 import {VueLoaderPlugin} from 'vue-loader';
 import EsBuildLoader from 'esbuild-loader';
-import {parse, dirname} from 'path';
+import {parse, dirname} from 'node:path';
 import webpack from 'webpack';
-import {fileURLToPath} from 'url';
+import {fileURLToPath} from 'node:url';
-import {readFileSync} from 'fs';
+import {readFileSync} from 'node:fs';
 
 const {ESBuildMinifyPlugin} = EsBuildLoader;
 const {SourceMapDevToolPlugin} = webpack;