import { shallowMount } from '@vue/test-utils';
// eslint-disable-next-line max-len
import windshieldChipCountQuestion from '@/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue';
import { getMountOptions } from '@/helpers/unit-test-helper.js';

/** @ignore */
function setupMocks({
    modelValueProp = ['Two'],
    groupName = 'WindshieldChipCountQuestion',
    cmsQuestionText = 'How many chips are we repairing?',
    cmsAnswers = [{ Name: 'One' }, { Name: 'Two' }, { Name: 'Three' }],
    dataFromStoreApi = []
}) {
    const mountOptions = getMountOptions({
    });

    // Mock props
    const mockMixin = {
        methods: {
            getCmsContent: jest.fn()
        }
    };
    mountOptions.propsData = {
        modelValue: modelValueProp
    };
    mountOptions.mixins = [mockMixin];

    const wrapper = shallowMount(windshieldChipCountQuestion, mountOptions);

    // Mock CMS content
    const cmsContent = {
        groupName,
        QuestionText: cmsQuestionText,
        Answers: cmsAnswers
    };
    const damageOptions = dataFromStoreApi;
    return { wrapper, cmsContent, damageOptions };
}

describe('windshield-chip-count-question.vue', () => {
    test('Selected chip count is emitted upon selection.', async () => {
        // Arrange
        const { wrapper } = setupMocks({ modelValueProp: 1 });

        // Act
        wrapper.vm.selectedValue = '2';

        // Assert
        expect(wrapper.emitted()['update:modelValue'][0]).toEqual([2]);
    });

    test('selectedValue matches modelValue', () => {
        // Arrange/Act
        const { wrapper } = setupMocks({ modelValueProp: 2 });

        // Assert
        expect(wrapper.vm.selectedValue).toBe(2);
    });
});