From 413d80c4e6e3a97dde1da9864321c06a8438aa5a Mon Sep 17 00:00:00 2001 From: Laurent Gay Date: Wed, 24 Sep 2025 08:22:50 +0200 Subject: [PATCH] perform front-end unit test from "view/User" - #1805 --- .../__snapshots__/emailValidate.spec.ts.snap | 9 +++ .../providerValidation.spec.ts.snap | 3 + .../resendConfirmation.spec.ts.snap | 54 ++++++++++++++ .../sendPasswordReset.spec.ts.snap | 54 ++++++++++++++ .../settingsOnboard.spec.ts.snap | 37 ++++++++++ .../components/User/emailValidate.spec.ts | 59 +++++++++++++++ .../User/providerValidation.spec.ts | 59 +++++++++++++++ .../User/resendConfirmation.spec.ts | 57 +++++++++++++++ .../components/User/sendPasswordReset.spec.ts | 59 +++++++++++++++ .../components/User/settingsOnboard.spec.ts | 73 +++++++++++++++++++ 10 files changed, 464 insertions(+) create mode 100644 tests/unit/specs/components/User/__snapshots__/emailValidate.spec.ts.snap create mode 100644 tests/unit/specs/components/User/__snapshots__/providerValidation.spec.ts.snap create mode 100644 tests/unit/specs/components/User/__snapshots__/resendConfirmation.spec.ts.snap create mode 100644 tests/unit/specs/components/User/__snapshots__/sendPasswordReset.spec.ts.snap create mode 100644 tests/unit/specs/components/User/__snapshots__/settingsOnboard.spec.ts.snap create mode 100644 tests/unit/specs/components/User/emailValidate.spec.ts create mode 100644 tests/unit/specs/components/User/providerValidation.spec.ts create mode 100644 tests/unit/specs/components/User/resendConfirmation.spec.ts create mode 100644 tests/unit/specs/components/User/sendPasswordReset.spec.ts create mode 100644 tests/unit/specs/components/User/settingsOnboard.spec.ts diff --git a/tests/unit/specs/components/User/__snapshots__/emailValidate.spec.ts.snap b/tests/unit/specs/components/User/__snapshots__/emailValidate.spec.ts.snap new file mode 100644 index 000000000..781b4e270 --- /dev/null +++ b/tests/unit/specs/components/User/__snapshots__/emailValidate.spec.ts.snap @@ -0,0 +1,9 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`EmailValidate > Show simple 1`] = ` +"
+
+

Your email has been changed

+
+
" +`; diff --git a/tests/unit/specs/components/User/__snapshots__/providerValidation.spec.ts.snap b/tests/unit/specs/components/User/__snapshots__/providerValidation.spec.ts.snap new file mode 100644 index 000000000..a1f4fe261 --- /dev/null +++ b/tests/unit/specs/components/User/__snapshots__/providerValidation.spec.ts.snap @@ -0,0 +1,3 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`ProviderValidation > Show simple 1`] = `"

Redirecting in progress…

"`; diff --git a/tests/unit/specs/components/User/__snapshots__/resendConfirmation.spec.ts.snap b/tests/unit/specs/components/User/__snapshots__/resendConfirmation.spec.ts.snap new file mode 100644 index 000000000..0b93296b6 --- /dev/null +++ b/tests/unit/specs/components/User/__snapshots__/resendConfirmation.spec.ts.snap @@ -0,0 +1,54 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`ResendConfirmation > Show simple 1`] = ` +"
+

Resend confirmation email

+ +
+
+
+
+
+ + + +
+
+
+ +
+

Cancel + +

+
+
" +`; + +exports[`ResendConfirmation > Show simple 2`] = ` +"
+

Resend confirmation email

+ +
+ +
+ +
+ +
If an account with this email exists, we just sent another confirmation email to some@email.tld
+
+
+ + +
+ +
+ +
Please check your spam folder if you didn't receive the email.
+
+
+ +
+
" +`; diff --git a/tests/unit/specs/components/User/__snapshots__/sendPasswordReset.spec.ts.snap b/tests/unit/specs/components/User/__snapshots__/sendPasswordReset.spec.ts.snap new file mode 100644 index 000000000..acc6bca33 --- /dev/null +++ b/tests/unit/specs/components/User/__snapshots__/sendPasswordReset.spec.ts.snap @@ -0,0 +1,54 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`SendPasswordReset > Show simple 1`] = ` +"
+

Forgot your password?

+

Enter your email address below, and we'll email you instructions on how to change your password.

+
+
+
+
+
+ + + +
+
+
+ +
+

Cancel + +

+
+
" +`; + +exports[`SendPasswordReset > Show simple 2`] = ` +"
+

Forgot your password?

+

Enter your email address below, and we'll email you instructions on how to change your password.

+
+ +
+ +
+ +
We just sent an email to some@email.tld
+
+
+ + +
+ +
+ +
Please check your spam folder if you didn't receive the email.
+
+
+ +
+
" +`; diff --git a/tests/unit/specs/components/User/__snapshots__/settingsOnboard.spec.ts.snap b/tests/unit/specs/components/User/__snapshots__/settingsOnboard.spec.ts.snap new file mode 100644 index 000000000..eb1528f3f --- /dev/null +++ b/tests/unit/specs/components/User/__snapshots__/settingsOnboard.spec.ts.snap @@ -0,0 +1,37 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`SettingsOnboard > Show simple - step 1 1`] = ` +"
+

Let's define a few settings

+ +
+ + + +
+
" +`; + +exports[`SettingsOnboard > Show simple - step 2 1`] = ` +"
+

Let's define a few settings

+ +
+ + + +
+
" +`; + +exports[`SettingsOnboard > Show simple - step 3 1`] = ` +"
+

Let's define a few settings

+ +
+ + + +
+
" +`; diff --git a/tests/unit/specs/components/User/emailValidate.spec.ts b/tests/unit/specs/components/User/emailValidate.spec.ts new file mode 100644 index 000000000..446b3d2ae --- /dev/null +++ b/tests/unit/specs/components/User/emailValidate.spec.ts @@ -0,0 +1,59 @@ +import { beforeEach, describe, it, expect } from "vitest"; +import { enUS } from "date-fns/locale"; +import { routes } from "@/router"; +import { createRouter, createWebHistory, Router } from "vue-router"; +import { getMockClient, requestHandlers } from "../../mocks/client"; +import EmailValidate from "@/views/User/EmailValidate.vue"; +import { config, mount } from "@vue/test-utils"; +import { Oruga } from "@oruga-ui/oruga-next"; +import flushPromises from "flush-promises"; +import { VALIDATE_EMAIL } from "@/graphql/user"; + +config.global.plugins.push(Oruga); + +let router: Router; + +beforeEach(async () => { + router = createRouter({ + history: createWebHistory(), + routes: routes, + }); + + // await router.isReady(); +}); + +const email_mock = { + data: { + id: "987654", + }, +}; + +const generateWrapper = (mock_email = {}) => { + const global_data = getMockClient([[VALIDATE_EMAIL, mock_email]]); + global_data.provide.dateFnsLocale = enUS; + global_data.plugins = [router]; + return mount(EmailValidate, { + props: { + token: "azerty123456789", + }, + global: { + ...global_data, + stubs: { + RouterLink: false, + }, + }, + }); +}; + +describe("EmailValidate", () => { + it("Show simple", async () => { + const wrapper = generateWrapper(email_mock); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(1); + expect(requestHandlers.handle_0).toHaveBeenCalledWith({ + token: "azerty123456789", + }); + }); +}); diff --git a/tests/unit/specs/components/User/providerValidation.spec.ts b/tests/unit/specs/components/User/providerValidation.spec.ts new file mode 100644 index 000000000..d09d10cff --- /dev/null +++ b/tests/unit/specs/components/User/providerValidation.spec.ts @@ -0,0 +1,59 @@ +import { beforeEach, describe, it, expect } from "vitest"; +import { enUS } from "date-fns/locale"; +import { routes } from "@/router"; +import { createRouter, createWebHistory, Router } from "vue-router"; +import { getMockClient, requestHandlers } from "../../mocks/client"; +import ProviderValidation from "@/views/User/ProviderValidation.vue"; +import { config, mount } from "@vue/test-utils"; +import { Oruga } from "@oruga-ui/oruga-next"; +import flushPromises from "flush-promises"; +import { UPDATE_CURRENT_USER_CLIENT, LOGGED_USER } from "@/graphql/user"; + +config.global.plugins.push(Oruga); + +let router: Router; + +beforeEach(async () => { + router = createRouter({ + history: createWebHistory(), + routes: routes, + }); + + // await router.isReady(); +}); + +const update_mock = { + data: {}, +}; + +const logged_mock = { + data: {}, +}; + +const generateWrapper = (mock_update = {}, mock_logged = {}) => { + const global_data = getMockClient([ + [UPDATE_CURRENT_USER_CLIENT, mock_update], + [LOGGED_USER, mock_logged], + ]); + global_data.provide.dateFnsLocale = enUS; + global_data.plugins = [router]; + return mount(ProviderValidation, { + global: { + ...global_data, + stubs: { + RouterLink: false, + }, + }, + }); +}; + +describe("ProviderValidation", () => { + it("Show simple", async () => { + const wrapper = generateWrapper(update_mock, logged_mock); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(0); + expect(requestHandlers.handle_1).toHaveBeenCalledTimes(0); + }); +}); diff --git a/tests/unit/specs/components/User/resendConfirmation.spec.ts b/tests/unit/specs/components/User/resendConfirmation.spec.ts new file mode 100644 index 000000000..8ef5633ea --- /dev/null +++ b/tests/unit/specs/components/User/resendConfirmation.spec.ts @@ -0,0 +1,57 @@ +import { beforeEach, describe, it, expect } from "vitest"; +import { enUS } from "date-fns/locale"; +import { routes } from "@/router"; +import { createRouter, createWebHistory, Router } from "vue-router"; +import { getMockClient, requestHandlers } from "../../mocks/client"; +import ResendConfirmation from "@/views/User/ResendConfirmation.vue"; +import { config, mount } from "@vue/test-utils"; +import { Oruga } from "@oruga-ui/oruga-next"; +import flushPromises from "flush-promises"; +import { RESEND_CONFIRMATION_EMAIL } from "@/graphql/auth"; + +config.global.plugins.push(Oruga); + +let router: Router; + +beforeEach(async () => { + router = createRouter({ + history: createWebHistory(), + routes: routes, + }); + + // await router.isReady(); +}); + +const generateWrapper = () => { + const global_data = getMockClient([RESEND_CONFIRMATION_EMAIL]); + global_data.provide.dateFnsLocale = enUS; + global_data.plugins = [router]; + return mount(ResendConfirmation, { + global: { + ...global_data, + stubs: { + RouterLink: false, + }, + }, + }); +}; + +describe("ResendConfirmation", () => { + it("Show simple", async () => { + const wrapper = generateWrapper(); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(0); + + wrapper.find('form input[type="email"]').setValue("some@email.tld"); + wrapper.find("form").trigger("submit"); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(1); + expect(requestHandlers.handle_0).toHaveBeenCalledWith({ + email: "some@email.tld", + }); + }); +}); diff --git a/tests/unit/specs/components/User/sendPasswordReset.spec.ts b/tests/unit/specs/components/User/sendPasswordReset.spec.ts new file mode 100644 index 000000000..3b1ee1289 --- /dev/null +++ b/tests/unit/specs/components/User/sendPasswordReset.spec.ts @@ -0,0 +1,59 @@ +import { beforeEach, describe, it, expect } from "vitest"; +import { enUS } from "date-fns/locale"; +import { routes } from "@/router"; +import { createRouter, createWebHistory, Router } from "vue-router"; +import { getMockClient, requestHandlers } from "../../mocks/client"; +import SendPasswordReset from "@/views/User/SendPasswordReset.vue"; +import { config, mount } from "@vue/test-utils"; +import { Oruga } from "@oruga-ui/oruga-next"; +import flushPromises from "flush-promises"; +import { SEND_RESET_PASSWORD } from "@/graphql/auth"; +import { htmlRemoveId } from "../../common"; + +config.global.plugins.push(Oruga); + +let router: Router; + +beforeEach(async () => { + router = createRouter({ + history: createWebHistory(), + routes: routes, + }); + + // await router.isReady(); +}); + +const generateWrapper = () => { + const global_data = getMockClient([SEND_RESET_PASSWORD]); + global_data.provide.dateFnsLocale = enUS; + global_data.plugins = [router]; + return mount(SendPasswordReset, { + props: { + email: "some@email.tld", + }, + global: { + ...global_data, + stubs: { + RouterLink: false, + }, + }, + }); +}; + +describe("SendPasswordReset", () => { + it("Show simple", async () => { + const wrapper = generateWrapper(); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(htmlRemoveId(wrapper.html())).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(0); + + wrapper.find("form").trigger("submit"); + await flushPromises(); + expect(htmlRemoveId(wrapper.html())).toMatchSnapshot(); + + expect(requestHandlers.handle_0).toHaveBeenCalledWith({ + email: "some@email.tld", + }); + }); +}); diff --git a/tests/unit/specs/components/User/settingsOnboard.spec.ts b/tests/unit/specs/components/User/settingsOnboard.spec.ts new file mode 100644 index 000000000..4ff88c810 --- /dev/null +++ b/tests/unit/specs/components/User/settingsOnboard.spec.ts @@ -0,0 +1,73 @@ +import { beforeEach, describe, it, expect } from "vitest"; +import { enUS } from "date-fns/locale"; +import { routes } from "@/router"; +import { createRouter, createWebHistory, Router } from "vue-router"; +import { getMockClient, requestHandlers } from "../../mocks/client"; +import SettingsOnboard from "@/views/User/SettingsOnboard.vue"; +import { config, shallowMount } from "@vue/test-utils"; +import { Oruga } from "@oruga-ui/oruga-next"; +import flushPromises from "flush-promises"; +import { USER_SETTINGS } from "@/graphql/user"; + +config.global.plugins.push(Oruga); + +let router: Router; + +beforeEach(async () => { + router = createRouter({ + history: createWebHistory(), + routes: routes, + }); + + // await router.isReady(); +}); + +const settings_mock = { + data: {}, +}; + +const generateWrapper = (mock_settings = {}, step) => { + const global_data = getMockClient([[USER_SETTINGS, mock_settings]]); + global_data.provide.dateFnsLocale = enUS; + global_data.plugins = [router]; + return shallowMount(SettingsOnboard, { + props: { + step: step, + }, + global: { + ...global_data, + stubs: { + RouterLink: false, + }, + }, + }); +}; + +describe("SettingsOnboard", () => { + it("Show simple - step 1", async () => { + const wrapper = generateWrapper(settings_mock, 1); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(1); + expect(requestHandlers.handle_0).toHaveBeenCalledWith({}); + }); + + it("Show simple - step 2", async () => { + const wrapper = generateWrapper(settings_mock, 2); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(1); + expect(requestHandlers.handle_0).toHaveBeenCalledWith({}); + }); + + it("Show simple - step 3", async () => { + const wrapper = generateWrapper(settings_mock, 3); + await wrapper.vm.$nextTick(); + await flushPromises(); + expect(wrapper.html()).toMatchSnapshot(); + expect(requestHandlers.handle_0).toHaveBeenCalledTimes(1); + expect(requestHandlers.handle_0).toHaveBeenCalledWith({}); + }); +});