Fix/graphic tests

package.json

@@ -25,8 +25,9 @@
     "lint": "eslint --fix --ext .js,.vue --ignore-path .gitignore .",
     "test": "npm run test:unit",
     "tests": "vitest --config ./tests/vitest.config.js",
-    "test:unit": "npm run tests --project unit",
+    "test:browser": "npm run tests --project browser",
     "test:integration": "npm run tests --project integration",
+    "test:unit": "npm run tests --project unit",
     "geode_objects": "node scripts/generate_geode_objects.js && prettier ./assets/geode_objects.js --write",
     "build": ""
   },
@@ -63,6 +64,8 @@
     "@nuxt/test-utils": "3.21.0",
     "@pinia/testing": "1.0.3",
     "@vitejs/plugin-vue": "5.2.4",
+    "@vitest/browser-playwright": "4.0.16",
+    "@vitest/browser-preview": "4.0.16",
     "@vue/test-utils": "2.4.6",
     "eslint": "9.26.0",
     "eslint-plugin-import": "2.31.0",
@@ -79,9 +82,10 @@
     "unplugin-auto-import": "20.0.0",
     "vite": "6.3.5",
     "vite-plugin-vuetify": "2.1.1",
-    "vitest": "4.0.15",
+    "vitest": "4.0.16",
+    "vitest-browser-vue": "2.0.1",
     "vitest-environment-nuxt": "1.0.1",
-    "vitest-indexeddb": "^0.0.1"
+    "vitest-indexeddb": "0.0.1"
   },
   "peerDependencies": {
     "electron": "36.4.0"

tests/browser/Viewer/Options/ColorPicke.test.js

@@ -0,0 +1,14 @@
+import { expect, test } from "vitest"
+import { render } from "vitest-browser-vue"
+
+import ColorPicker from "@/components/Viewer/Options/ColorPicker"
+import { vuetify } from "../../../utils"
+
+test("Graphic test for ColorPicker", async () => {
+  const component = await render(ColorPicker, {
+    global: {
+      plugins: [vuetify],
+    },
+  })
+  await expect(component.container).toMatchScreenshot()
+})

tests/browser/Viewer/Options/VisibilitySwitch.test.js

@@ -0,0 +1,14 @@
+import { expect, test } from "vitest"
+import { render } from "vitest-browser-vue"
+
+import VisibilitySwitch from "@/components/Viewer/Options/VisibilitySwitch"
+import { vuetify } from "../../../utils"
+
+test("Graphic test for VisibilitySwitch", async () => {
+  const component = await render(VisibilitySwitch, {
+    global: {
+      plugins: [vuetify],
+    },
+  })
+  await expect(component.container).toMatchScreenshot("VisibilitySwitch")
+})

tests/integration/microservices/back/requirements.txt

@@ -5,4 +5,3 @@
 #    pip-compile --output-file=tests/integration/microservices/back/requirements.txt tests/integration/microservices/back/requirements.in
 #
 
-opengeodeweb-back==6.*,>=6.3.3

tests/integration/microservices/viewer/requirements.txt

@@ -5,4 +5,3 @@
 #    pip-compile --output-file=tests/integration/microservices/viewer/requirements.txt tests/integration/microservices/viewer/requirements.in
 #
 
-opengeodeweb-viewer==1.*,>=1.15.6

tests/unit/components/FileSelector.nuxt.test.js

@@ -6,10 +6,11 @@
 import schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
 
 // Local imports
 import { setupActivePinia, vuetify } from "@ogw_tests/utils"
 import FileSelector from "@ogw_front/components/FileSelector"
 import FileUploader from "@ogw_front/components/FileUploader"
 import { useGeodeStore } from "@ogw_front/stores/geode"
+import { vuetify } from "../../utils"
 
 const EXPECTED_LENGTH = 1
 const FIRST_INDEX = 0

tests/unit/components/Step.nuxt.test.js

@@ -2,8 +2,7 @@
 import { describe, expect, test } from "vitest"
 import ResizeObserver from "resize-observer-polyfill"
 import { mount } from "@vue/test-utils"
-
 import ObjectSelector from "@ogw_front/components/ObjectSelector"
 import Step from "@ogw_front/components/Step"
 
 import { vuetify } from "@ogw_tests/utils"
@@ -11,25 +10,25 @@
 globalThis.ResizeObserver = ResizeObserver
 
 describe(Step, () => {
   test(`BRep`, async () => {
     const geode_object_type = ref("BRep")
     const files = ref([])
     const stepper_tree = reactive({
       current_step_index: ref(0),
       geode_object_type,
       steps: [
         {
           step_title: "Confirm the data type",
           component: {
             component_name: shallowRef(ObjectSelector),
             component_options: {
               filenames: computed(() => files.value.map((file) => file.name)),
               key: "",
             },
           },
           chips: computed(() => {
             if (geode_object_type.value === "") {
               return []
             } else {
               return [geode_object_type.value]
             }

tests/vitest.config.js

@@ -1,8 +1,11 @@
-import { defineConfig } from "vitest/config"
-import { defineVitestProject } from "@nuxt/test-utils/config"
 import { fileURLToPath } from "node:url"
 import path from "node:path"
 
+import { defineConfig } from "vitest/config"
+import { defineVitestProject } from "@nuxt/test-utils/config"
+import { playwright } from "@vitest/browser-playwright"
+// import vue from "@vitejs/plugin-vue"
+
 const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 const RETRIES = 3
@@ -21,6 +24,21 @@
     globals: false,
     setupFiles: [path.resolve(__dirname, "./setup_indexeddb.js")],
     projects: [
+      await defineVitestProject({
+        // plugins: [vue()],
+        test: {
+          name: "browser",
+          include: ["tests/browser/**/*.test.js"],
+          setupFiles: ["vitest-browser-vue"],
+          browser: {
+            enabled: true,
+            // headless: true,
+            provider: playwright(),
+            instances: [{ browser: "chromium" }],
+          },
+          retry: globalRetry,
+        },
+      }),
       await defineVitestProject({
         test: {
           name: "unit",