jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

CSR-1088 Added unit tests for modal component

Browse source
This commit is contained in:
Leah Schumann 2023-02-22 09:20:58 -05:00
parent c533cc4357
commit 7af8d9d26e
2 changed files with 15 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/digital-components/modal/modal.spec.js
View file

@ -1,37 +1,28 @@
const veeValidate = require("vee-validate");
jest.mock("vee-validate", () => ({ jest.mock("vee-validate", () => ({
useForm: jest.fn(), useForm: jest.fn(),
useIsFormTouched: jest.fn(), useIsFormTouched: jest.fn(),
useIsFormDirty: jest.fn(), useIsFormDirty: jest.fn(),
useIsFormValid: jest.fn() useIsFormValid: jest.fn(),
})); }));
const mockValidate = (returnValue) => jest.fn(async () => Promise.resolve({ valid: returnValue })); const mockValidate = (returnValue) => jest.fn(async () => Promise.resolve({ valid: returnValue }));
import { shallowMount } from "@vue/test-utils"; import { mount, shallowMount } from "@vue/test-utils";
import Modal from "./modal"; import Modal from "./modal";
import crypto from "crypto"; import crypto from "crypto";
import { useForm, useIsFormDirty, useIsFormTouched, useIsFormValid } from "vee-validate" import { useForm, useIsFormDirty, useIsFormTouched, useIsFormValid } from "vee-validate";
const modalId = "modal-one";
const footerButtonText = "Sample footer text here."; const footerButtonText = "Sample footer text here.";
const headerText = "Sample header text here."; const headerText = "Sample header text here.";
global.crypto = crypto; global.crypto = crypto;
describe("modal.vue", () => { describe("modal.vue", () => {
it("Should display modal header text when headerText is defined", async () => { it("Should display modal header text when headerText is defined", async () => {
const wrapper = shallowMount(Modal, { const wrapper = shallowMount(Modal, {
props: { props: {
modalId: modalId,
footerButtonText: footerButtonText,
headerText: headerText, headerText: headerText,
footerButtonText: footerButtonText,
}, },
attachTo: document.body, attachTo: document.body,
}); });
@ -41,7 +32,6 @@ describe("modal.vue", () => {
it("Should display footer button text when footerButtonText is defined", async () => { it("Should display footer button text when footerButtonText is defined", async () => {
const wrapper = shallowMount(Modal, { const wrapper = shallowMount(Modal, {
props: { props: {
modalId: modalId,
footerButtonText: footerButtonText, footerButtonText: footerButtonText,
}, },
attachTo: document.body, attachTo: document.body,
@ -51,13 +41,12 @@ describe("modal.vue", () => {
it("Should emit 'footer-button-event' if the form is valid", async () => { it("Should emit 'footer-button-event' if the form is valid", async () => {
useForm.mockReturnValue({ useForm.mockReturnValue({
validate: mockValidate(true) validate: mockValidate(true),
}) });
const resetButtonStyle = jest.fn(); const resetButtonStyle = jest.fn();
const wrapper = shallowMount(Modal, { const wrapper = shallowMount(Modal, {
props: { props: {
modalId: modalId,
footerButtonText: footerButtonText, footerButtonText: footerButtonText,
headerText: headerText, headerText: headerText,
}, },
@ -69,18 +58,16 @@ describe("modal.vue", () => {
await buttonMain.trigger("click-event"); await buttonMain.trigger("click-event");
expect(wrapper.emitted("footer-button-event")).toBeTruthy(); expect(wrapper.emitted("footer-button-event")).toBeTruthy();
}); });
it("Should not emit 'footer-button-event' if the form is not valid", async () => { it("Should not emit 'footer-button-event' if the form is not valid", async () => {
useForm.mockReturnValue({ useForm.mockReturnValue({
validate: mockValidate(false) validate: mockValidate(false),
}) });
const resetButtonStyle = jest.fn(); const resetButtonStyle = jest.fn();
const wrapper = shallowMount(Modal, { const wrapper = shallowMount(Modal, {
props: { props: {
modalId: modalId,
footerButtonText: footerButtonText, footerButtonText: footerButtonText,
headerText: headerText, headerText: headerText,
}, },
@ -92,8 +79,5 @@ describe("modal.vue", () => {
await buttonMain.trigger("click-event"); await buttonMain.trigger("click-event");
expect(wrapper.emitted("footer-button-event")).toBeFalsy(); expect(wrapper.emitted("footer-button-event")).toBeFalsy();
}); });
}); });