From f0d64c8e516bc323bceb44fed080b50fce966b6e Mon Sep 17 00:00:00 2001 From: rockyroed Date: Wed, 8 Oct 2025 13:23:09 +0800 Subject: [PATCH 1/7] test: move nuxt tests to one file --- test/nuxt/__snapshots__/app.nuxt.spec.ts.snap | 22 ------ .../__snapshots__/components.test.ts.snap | 56 ++++++++++++++ test/nuxt/app.nuxt.spec.ts | 35 --------- ...Header.nuxt.spec.ts => components.test.ts} | 74 +++++++++++++++++-- .../__snapshots__/Header.nuxt.spec.ts.snap | 17 ----- .../__snapshots__/default.nuxt.spec.ts.snap | 19 ----- test/nuxt/layouts/default.nuxt.spec.ts | 35 --------- 7 files changed, 125 insertions(+), 133 deletions(-) delete mode 100644 test/nuxt/__snapshots__/app.nuxt.spec.ts.snap create mode 100644 test/nuxt/__snapshots__/components.test.ts.snap delete mode 100644 test/nuxt/app.nuxt.spec.ts rename test/nuxt/{components/Header.nuxt.spec.ts => components.test.ts} (71%) delete mode 100644 test/nuxt/components/__snapshots__/Header.nuxt.spec.ts.snap delete mode 100644 test/nuxt/layouts/__snapshots__/default.nuxt.spec.ts.snap delete mode 100644 test/nuxt/layouts/default.nuxt.spec.ts diff --git a/test/nuxt/__snapshots__/app.nuxt.spec.ts.snap b/test/nuxt/__snapshots__/app.nuxt.spec.ts.snap deleted file mode 100644 index 9f8d2ea..0000000 --- a/test/nuxt/__snapshots__/app.nuxt.spec.ts.snap +++ /dev/null @@ -1,22 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`App > should match snapshot 1`] = ` -"
-
- Lystra logo -

Lystra

- - -
- - -
-
-
-
- -" -`; diff --git a/test/nuxt/__snapshots__/components.test.ts.snap b/test/nuxt/__snapshots__/components.test.ts.snap new file mode 100644 index 0000000..c4c0b7c --- /dev/null +++ b/test/nuxt/__snapshots__/components.test.ts.snap @@ -0,0 +1,56 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`App > should match snapshot 1`] = ` +"
+
+ Lystra logo +

Lystra

+ + +
+ + +
+
+
+
+ +" +`; + +exports[`DefaultLayout > should match snapshot 1`] = ` +"
+
+ Lystra logo +

Lystra

+ + +
+ + +
+
+
" +`; + +exports[`Header > should match snapshot 1`] = ` +"
+ Lystra logo +

Lystra

+ + +
+ + +
+
" +`; diff --git a/test/nuxt/app.nuxt.spec.ts b/test/nuxt/app.nuxt.spec.ts deleted file mode 100644 index 94c2f96..0000000 --- a/test/nuxt/app.nuxt.spec.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { mountSuspended } from '@nuxt/test-utils/runtime'; -import App from '../../app/app.vue'; -import { describe, expect, it } from 'vitest'; - -describe('App', () => { - it('should match snapshot', async () => { - const wrapper = await mountSuspended(App, { - global: { - stubs: { - SignInButton: true, - SignedOut: true, - UserButton: true, - SignedIn: true, - }, - }, - }); - expect(wrapper.html()).toMatchSnapshot(); - }); - - it('should render properly', async () => { - const wrapper = await mountSuspended(App, { - global: { - stubs: { - SignInButton: true, - SignedOut: true, - UserButton: true, - SignedIn: true, - }, - }, - }); - expect(wrapper.exists()).toBe(true); - }); - - // TODO: Add more tests as needed -}); diff --git a/test/nuxt/components/Header.nuxt.spec.ts b/test/nuxt/components.test.ts similarity index 71% rename from test/nuxt/components/Header.nuxt.spec.ts rename to test/nuxt/components.test.ts index e6d1c54..5de5c07 100644 --- a/test/nuxt/components/Header.nuxt.spec.ts +++ b/test/nuxt/components.test.ts @@ -1,7 +1,73 @@ import { mountSuspended } from '@nuxt/test-utils/runtime'; -import Header from '../../../app/components/Header/index.vue'; +import App from '../../app/app.vue'; +import Header from '../../app/components/Header/index.vue'; +import DefaultLayout from '../../app/layouts/default.vue'; import { describe, expect, it, vi } from 'vitest'; +describe('App', () => { + it('should match snapshot', async () => { + const wrapper = await mountSuspended(App, { + global: { + stubs: { + SignInButton: true, + SignedOut: true, + UserButton: true, + SignedIn: true, + }, + }, + }); + expect(wrapper.html()).toMatchSnapshot(); + }); + + it('should render properly', async () => { + const wrapper = await mountSuspended(App, { + global: { + stubs: { + SignInButton: true, + SignedOut: true, + UserButton: true, + SignedIn: true, + }, + }, + }); + expect(wrapper.exists()).toBe(true); + }); + + // TODO: Add more tests as needed +}); + +describe('DefaultLayout', () => { + it('should match snapshot', async () => { + const wrapper = await mountSuspended(DefaultLayout, { + global: { + stubs: { + SignInButton: true, + SignedOut: true, + UserButton: true, + SignedIn: true, + }, + }, + }); + expect(wrapper.html()).toMatchSnapshot(); + }); + + it('should render properly', async () => { + const wrapper = await mountSuspended(DefaultLayout, { + global: { + stubs: { + SignInButton: true, + SignedOut: true, + UserButton: true, + SignedIn: true, + }, + }, + }); + expect(wrapper.exists()).toBe(true); + }); + + // TODO: Add more tests as needed +}); + describe('Header', () => { it('should match snapshot', async () => { const wrapper = await mountSuspended(Header, { @@ -44,9 +110,7 @@ describe('Header', () => { }); const logo = wrapper.find('img'); expect(logo.exists()).toBe(true); - expect(logo.attributes('src')).toBe( - '/_ipx/b_transparent&fit_contain&s_40x40/lystra-logo-light.svg' - ); + expect(logo.attributes('src')).toContain('lystra-logo-light.svg'); expect(logo.attributes('alt')).toBe('Lystra logo'); expect(logo.attributes('width')).toBe('40'); expect(logo.attributes('height')).toBe('40'); @@ -120,7 +184,7 @@ describe('Header', () => { useColorMode: () => colorMode, })); - const HeaderWithMock = (await import('../../../app/components/Header/index.vue')).default; + const HeaderWithMock = (await import('../../app/components/Header/index.vue')).default; const wrapper = await mountSuspended(HeaderWithMock, { global: { stubs: { diff --git a/test/nuxt/components/__snapshots__/Header.nuxt.spec.ts.snap b/test/nuxt/components/__snapshots__/Header.nuxt.spec.ts.snap deleted file mode 100644 index 45d1a25..0000000 --- a/test/nuxt/components/__snapshots__/Header.nuxt.spec.ts.snap +++ /dev/null @@ -1,17 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`Header > should match snapshot 1`] = ` -"
- Lystra logo -

Lystra

- - -
- - -
-
" -`; diff --git a/test/nuxt/layouts/__snapshots__/default.nuxt.spec.ts.snap b/test/nuxt/layouts/__snapshots__/default.nuxt.spec.ts.snap deleted file mode 100644 index 83e1364..0000000 --- a/test/nuxt/layouts/__snapshots__/default.nuxt.spec.ts.snap +++ /dev/null @@ -1,19 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`DefaultLayout > should match snapshot 1`] = ` -"
-
- Lystra logo -

Lystra

- - -
- - -
-
-
" -`; diff --git a/test/nuxt/layouts/default.nuxt.spec.ts b/test/nuxt/layouts/default.nuxt.spec.ts deleted file mode 100644 index fb34def..0000000 --- a/test/nuxt/layouts/default.nuxt.spec.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { mountSuspended } from '@nuxt/test-utils/runtime'; -import DefaultLayout from '../../../app/layouts/default.vue'; -import { describe, expect, it } from 'vitest'; - -describe('DefaultLayout', () => { - it('should match snapshot', async () => { - const wrapper = await mountSuspended(DefaultLayout, { - global: { - stubs: { - SignInButton: true, - SignedOut: true, - UserButton: true, - SignedIn: true, - }, - }, - }); - expect(wrapper.html()).toMatchSnapshot(); - }); - - it('should render properly', async () => { - const wrapper = await mountSuspended(DefaultLayout, { - global: { - stubs: { - SignInButton: true, - SignedOut: true, - UserButton: true, - SignedIn: true, - }, - }, - }); - expect(wrapper.exists()).toBe(true); - }); - - // TODO: Add more tests as needed -}); From b6e6e5684eb7b70e8db5d17e5804b669463e1855 Mon Sep 17 00:00:00 2001 From: rockyroed Date: Wed, 8 Oct 2025 13:24:15 +0800 Subject: [PATCH 2/7] test: modify config and script --- package.json | 4 ++-- vitest.config.ts | 27 +++++++++++++++++++-------- 2 files changed, 21 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index a9956f3..809823d 100644 --- a/package.json +++ b/package.json @@ -13,8 +13,8 @@ "lint": "eslint .", "lint:fix": "eslint . --fix", "test:watch": "vitest --watch", - "test:e2e": "vitest --project e2e", - "test:unit": "vitest --project nuxt", + "test:unit": "vitest run --project unit", + "test:nuxt": "vitest run --project nuxt", "test:all": "vitest run", "prepare": "husky" }, diff --git a/vitest.config.ts b/vitest.config.ts index 5845597..b3927dc 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -1,12 +1,23 @@ -import { defineVitestConfig } from '@nuxt/test-utils/config'; +import { defineConfig } from 'vitest/config'; +import { defineVitestProject } from '@nuxt/test-utils/config'; -export default defineVitestConfig({ +export default defineConfig({ test: { - environment: 'nuxt', - env: { - NODE_ENV: 'test', - NUXT_PUBLIC_CLERK_PUBLISHABLE_KEY: 'pk_test_fake_key', - NUXT_CLERK_SECRET_KEY: 'sk_test_fake_key', - }, + projects: [ + { + test: { + name: 'unit', + include: ['test/{e2e,unit}/*.{test,spec}.ts'], + environment: 'node', + }, + }, + await defineVitestProject({ + test: { + name: 'nuxt', + include: ['test/nuxt/*.{test,spec}.ts'], + environment: 'nuxt', + }, + }), + ], }, }); From ecc6fe12cacd17d2776e61d2879cf0df15407636 Mon Sep 17 00:00:00 2001 From: rockyroed Date: Wed, 8 Oct 2025 13:25:01 +0800 Subject: [PATCH 3/7] test: create first e2e test --- app/components/Header/index.vue | 3 +- test/e2e/main.test.ts | 70 +++++++++++++++++++++++++++++++++ 2 files changed, 72 insertions(+), 1 deletion(-) create mode 100644 test/e2e/main.test.ts diff --git a/app/components/Header/index.vue b/app/components/Header/index.vue index 599e1bc..935aab3 100644 --- a/app/components/Header/index.vue +++ b/app/components/Header/index.vue @@ -15,6 +15,7 @@ const colorMode = useColorMode(); height="40" fit="contain" background="transparent" + data-testId="logo" />