Vite & Vitest package updates - Removing Vitest dependency 'braces' 3…

….0.2 with Vitest package update (#179)

* Updating Vite and Vitest so that Vitest package version doesn't include braces 3.0.2 as a dependency since it fails a security audit.

* Migrated the old eslint configuration to explicitely define it as a common JS file instead of an ESM type which is the project default now.

Signed-off-by: Angelina Uno-Antonison <angelina.antonison@gmail.com>

CONTRIBUTING.md

@@ -52,7 +52,7 @@ GitHub Actions are configured to automate these operations upon a git push into
 To reference configuration files:
 
 - General & Markdown: `./etc/static-analysis/`
-- Frontend: `./frontend/.eslintrc.js`
+- Frontend: `./frontend/.eslintrc.cjs`
 - Backend: `./backend/.pylintrc`
 
 ---

frontend/package.json

@@ -2,6 +2,7 @@
   "name": "rosalution-frontend",
   "license": "MIT",
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "build": "vite build",
     "dev": "vite",
@@ -19,24 +20,21 @@
     "@fortawesome/free-regular-svg-icons": "6.4.2",
     "@fortawesome/free-solid-svg-icons": "6.4.2",
     "@fortawesome/vue-fontawesome": "3.0.3",
-    "@rollup/plugin-strip": "3.0.2",
+    "@rollup/plugin-strip": "3.0.4",
     "vue": "3.3.4",
     "vue-router": "4.2.5"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "4.4.0",
-    "@vitest/coverage-v8": "0.34.6",
-    "@vitest/ui": "0.34.6",
+    "@vitejs/plugin-vue": "5.0.5",
+    "@vitest/coverage-v8": "1.6.0",
+    "@vitest/ui": "1.6.0",
     "@vue/test-utils": "2.4.1",
     "eslint": "8.50.0",
     "eslint-config-google": "0.14.0",
     "eslint-plugin-vue": "9.17.0",
-    "happy-dom": "12.8.0",
+    "happy-dom": "14.12.3",
     "sinon": "16.0.0",
-    "vite": "4.5.3",
-    "vitest": "0.34.6"
-  },
-  "resolutions": {
-      "braces": "3.0.3"
+    "vite": "5.3.2",
+    "vitest": "1.6.0"
   }
 }

frontend/src/components/AnnotationView/ClinvarDataset.vue

@@ -54,7 +54,7 @@ export default {
   flex: 0 0 125px;
   font-weight: 600;
   font-size: 1.25rem;
-};
+}
 
 .dataset-label-available {
   color: var(--rosalution-purple-300)

frontend/src/components/AnnotationView/TextDataset.vue

@@ -62,7 +62,7 @@ export default {
   flex: 0 0 130px;
   font-weight: 600;
   color: v-bind(dataAvailabilityColour);
-};
+}
 
 a:hover {
   color: var(--rosalution-purple-100);

frontend/vite.config.js

@@ -3,15 +3,15 @@ import {defineConfig} from 'vite';
 import vue from '@vitejs/plugin-vue';
 import strip from '@rollup/plugin-strip';
 
-const path = require('path');
+import * as path from 'path';
 
 // https://vitejs.dev/config/
 export default defineConfig({
   test: {
     global: true,
     environment: 'happy-dom',
     coverage: {
-      exclude: ['test', 'src/requests.js'],
+      exclude: ['test', 'src/requests.js', '.eslintrc.cjs', 'src/main.js'],
       lines: 80,
       functions: 80,
       branches: 80,