721 lines
24 KiB
JavaScript
721 lines
24 KiB
JavaScript
// Components
|
|
import orderConfirmation from '@/layouts/order-confirmation/order-confirmation.vue';
|
|
|
|
// Supporting Files
|
|
import { getMountOptions } from '@/helpers/unit-test-helper.js';
|
|
import { useMainStore } from '@/store/index.js';
|
|
import settleAllPromises from '@/helpers/layout-helper.js';
|
|
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
|
|
import { mount } from '@vue/test-utils';
|
|
import { createTestingPinia } from '@pinia/testing';
|
|
import { nextTick } from 'vue';
|
|
import coverageStatuses from "@/constants/coverage-statuses";
|
|
import coverageType from "@/constants/coverage-type";
|
|
|
|
jest.mock('@/helpers/layout-helper.js', () => jest.fn());
|
|
|
|
jest.mock('@/helpers/cms-content-helper', () => ({
|
|
fetchCmsContentForPage: jest.fn(),
|
|
processIfStatements: jest.fn(),
|
|
splitCopyOnCMSPlaceHolder: jest.fn()
|
|
}));
|
|
const wordingText = 'wording text {custom:address}';
|
|
|
|
const mockMixin = {
|
|
methods: {
|
|
getCmsContent: jest.fn().mockImplementation(() => wordingText),
|
|
setCmsContent: jest.fn()
|
|
}
|
|
};
|
|
|
|
const footerStub = {
|
|
render: () => {},
|
|
methods: {
|
|
updateButtonText: jest.fn()
|
|
}
|
|
};
|
|
|
|
const headerStub = {
|
|
render: () => {}
|
|
};
|
|
|
|
const vehicleBannerStub = {
|
|
render: () => {}
|
|
};
|
|
|
|
const addToCalendarStub = {
|
|
render: () => {}
|
|
};
|
|
|
|
const initialStore = {
|
|
order: {
|
|
schedule: {
|
|
date: '2024-03-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00',
|
|
jobMinMinutes: 60,
|
|
jobMaxMinutes: 90
|
|
},
|
|
serviceLocation: {
|
|
address: '123 Test Way',
|
|
address2: '#1',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345',
|
|
appointmentType: 'Inshop',
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
}
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isInsurance: true,
|
|
isPayInAdvance: false
|
|
},
|
|
contactInfo: {
|
|
firstName: 'Test',
|
|
lastName: 'Test',
|
|
servicePhone: '111-111-1111',
|
|
emailAddress: 'test@email.com'
|
|
}
|
|
}
|
|
};
|
|
|
|
const sessionStorage = {
|
|
schedule: {
|
|
date: '2024-03-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00',
|
|
jobMinMinutes: 60,
|
|
jobMaxMinutes: 90
|
|
},
|
|
serviceLocation: {
|
|
address: '123 Test Way',
|
|
address2: '#1',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345',
|
|
appointmentType: 'Inshop',
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
}
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
|
|
const sessionStorageMock = (() => {
|
|
let sessionStore = {};
|
|
|
|
return {
|
|
getItem(key) {
|
|
return sessionStore[key] || null;
|
|
},
|
|
setItem(key, value) {
|
|
sessionStore[key] = value.toString();
|
|
},
|
|
removeItem(key) {
|
|
delete sessionStore[key];
|
|
},
|
|
clear() {
|
|
sessionStore = {};
|
|
}
|
|
};
|
|
})();
|
|
|
|
Object.defineProperty(window, 'sessionStorage', {
|
|
value: sessionStorageMock
|
|
});
|
|
|
|
function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRun = () => {}) {
|
|
const mountOptions = getMountOptions({
|
|
router: {
|
|
navigate: jest.fn(),
|
|
navigateToExternalUrl: jest.fn()
|
|
}
|
|
});
|
|
|
|
mountOptions.global.stubs = {
|
|
siteFooter: footerStub,
|
|
siteHeader: headerStub,
|
|
vehicleBanner: vehicleBannerStub,
|
|
addToCalendar: addToCalendarStub
|
|
};
|
|
|
|
const testingPinia = createTestingPinia({
|
|
initialState: {
|
|
main: mainInitialState
|
|
}
|
|
});
|
|
useMainStore(testingPinia);
|
|
methodToRun();
|
|
|
|
mountOptions.global.plugins = [testingPinia];
|
|
mountOptions.mixins = [mockMixin];
|
|
mountOptions.data = () => (
|
|
initialData
|
|
);
|
|
|
|
const apiResponses = {
|
|
supportingItems: []
|
|
};
|
|
const apiPromise = Promise.resolve(apiResponses);
|
|
settleAllPromises.mockImplementation(() => apiPromise);
|
|
fetchCmsContentForPage.mockImplementation(() => Promise.resolve());
|
|
|
|
const wrapper = mount(orderConfirmation, mountOptions);
|
|
return { wrapper };
|
|
}
|
|
|
|
describe('OrderConfirmation.vue', () => {
|
|
beforeEach(() => {
|
|
window.sessionStorage.clear();
|
|
});
|
|
afterEach(() => {
|
|
window.sessionStorage.removeItem('submittedOrder');
|
|
});
|
|
describe('Page pre-requisites', () => {
|
|
test('If submitted order saved to store, page pre-reqs return true', async () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
|
|
await nextTick();
|
|
|
|
// Assert
|
|
expect(arePagePrerequisitesValid).toBe(true);
|
|
});
|
|
});
|
|
describe('Rendering', () => {
|
|
test('Should render Site Header', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const siteHeader = wrapper.findComponent(headerStub);
|
|
|
|
// Assert
|
|
expect(siteHeader.exists()).toBe(true);
|
|
});
|
|
test('Should render Vehicle Banner', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const vehicleBanner = wrapper.findComponent(vehicleBannerStub);
|
|
|
|
// Assert
|
|
expect(vehicleBanner.exists()).toBe(true);
|
|
});
|
|
test('If Advanced flow, should display Site Footer', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const testStore = {
|
|
order: {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00'
|
|
},
|
|
serviceLocation: {
|
|
appointmentType: 'Inshop'
|
|
}
|
|
},
|
|
issConfig: {
|
|
successReturnURL: 'testURL'
|
|
}
|
|
};
|
|
const { wrapper } = getMountedComponent(testStore);
|
|
|
|
// Act
|
|
const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });
|
|
|
|
// Assert
|
|
expect(siteFooter.exists()).toBe(true);
|
|
});
|
|
test('If Essential flow, should not display Site Footer', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });
|
|
|
|
// Assert
|
|
expect(siteFooter.isVisible()).toBe(false);
|
|
});
|
|
});
|
|
describe('Navigation', () => {
|
|
test('If Advanced flow, forward button action navigates to carrier URL', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const carrierReturnUrl = 'testURL';
|
|
const testStore = {
|
|
order: {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00'
|
|
},
|
|
serviceLocation: {
|
|
appointmentType: 'Inshop'
|
|
}
|
|
},
|
|
issConfig: {
|
|
successReturnURL: carrierReturnUrl
|
|
}
|
|
};
|
|
const { wrapper } = getMountedComponent(testStore);
|
|
|
|
// Act
|
|
wrapper.vm.forwardButtonAction();
|
|
|
|
// Assert
|
|
expect(wrapper.vm.$router.navigateToExternalUrl).toHaveBeenCalledWith(carrierReturnUrl);
|
|
});
|
|
});
|
|
describe('Computed properties', () => {
|
|
test('appointmentDateFormatted should return date in expected format', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentDateFormatted;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('Friday, March 1');
|
|
});
|
|
test('appointmentTimeFormatted should return Mobile time in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
appointmentType: 'Mobile'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentTimeFormatted;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('Between 9 AM - 10 AM');
|
|
});
|
|
test('appointmentTimeFormatted should return Drop Off time in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
appointmentType: 'Dropoff',
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
}
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentTimeFormatted;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('Drop off before 9:30 AM');
|
|
});
|
|
test('appointmentTimeFormatted should return In Shop time in expected format', () => {
|
|
// Arrange
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
|
|
const { wrapper } = getMountedComponent(initialStore);
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentTimeFormatted;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('at 9:00 AM');
|
|
});
|
|
test('appointmentWordingText should return Mobile text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
address: '123 Test Way',
|
|
address2: '#1',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345',
|
|
appointmentType: 'Mobile'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('wording text 123 Test Way, #1,<br/> Mesa, AZ 12345');
|
|
});
|
|
test('appointmentWordingText should return Drop Off text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
},
|
|
appointmentType: 'Dropoff'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('wording text 123 Safelite Street,<br/> Mesa, AZ 12345');
|
|
});
|
|
test('appointmentWordingText should return In Shop text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
},
|
|
appointmentType: 'Inshop'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('wording text 123 Safelite Street,<br/> Mesa, AZ 12345');
|
|
});
|
|
test('serviceLocationFullAddress should return text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
address: '123 Test Way',
|
|
address2: '#1',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345',
|
|
appointmentType: 'Mobile'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.serviceLocationFullAddress;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('123 Test Way, #1,<br/> Mesa, AZ 12345');
|
|
});
|
|
test('providerFullAddress should return text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
},
|
|
appointmentType: 'Inshop'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.providerFullAddress;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual('123 Safelite Street,<br/> Mesa, AZ 12345');
|
|
});
|
|
test('appointmentWordingText2 should return Mobile text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
address: '123 Test Way',
|
|
address2: '#1',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345',
|
|
appointmentType: 'Mobile'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText2;
|
|
|
|
// Assert
|
|
expect(testValue).toEqual(wordingText);
|
|
});
|
|
test('appointmentWordingText2 should return Drop Off and text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
},
|
|
appointmentType: 'Dropoff'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText2;
|
|
const expected = wrapper.vm.getBodyText2FromCms('Test Widget');
|
|
|
|
// Assert
|
|
expect(testValue).toEqual(expected);
|
|
});
|
|
test('appointmentWordingText2 should return In Shop text in expected format', () => {
|
|
// Arrange
|
|
const testSessionStorage = {
|
|
schedule: {
|
|
date: '2019-01-01',
|
|
startTime: '09:00',
|
|
endTime: '10:00'
|
|
},
|
|
serviceLocation: {
|
|
provider: {
|
|
address: {
|
|
streetAddress: '123 Safelite Street',
|
|
city: 'Mesa',
|
|
state: 'AZ',
|
|
zipCode: '12345'
|
|
}
|
|
},
|
|
appointmentType: 'Inshop'
|
|
},
|
|
insuranceCoverage: {
|
|
coverageStatus: coverageStatuses.VERIFIED,
|
|
coverageType: coverageType.Deductible
|
|
},
|
|
payment: {
|
|
isPayInAdvance: false
|
|
},
|
|
lineItems: {
|
|
vaps: []
|
|
},
|
|
policy: {},
|
|
damage: {}
|
|
};
|
|
window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage));
|
|
const { wrapper } = getMountedComponent();
|
|
|
|
// Act
|
|
const testValue = wrapper.vm.appointmentWordingText2;
|
|
const expected = wrapper.vm.getBodyText2FromCms('Test Widget');
|
|
|
|
// Assert
|
|
expect(testValue).toEqual(expected);
|
|
});
|
|
});
|
|
});
|