import { shallowMount } from "@vue/test-utils";
import vehicleProtectedQuestion from "./vehicle-protected-question";

jest.mock("@/digital-components/textbox-question/textbox-question", () => ({
    getCmsContent: jest.fn(),
}));

const mockMixin = {
    methods: {
        getCmsContent: jest.fn((widgetName, cmsFieldName) => {
            if (cmsFieldName === "Answers") {
                return [
                    {
                        AnswerImageUrl: "",
                        Name: "YesAnswer",
                        SubText: "",
                        SubWidgetName: "",
                        Text: "Yes",
                    },
                    {
                        AnswerImageUrl: "",
                        Name: "NoAnswer",
                        SubText: "",
                        SubWidgetName: "",
                        Text: "No",
                    },
                ];
            }
            return "QuestionText";
        }),
    },
};

describe("service-zip-question.vue", () => {
    it("Should get the modelValue", async () => {
        // Arrange
        const answer = "YesAnswer";
        const wrapper = shallowMount(vehicleProtectedQuestion, {
            mixins: [mockMixin],
            props: {
                modelValue: answer,
            },
            attachTo: document.body,
        });

        // Act
        const modelValueAnswer = wrapper.vm.selectedValue;

        // Assert
        expect(modelValueAnswer).toEqual(answer);
    });

    it("Should emit to set value", async () => {
        // Arrange
        const yesAnswer = "YesAnswer";
        const noAnswer = "NoAnswer";
        const wrapper = shallowMount(vehicleProtectedQuestion, {
            mixins: [mockMixin],
            props: {
                modelValue: yesAnswer,
            },
            attachTo: document.body,
        });

        // Act
        wrapper.vm.selectedValue = noAnswer;

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