import baseMixin from '@/mixins/base-mixin';
import { shallowMount } from '@vue/test-utils';
import widgetFields from '@/constants/cms-widget-fields.js';

describe('base-mixin', () => {
    it('should set and get cms content', () => {
        const expected = 'test';
        const wrapper = shallowMount(baseMixin, {
            propsData: {
                cmsContentByWidget: {}
            }
        });
        const cmsContent = { testWidget: { fieldName: expected } };

        wrapper.componentVM.setCmsContent(cmsContent);
        const actual = wrapper.componentVM.getCmsContent('testWidget', 'fieldName');
        expect(actual).toEqual(expected);
    });

    it('should return formatted class name for cmswidget', () => {
        const localThis = { cmsWidgetName: 'testWidget' };
        expect(baseMixin.computed.cssClassNameForCmsWidget.call(localThis)).toBe('widget-name-testWidget');
    });

    it('getInputQuestionWidgetAnswersNullSafe returns an empty array when the input question widget has no answers', () => {
        // Arrange
        const widgetName = 'inputQuestionWidget';
        const wrapper = shallowMount(baseMixin, {
            propsData: {
                cmsContentByWidget: {}
            }
        });
        const cmsContent = {
            [widgetName]: {
                [widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT]: 'Choose an option',
                [widgetFields.INPUT_QUESTION_WIDGET.ANSWERS]: []
            }
        };
        wrapper.componentVM.setCmsContent(cmsContent);

        // Act
        const answers = wrapper.componentVM.getInputQuestionWidgetAnswersNullSafe(widgetName);

        // Assert
        expect(answers).not.toBeNull(); // Check that answers is not null
        expect(Array.isArray(answers)).toBeTruthy(); // Check that answers is an array
        expect(answers).toHaveLength(0); // Check that answers is empty
    });

    it('getInputQuestionWidgetAnswersNullSafe returns a non-empty array when the input question widget has answers', () => {
        // Arrange
        const widgetName = 'inputQuestionWidget';
        const wrapper = shallowMount(baseMixin, {
            propsData: {
                cmsContentByWidget: {}
            }
        });
        const cmsContent = {
            [widgetName]: {
                [widgetFields.INPUT_QUESTION_WIDGET.QUESTION_TEXT]: 'Choose an option',
                [widgetFields.INPUT_QUESTION_WIDGET.ANSWERS]: [
                    {
                        Name: 'NameA',
                        Text: 'TextA'
                    },
                    {
                        Name: 'NameB',
                        Text: 'TextB'
                    }
                ]
            }
        };
        wrapper.componentVM.setCmsContent(cmsContent);

        // Act
        const answers = wrapper.componentVM.getInputQuestionWidgetAnswersNullSafe(widgetName);

        // Assert
        expect(answers).not.toBeNull(); // Check that answers is not null
        expect(Array.isArray(answers)).toBeTruthy(); // Check that answers is an array
        expect(answers).not.toHaveLength(0); // Check that answers is not empty
    });
});