import { shallowMount } from "@vue/test-utils";
import checkboxQuestion from "./checkbox-question";
import { nextTick } from "vue";

// Mock CMS content
const questionText = "Question Text";
const mockMixin = {
    methods: {
        getCmsContent: jest.fn().mockImplementation(() => {
            return questionText;
        }),
    },
};

describe("checkbox-question.vue", () => {
    it("Should return checkbox name", async () => {
        // Act
        const wrapper = shallowMount(checkboxQuestion, {
            propsData: {
                checkboxName: "Checkbox",
            },
            mixins: [mockMixin],
        });

        // Assert
        const input = wrapper.find("input");

        // Expect
        expect(input.attributes().name).toEqual("Checkbox");
    });

    it("Should return default id when no custom id is specified", async () => {
        // Act
        const wrapper = shallowMount(checkboxQuestion, {
            propsData: {},
            mixins: [mockMixin],
        });

        // Assert
        const input = wrapper.find("input");

        // Expect
        expect(input.attributes().id).not.toBeFalsy();
    });

    it("Should return custom id when specified", async () => {
        // Act
        const wrapper = shallowMount(checkboxQuestion, {
            propsData: {
                customInputId: "Checkbox ID",
            },
            mixins: [mockMixin],
        });

        // Assert
        const input = wrapper.find("input");

        // Expect
        expect(input.attributes().id).toEqual("Checkbox ID");
    });

    it("Should return tabindex value", async () => {
        // Act
        const wrapper = shallowMount(checkboxQuestion, {
            propsData: {
                tabIndex: "1",
            },
            mixins: [mockMixin],
        });

        // Assert
        const input = wrapper.find("input");

        // Expect
        expect(input.attributes().tabindex).toEqual("1");
    });

    it("Should return label text", async () => {
        // Act
        const wrapper = shallowMount(checkboxQuestion, {
            propsData: {
                screenReaderOnlyText: "screenreader text",
            },
            mixins: [mockMixin],
        });

        // Assert
        const paragraph = wrapper.find("span");

        expect(paragraph.text()).toEqual("screenreader text");
    });
});