Testing preparation

jest.config.ts

@@ -0,0 +1,19 @@
+export default {
+  preset: 'ts-jest',
+  moduleFileExtensions: [
+    'js',
+    'ts',
+    'json',
+    'vue'
+  ],
+  transform: {
+    '^.+\\.ts$': 'ts-jest',
+    '^.+\\.vue$': 'vue-jest'
+  },
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+  },
+  setupFilesAfterEnv: [
+      '<rootDir>/tests/setup.ts'
+  ]
+}

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "serve": "vite",
     "preview": "vite preview --port 8082",
+    "test": "jest",
     "build": "vue-tsc --noEmit && vite build --out-dir dist",
     "lint": "eslint --ext .ts,.vue src",
     "lint:fix": "eslint -ext .ts,.vue src --fix",
@@ -19,20 +20,27 @@
     "vuex": "^4.0"
   },
   "devDependencies": {
+    "@types/jest": "^27.0.1",
     "@types/leaflet": "1.7.5",
+    "@types/node": "^16.9.1",
     "@typescript-eslint/eslint-plugin": "^4.31",
     "@typescript-eslint/parser": "^4.31",
     "@vitejs/plugin-vue": "^1.6",
     "@vue/compiler-sfc": "^3.2.10",
     "@vue/eslint-config-typescript": "^7.0",
+    "@vue/test-utils": "^2.0.0-rc.14",
     "eslint": "^7.32",
     "eslint-plugin-vue": "^7.17",
+    "jest": "^26.6.3",
     "patch-package": "^6.4",
     "rollup-plugin-analyzer": "^4.0",
     "sass": "^1.39",
+    "ts-jest": "^26.5.6",
+    "ts-node": "^10.2.1",
     "typescript": "^4.4",
     "vite": "^2.5",
     "vite-plugin-svg-sprite-component": "^1.0",
+    "vue-jest": "^5.0.0-alpha.10",
     "vue-tsc": "0.3.0"
   },
   "eslintConfig": {

src/index.d.ts

@@ -38,6 +38,16 @@ declare global {
 	interface Window {
 		liveAtlasConfig: LiveAtlasGlobalConfig,
 	}
+
+	declare const process : {
+		env: {
+			VITE_VERSION: string
+		}
+	}
+}
+
+export interface ProcessEnv {
+    [key: string]: string | undefined
 }
 
 interface Coordinate {

src/store/state.ts

@@ -91,7 +91,7 @@ export type State = {
 }
 
 export const state: State = {
-	version: (import.meta.env.VITE_VERSION || 'Unknown') as string,
+	version: (process.env.VITE_VERSION || 'Unknown') as string,
 	servers: new Map(),
 
 	configuration: {

tests/setup.ts

@@ -0,0 +1,4 @@
+console.warn = jest.fn();
+
+export {}
+

tsconfig.json

@@ -16,7 +16,8 @@
     "baseUrl": ".",
     "types": [
       "vite/client",
-      "vue"
+      "vue",
+      "jest"
     ],
     "paths": {
       "@/*": [
@@ -32,10 +33,8 @@
   },
   "include": [
     "src/**/*.ts",
-    "src/**/*.tsx",
     "src/**/*.vue",
-    "tests/**/*.ts",
-    "tests/**/*.tsx"
+    "tests/**/*.ts"
   ],
   "exclude": [
     "node_modules"

vite.config.ts

@@ -1,12 +1,26 @@
 // noinspection JSUnusedGlobalSymbols
 
-import { defineConfig } from 'vite';
+import {defineConfig, loadEnv} from 'vite';
 import { resolve } from 'path';
 import vue from '@vitejs/plugin-vue';
 import svgSpritePlugin from "vite-plugin-svg-sprite-component";
 import analyze from 'rollup-plugin-analyzer';
 
-export default defineConfig({
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd())
+
+  // expose .env as process.env instead of import.meta since jest does not import meta yet
+  const envWithProcessPrefix = Object.entries(env).reduce(
+    (prev, [key, val]) => {
+      return {
+        ...prev,
+        ['process.env.' + key]: `"${val}"`,
+      }
+    },
+    {},
+  );
+
+  return {
     plugins: [vue(), analyze(), svgSpritePlugin({
       symbolId: (name) => `icon--${name}`,
     })],
@@ -26,5 +40,7 @@ export default defineConfig({
     build: {
       chunkSizeWarningLimit: 600,
       assetsDir: 'live-atlas/assets'
+    },
+    define: envWithProcessPrefix,
   }
 });