chore(gost): add browser test dependencies

usdigitalresponse · Dec 7, 2024 · c9f850e · c9f850e
1 parent 5d8aa98
commit c9f850e
Show file tree

Hide file tree

Showing 5 changed files with 476 additions and 101 deletions.
diff --git a/packages/client/package.json b/packages/client/package.json
@@ -12,7 +12,8 @@
     "build": "vite build && rm dist/deploy-config.js",
     "dev": "vite",
     "lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src",
-    "test": "vitest"
+    "test": "vitest",
+    "test:browser": "vitest --workspace=vitest.workspace.js"
   },
   "dependencies": {
     "@braid/vue-formulate": "^2.5.3",
@@ -43,7 +44,8 @@
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^5.26.0",
     "@typescript-eslint/parser": "^5.26.0",
-    "@vitest/coverage-istanbul": "^2.1.0",
+    "@vitest/browser": "^2.1.8",
+    "@vitest/coverage-istanbul": "^2.1.8",
     "@vue/eslint-config-prettier": "^7.0.0",
     "@vue/test-utils": "^2.4.6",
     "eslint": "^8.2.0",
@@ -58,9 +60,11 @@
     "eslint-plugin-vue": "^9.26.0",
     "eslint-plugin-vuejs-accessibility": "^2.4.1",
     "jsdom": "^24.0.0",
+    "playwright": "^1.49.0",
     "prettier": "2.6.1",
     "sass": "1.52.1",
     "typescript": "^4.7.2",
-    "vitest": "^2.1.0"
+    "vitest": "^2.1.8",
+    "vitest-browser-vue": "^0.0.1"
   }
 }
diff --git a/packages/client/vite.config.js b/packages/client/vite.config.js
@@ -72,5 +72,11 @@ export default defineConfig({
         'json',
       ],
     },
+    browser: {
+      provider: 'playwright',
+      enabled: false,
+      headless: true,
+      name: 'chromium',
+    },
   },
 });
diff --git a/packages/client/vitest-example/HelloWorld.test.js b/packages/client/vitest-example/HelloWorld.test.js
@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+import { render } from 'vitest-browser-vue'
+import HelloWorld from './HelloWorld.vue'
+
+test('renders name', async () => {
+  const { getByText } = render(HelloWorld, {
+    props: { name: 'Vitest' },
+  })
+  await expect.element(getByText('Hello Vitest!')).toBeInTheDocument()
+})
diff --git a/packages/client/vitest-example/HelloWorld.vue b/packages/client/vitest-example/HelloWorld.vue
@@ -0,0 +1,11 @@
+<script setup>
+defineProps({
+  name: String
+})
+</script>
+
+<template>
+  <div>
+    <h1>Hello {{ name }}!</h1>
+  </div>
+</template>