DigitalConsumer.ISS/src/layouts/duplicate-check/duplicate-check.spec.js

// Components
import duplicateCheck from '@/layouts/duplicate-check/duplicate-check.vue';

// Supporting Files
import { shallowMount } from '@vue/test-utils';
import { getMountOptions } from '@/helpers/unit-test-helper.js';
import { getRandomString, getRandomInt, getRandomBoolean } from '@/helpers/data-generation.js';
import { createTestingPinia } from '@pinia/testing';
import navigationScenarios from '@/router/router-constants/navigation-scenarios.js';
import { useMainStore } from '@/store/index.js';

describe('duplicateCheck.vue', () => {
    describe('Rendering', () => {
        test('Should render site header', () => {
            // Arrange
            const wrapper = shallowMount(duplicateCheck, getMountOptions());

            // Act
            const siteHeader = wrapper.findComponent({ ref: 'siteHeader' });

            // Assert
            expect(siteHeader.exists()).toBeTruthy();
        });
        test('Should render sub title', () => {
            // Arrange
            const wrapper = shallowMount(duplicateCheck, getMountOptions());

            // Act
            const siteSubHeader = wrapper.findComponent({ ref: 'siteSubHeader' });

            // Assert
            expect(siteSubHeader.exists()).toBeTruthy();
        });
        test('Should render question subcomponent', () => {
            // Arrange
            const wrapper = shallowMount(duplicateCheck, getMountOptions());

            // Act
            const question = wrapper.findComponent({ ref: 'buttonQuestion' });

            // Assert
            expect(question.exists()).toBeTruthy();
        });
        test('Should render site footer', () => {
            // Arrange
            const wrapper = shallowMount(duplicateCheck, getMountOptions());

            // Act
            const footer = wrapper.findComponent({ ref: 'siteFooter' });

            // Assert
            expect(footer.exists()).toBeTruthy();
        });

        // TODO update or remove
        // test('Mocked store with no contact info yields expected data', () => {
        //     // Arrange
        //     const mountOptions = getMountOptions();

        //     const firstName = getRandomString(4, 15);
        //     const lastName = getRandomString(4, 15);
        //     const emailAddress = getRandomString(10, 20);
        //     const phoneNumber = getRandomInt(1000000000, 9999999999);
        //     const mainInitialState = {
        //         order: {
        //             customer: {
        //                 firstName,
        //                 lastName,
        //                 emailAddress,
        //                 phoneNumber
        //             }
        //         }
        //     };
        //     mountOptions.global = {
        //         plugins: [createTestingPinia({
        //             initialState: {
        //                 main: mainInitialState
        //             }
        //         })]
        //     };

        //     const wrapper = shallowMount(contactDetails, mountOptions);

        //     // Assert
        //     expect(wrapper.vm.firstName).toBe(firstName);
        //     expect(wrapper.vm.lastName).toBe(lastName);
        //     expect(wrapper.vm.emailAddress).toBe(emailAddress);
        //     expect(wrapper.vm.phoneNumber).toBe(phoneNumber);
        // });
        // test('Mock store with contact info yields expected data', () => {
        //     // Arrange
        //     const customer = {
        //         firstName: getRandomString(4, 15),
        //         lastName: getRandomString(4, 15),
        //         emailAddress: getRandomString(10, 20),
        //         phoneNumber: getRandomInt(1000000000, 9999999999)
        //     };
        //     const contactInfo = {
        //         firstName: getRandomString(4, 15),
        //         lastName: getRandomString(4, 15),
        //         emailAddress: getRandomString(10, 20),
        //         phoneNumber: getRandomInt(1000000000, 9999999999),
        //         requestTextUpdates: getRandomBoolean(),
        //         notesForTechnician: getRandomString(50, 100)
        //     };
        //     const mainInitialState = {
        //         order: {
        //             customer,
        //             contactInfo
        //         }
        //     };
        //     const mountOptions = getMountOptions();
        //     mountOptions.global = {
        //         plugins: [createTestingPinia({
        //             initialState: {
        //                 main: mainInitialState
        //             }
        //         })]
        //     };

        //     const wrapper = shallowMount(contactDetails, mountOptions);

        //     // Assert
        //     expect(wrapper.vm.firstName).toBe(contactInfo.firstName);
        //     expect(wrapper.vm.lastName).toBe(contactInfo.lastName);
        //     expect(wrapper.vm.emailAddress).toBe(contactInfo.emailAddress);
        //     expect(wrapper.vm.phoneNumber).toBe(contactInfo.phoneNumber);
        //     expect(wrapper.vm.requestTextUpdates).toBe(contactInfo.requestTextUpdates);
        //     expect(wrapper.vm.notesForTechnician).toBe(contactInfo.notesForTechnician);
        // });
    });

    describe('Navigation', () => {
        test('Back button clicked triggers navigation', () => {
            // Arrange
            const wrapper = shallowMount(duplicateCheck, getMountOptions({
                router: {
                    navigate: jest.fn()
                }
            }));

            // Act
            wrapper.vm.backButtonAction();

            // Assert
            expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
            expect(wrapper.vm.$router.navigate)
                .toHaveBeenCalledWith(navigationScenarios.CLICKED_BACK, undefined);
        });


        // TODO finish forward tests
        // test('Forward button clicked triggers navigation', () => {
        //     // Arrange
        //     const wrapper = shallowMount(contactDetails, getMountOptions({
        //         router: {
        //             navigate: jest.fn()
        //         }
        //     }));

        //     // Act
        //     wrapper.vm.forwardButtonAction();

        //     // Assert
        //     expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
        //     expect(wrapper.vm.$router.navigate)
        //         .toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
        // });
        // test('Forward button click updates contact info', () => {
        //     // Arrange
        //     const mountOptions = getMountOptions({
        //         router: {
        //             navigate: jest.fn()
        //         },
        //         global: {
        //             plugins: [createTestingPinia()]
        //         }
        //     });
        //     const wrapper = shallowMount(contactDetails, mountOptions);
        //     const firstName = getRandomString(4, 15);
        //     const lastName = getRandomString(4, 15);
        //     const emailAddress = getRandomString(10, 20);
        //     const phoneNumber = getRandomInt(1000000000, 9999999999);
        //     const requestTextUpdates = getRandomBoolean();
        //     const notesForTechnician = getRandomString(1, 100);
        //     wrapper.setData({
        //         firstName,
        //         lastName,
        //         emailAddress,
        //         phoneNumber,
        //         requestTextUpdates,
        //         notesForTechnician
        //     });

        //     // Act
        //     wrapper.vm.forwardButtonAction();

        //     // Assert
        //     expect(useMainStore().updateContactInfo).toHaveBeenCalledWith({
        //         firstName,
        //         lastName,
        //         emailAddress,
        //         phoneNumber,
        //         requestTextUpdates,
        //         notesForTechnician
        //     });
        // });
    });
});