perform front-end unit test from "view/User" - #1805
This commit is contained in:
Laurent Gay
@@ -0,0 +1,9 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`EmailValidate > Show simple 1`] = `
|
||||
"<section class="container mx-auto">
|
||||
<div>
|
||||
<h1 class="title">Your email has been changed</h1>
|
||||
</div>
|
||||
</section>"
|
||||
`;
|
||||
@@ -0,0 +1,3 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`ProviderValidation > Show simple 1`] = `"<p>Redirecting in progress…</p>"`;
|
||||
@@ -0,0 +1,54 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`ResendConfirmation > Show simple 1`] = `
|
||||
"<section class="container mx-auto pt-4 max-w-2xl">
|
||||
<h1>Resend confirmation email</h1>
|
||||
<!--v-if-->
|
||||
<form>
|
||||
<div data-oruga="field" class="o-field"><label for="emailAddress" class="o-field__label">Email address</label>
|
||||
<div class="o-field__body">
|
||||
<div class="o-field o-field--addons">
|
||||
<div data-oruga="input" class="o-input__wrapper o-input__wrapper--expanded"><input aria-required="true" required="" id="emailAddress" data-oruga-input="email" type="email" class="o-input" autocomplete="off">
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!---->
|
||||
</div>
|
||||
<p class="flex flex-wrap gap-1 mt-2"><button type="submit" class="o-btn o-btn--primary" role="button" data-oruga="button"><span class="o-btn__wrapper"><!----><span class="o-btn__label">Send the confirmation email again</span>
|
||||
<!----></span>
|
||||
</button><a href="/login" class="o-btn o-btn--primary o-btn--outlined-primary" role="button" data-oruga="button"><span class="o-btn__wrapper"><!----><span class="o-btn__label">Cancel</span>
|
||||
<!----></span>
|
||||
</a></p>
|
||||
</form>
|
||||
</section>"
|
||||
`;
|
||||
|
||||
exports[`ResendConfirmation > Show simple 2`] = `
|
||||
"<section class="container mx-auto pt-4 max-w-2xl">
|
||||
<h1>Resend confirmation email</h1>
|
||||
<!--v-if-->
|
||||
<div>
|
||||
<transition-stub name="fade" appear="false" persisted="false" css="true">
|
||||
<article title="Success" class="o-notification o-notification--success o-notification--top" data-oruga="notification">
|
||||
<!---->
|
||||
<div class="o-notification__wrapper">
|
||||
<!---->
|
||||
<div class="o-notification__content">If an account with this email exists, we just sent another confirmation email to some@email.tld</div>
|
||||
</div>
|
||||
</article>
|
||||
</transition-stub>
|
||||
<transition-stub name="fade" appear="false" persisted="false" css="true">
|
||||
<article class="mt-2 o-notification o-notification--info o-notification--top" data-oruga="notification">
|
||||
<!---->
|
||||
<div class="o-notification__wrapper">
|
||||
<!---->
|
||||
<div class="o-notification__content">Please check your spam folder if you didn't receive the email.</div>
|
||||
</div>
|
||||
</article>
|
||||
</transition-stub>
|
||||
</div>
|
||||
</section>"
|
||||
`;
|
||||
@@ -0,0 +1,54 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`SendPasswordReset > Show simple 1`] = `
|
||||
"<section class="container mx-auto">
|
||||
<h1>Forgot your password?</h1>
|
||||
<p>Enter your email address below, and we'll email you instructions on how to change your password.</p>
|
||||
<form>
|
||||
<div data-oruga="field" class="o-field o-field--filled"><label class="o-field__label" for="">Email address</label>
|
||||
<div class="o-field__body">
|
||||
<div class="o-field o-field--addons">
|
||||
<div data-oruga="input" class="o-input__wrapper o-input__wrapper--expanded"><input aria-required="true" required="" id="" data-oruga-input="email" type="email" class="o-input" autocomplete="off">
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!---->
|
||||
</div>
|
||||
<p class="my-4 flex gap-2"><button type="submit" class="o-btn o-btn--primary" role="button" data-oruga="button"><span class="o-btn__wrapper"><!----><span class="o-btn__label">Submit</span>
|
||||
<!----></span>
|
||||
</button><a href="/login" class="o-btn o-btn--text" role="button" data-oruga="button"><span class="o-btn__wrapper"><!----><span class="o-btn__label">Cancel</span>
|
||||
<!----></span>
|
||||
</a></p>
|
||||
</form>
|
||||
</section>"
|
||||
`;
|
||||
|
||||
exports[`SendPasswordReset > Show simple 2`] = `
|
||||
"<section class="container mx-auto">
|
||||
<h1>Forgot your password?</h1>
|
||||
<p>Enter your email address below, and we'll email you instructions on how to change your password.</p>
|
||||
<div>
|
||||
<transition-stub name="fade" appear="false" persisted="false" css="true">
|
||||
<article title="Success" class="o-notification o-notification--success o-notification--top" data-oruga="notification">
|
||||
<!---->
|
||||
<div class="o-notification__wrapper">
|
||||
<!---->
|
||||
<div class="o-notification__content">We just sent an email to some@email.tld</div>
|
||||
</div>
|
||||
</article>
|
||||
</transition-stub>
|
||||
<transition-stub name="fade" appear="false" persisted="false" css="true">
|
||||
<article class="o-notification o-notification--info o-notification--top" data-oruga="notification">
|
||||
<!---->
|
||||
<div class="o-notification__wrapper">
|
||||
<!---->
|
||||
<div class="o-notification__content">Please check your spam folder if you didn't receive the email.</div>
|
||||
</div>
|
||||
</article>
|
||||
</transition-stub>
|
||||
</div>
|
||||
</section>"
|
||||
`;
|
||||
@@ -0,0 +1,37 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`SettingsOnboard > Show simple - step 1 1`] = `
|
||||
"<div data-v-68ff875c="" class="container mx-auto">
|
||||
<h1 data-v-68ff875c="" class="title">Let's define a few settings</h1>
|
||||
<o-steps-stub data-v-68ff875c="" modelvalue="0" vertical="false" iconprev="chevron-left" iconnext="chevron-right" hasnavigation="false" destroyonhide="false" animated="true" animation="slide-next,slide-prev,slide-down,slide-up" animateinitially="false" labelposition="bottom" rounded="true"></o-steps-stub>
|
||||
<section data-v-68ff875c="" class="has-text-centered section buttons">
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" rounded="false" expanded="false" disabled="true" outlined="true" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" variant="success" rounded="false" expanded="false" disabled="false" outlined="true" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
<!--v-if-->
|
||||
</section>
|
||||
</div>"
|
||||
`;
|
||||
|
||||
exports[`SettingsOnboard > Show simple - step 2 1`] = `
|
||||
"<div data-v-68ff875c="" class="container mx-auto">
|
||||
<h1 data-v-68ff875c="" class="title">Let's define a few settings</h1>
|
||||
<o-steps-stub data-v-68ff875c="" modelvalue="1" vertical="false" iconprev="chevron-left" iconnext="chevron-right" hasnavigation="false" destroyonhide="false" animated="true" animation="slide-next,slide-prev,slide-down,slide-up" animateinitially="false" labelposition="bottom" rounded="true"></o-steps-stub>
|
||||
<section data-v-68ff875c="" class="has-text-centered section buttons">
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" rounded="false" expanded="false" disabled="false" outlined="true" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" variant="success" rounded="false" expanded="false" disabled="false" outlined="true" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
<!--v-if-->
|
||||
</section>
|
||||
</div>"
|
||||
`;
|
||||
|
||||
exports[`SettingsOnboard > Show simple - step 3 1`] = `
|
||||
"<div data-v-68ff875c="" class="container mx-auto">
|
||||
<h1 data-v-68ff875c="" class="title">Let's define a few settings</h1>
|
||||
<o-steps-stub data-v-68ff875c="" modelvalue="2" vertical="false" iconprev="chevron-left" iconnext="chevron-right" hasnavigation="false" destroyonhide="false" animated="true" animation="slide-next,slide-prev,slide-down,slide-up" animateinitially="false" labelposition="bottom" rounded="true"></o-steps-stub>
|
||||
<section data-v-68ff875c="" class="has-text-centered section buttons">
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" rounded="false" expanded="false" disabled="false" outlined="true" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
<!--v-if-->
|
||||
<o-button-stub data-v-68ff875c="" tag="router-link" variant="success" size="big" rounded="false" expanded="false" disabled="false" outlined="false" loading="false" inverted="false" nativetype="button" role="button" iconboth="false" to="[object Object]"></o-button-stub>
|
||||
</section>
|
||||
</div>"
|
||||
`;
|
||||
59
tests/unit/specs/components/User/emailValidate.spec.ts
Normal file
59
tests/unit/specs/components/User/emailValidate.spec.ts
Normal file
@@ -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",
|
||||
});
|
||||
});
|
||||
});
|
||||
59
tests/unit/specs/components/User/providerValidation.spec.ts
Normal file
59
tests/unit/specs/components/User/providerValidation.spec.ts
Normal file
@@ -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);
|
||||
});
|
||||
});
|
||||
57
tests/unit/specs/components/User/resendConfirmation.spec.ts
Normal file
57
tests/unit/specs/components/User/resendConfirmation.spec.ts
Normal file
@@ -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",
|
||||
});
|
||||
});
|
||||
});
|
||||
59
tests/unit/specs/components/User/sendPasswordReset.spec.ts
Normal file
59
tests/unit/specs/components/User/sendPasswordReset.spec.ts
Normal file
@@ -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",
|
||||
});
|
||||
});
|
||||
});
|
||||
73
tests/unit/specs/components/User/settingsOnboard.spec.ts
Normal file
73
tests/unit/specs/components/User/settingsOnboard.spec.ts
Normal file
@@ -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({});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user