// Components
import phoneNumberQuestion from "./phone-number-question";

// Supporting Files
import { shallowMount } from "@vue/test-utils";

describe("phone-number-question.vue", () => {
    it("Should render phoneNumberQuestion sub-component (textbox-question)", async () => {
        // Arrange
        const wrapper = shallowMount(phoneNumberQuestion, {});

        wrapper.getCmsContent = jest.fn();

        // Act
        const phoneNumber = wrapper.findComponent({ ref: "phoneNumber" });

        // Assert
        expect(phoneNumber.exists()).toBe(true);
    });

    it("Should emit new value when modelValue is changed", async () => {
        // Act
        const wrapper = shallowMount(phoneNumberQuestion, {
            propsData: {
                modelValue: "val",
            },
        });

        const phoneNumber = wrapper.findComponent({ ref: "phoneNumber" });
        await phoneNumber.setValue("val2");

        // Assert
        expect(wrapper.emitted("update:modelValue")).toEqual([["val2"]]);
    });

    it("Should emit new value when modelValue is changed", async () => {
        // Act
        const wrapper = shallowMount(phoneNumberQuestion, {
            propsData: {
                modelValue: "val",
            },
        });

        const phoneNumber = wrapper.findComponent({ ref: "phoneNumber" });
        await phoneNumber.setValue("val2");

        // Assert
        expect(wrapper.emitted("update:modelValue")).toEqual([["val2"]]);
    });

    it("Should combine external and internal validation rules to pass to textbox-question", async () => {
        // Act
        const wrapper = shallowMount(phoneNumberQuestion, {
            propsData: {
                validationRules: "outsideValidation",
            },
        });

        // Assert
        expect(wrapper.vm.validationRulesForTextBoxQuestion).toEqual(
            "outsideValidation|phone-number-format"
        );
    });
});