import { shallowMount } from "@vue/test-utils";
import Modal from "./modal";
import crypto from "crypto";

const modalId = "modal-one";
const footerButtonText = "Sample footer text here.";
const headerText = "Sample header text here.";

global.crypto = crypto;

describe("modal.vue", () => {
    it("Should display footer button text when footerButtonText is defined", async () => {
        const wrapper = shallowMount(Modal, {
            props: {
                modalId: modalId,
                footerButtonText: footerButtonText,
            },
            attachTo: document.body,
        });
        expect(wrapper.html()).toEqual(expect.stringContaining(footerButtonText));
    });

    it("Should display modal header text when headerText is defined", async () => {
        const wrapper = shallowMount(Modal, {
            props: {
                modalId: modalId,
                footerButtonText: footerButtonText,
                headerText: headerText,
            },
            attachTo: document.body,
        });
        expect(wrapper.html()).toEqual(expect.stringContaining(headerText));
    });
});