Fix failing tests
This commit is contained in:
parent
1402137bbc
commit
f8a0de9599
6 changed files with 204 additions and 147 deletions
|
|
@ -314,7 +314,6 @@ describe('Google Map', () => {
|
|||
// Arrange
|
||||
const wrapper = shallowMount(googleMap, {});
|
||||
await awaitingSetupTicks(wrapper);
|
||||
const numberOfExtendCallsDuringMount = 2;
|
||||
|
||||
mockGeocode.mockImplementation(() => {
|
||||
const result = {
|
||||
|
|
@ -329,7 +328,7 @@ describe('Google Map', () => {
|
|||
const result = wrapper.vm.getBounds(locations);
|
||||
|
||||
// Assert
|
||||
expect(mockExtend).toHaveBeenCalledTimes(numberOfExtendCallsDuringMount + numberOfExtendCallsPostMount);
|
||||
expect(mockExtend).toHaveBeenCalledTimes(numberOfExtendCallsPostMount);
|
||||
expect(result).toBe(mockLatLngBound);
|
||||
}
|
||||
);
|
||||
|
|
|
|||
|
|
@ -2,13 +2,13 @@
|
|||
|
||||
exports[`Shop list button should render correctly with all relevant props 1`] = `
|
||||
<transition-stub name="fade" mode="out-in" appear="false" persisted="false" css="true" selectedvalue="selected value">
|
||||
<base-input-button-stub modelvalue="value of modal" groupname="name of group" buttonwrapperclasses="list-group base-input-button list-button rounded-3 d-flex flex-column w-100 no-hover" ismultiselect="false" validationrules="" isrequired="true" selectinginitiatesload="false" suppresserror="false" buttonlabel="Label of button" buttonlabelsubcopy="Sub copy of button" buttonbodycopy="button body copy" screenreaderonlytext="screen reader only text" additionalbuttondata="[object Object]" alttext="" iswide="false" value="1234"></base-input-button-stub>
|
||||
<base-input-button-stub modelvalue="value of modal" groupname="name of group" buttonwrapperclasses="list-group base-input-button list-button rounded-3 d-flex flex-column w-100 no-hover mb-2" ismultiselect="false" validationrules="" isrequired="true" selectinginitiatesload="false" suppresserror="false" buttonlabel="Label of button" buttonlabelsubcopy="Sub copy of button" buttonbodycopy="button body copy" screenreaderonlytext="screen reader only text" additionalbuttondata="[object Object]" alttext="" iswide="false" value="1234"></base-input-button-stub>
|
||||
</transition-stub>
|
||||
`;
|
||||
|
||||
exports[`Shop list button should render correctly with required props 1`] = `
|
||||
<transition-stub name="fade" mode="out-in" appear="false" persisted="false" css="true">
|
||||
<base-input-button-stub modelvalue="value of modal" groupname="name of group" buttonwrapperclasses="list-group base-input-button list-button rounded-3 d-flex flex-column w-100 no-hover" ismultiselect="false" validationrules="" isrequired="true" selectinginitiatesload="false" suppresserror="false" alttext="" iswide="false" value="1234"></base-input-button-stub>
|
||||
<base-input-button-stub modelvalue="value of modal" groupname="name of group" buttonwrapperclasses="list-group base-input-button list-button rounded-3 d-flex flex-column w-100 no-hover mb-2" ismultiselect="false" validationrules="" isrequired="true" selectinginitiatesload="false" suppresserror="false" alttext="" iswide="false" value="1234"></base-input-button-stub>
|
||||
</transition-stub>
|
||||
`;
|
||||
|
||||
|
|
|
|||
|
|
@ -149,10 +149,9 @@ describe('Shop list button', () => {
|
|||
|
||||
// Assert
|
||||
expect(buttonLabelSubCopy.exists()).toBeTruthy();
|
||||
expect(buttonLabelSubCopy.classes().length).toBe(4);
|
||||
expect(buttonLabelSubCopy.classes().length).toBe(3);
|
||||
expect(buttonLabelSubCopy.classes()).toContain('m-0');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('caption');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('ms-2');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('button-label-sub-copy');
|
||||
expect(buttonLabelSubCopy.classes()).toContain(textPosition);
|
||||
});
|
||||
test('when "textPosition" prop not provided', async () => {
|
||||
|
|
@ -173,10 +172,9 @@ describe('Shop list button', () => {
|
|||
|
||||
// Assert
|
||||
expect(buttonLabelSubCopy.exists()).toBeTruthy();
|
||||
expect(buttonLabelSubCopy.classes().length).toBe(3);
|
||||
expect(buttonLabelSubCopy.classes().length).toBe(2);
|
||||
expect(buttonLabelSubCopy.classes()).toContain('m-0');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('caption');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('ms-2');
|
||||
expect(buttonLabelSubCopy.classes()).toContain('button-label-sub-copy');
|
||||
});
|
||||
});
|
||||
describe('availability indicator block with expected when displayAvailabilityIndicators true', () => {
|
||||
|
|
@ -378,8 +376,7 @@ describe('Shop list button', () => {
|
|||
// Assert
|
||||
expect(buttonBodyCopy.exists()).toBeTruthy();
|
||||
expect(buttonBodyCopy.classes()).toContain('m-0');
|
||||
expect(buttonBodyCopy.classes()).toContain('button-label-sub-copy');
|
||||
expect(buttonBodyCopy.classes()).toContain('small');
|
||||
expect(buttonBodyCopy.classes()).toContain('button-body-copy');
|
||||
});
|
||||
test('screen reader only text when screenReaderOnlyText provided', async () => {
|
||||
// Arrange
|
||||
|
|
|
|||
|
|
@ -1,29 +1,13 @@
|
|||
/* eslint-env jest */
|
||||
import baseMixin from '@/mixins/base-mixin';
|
||||
import { shallowMount } from '@vue/test-utils';
|
||||
import { getMountOptions } from '@/helpers/unit-test-helper.js';
|
||||
import { mount, flushPromises } from '@vue/test-utils';
|
||||
import { createTestingPinia } from '@pinia/testing';
|
||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||
import navigationScenarios from '@/router/router-constants/navigation-scenarios';
|
||||
import routerParams from '@/router/router-constants/router-params';
|
||||
import { useMainStore } from '@/store';
|
||||
import serviceLocation from '@/layouts/service-location/service-location.vue';
|
||||
|
||||
// Define Mocks
|
||||
jest.mock('@/helpers/cms-content-helper', () => ({
|
||||
fetchCmsContentForPage: jest.fn(() => Promise.resolve('content'))
|
||||
}));
|
||||
|
||||
/** @ignore */
|
||||
function setupMocks() {
|
||||
const wrapper = shallowMount(
|
||||
serviceLocation,
|
||||
getMountOptions({
|
||||
router: {
|
||||
navigate: jest.fn()
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
wrapper.vm.$router.navigateWithSpinner = jest.fn();
|
||||
wrapper.vm.navigateBack = baseMixin.methods.navigateBack;
|
||||
|
||||
return { wrapper };
|
||||
}
|
||||
import { getZipCodeData } from '@/helpers/service-location-helper';
|
||||
|
||||
const mockGetServiceabilityDetails = () => {
|
||||
const serviceabilityDetails = {
|
||||
|
|
@ -35,123 +19,199 @@ const mockGetServiceabilityDetails = () => {
|
|||
|
||||
return Promise.resolve(serviceabilityDetails);
|
||||
};
|
||||
const mockZipcodeData = (zip) => {
|
||||
if (zip === '43235' || zip === '55555') {
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: false,
|
||||
isValid: true,
|
||||
isServiceable: true,
|
||||
city: 'Columbus',
|
||||
state: 'OH',
|
||||
zipCodeCtu: '01820'
|
||||
});
|
||||
}
|
||||
|
||||
if (zip === '45433') {
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: true,
|
||||
isValid: true,
|
||||
isServiceable: true,
|
||||
city: 'Columbus',
|
||||
state: 'OH',
|
||||
zipCodeCtu: '01820'
|
||||
});
|
||||
}
|
||||
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: false,
|
||||
isValid: false,
|
||||
isServiceable: false,
|
||||
city: null,
|
||||
state: null,
|
||||
zipCodeCtu: null
|
||||
});
|
||||
}
|
||||
const mockProviders = () => {
|
||||
return Promise.resolve([
|
||||
{
|
||||
"address": {
|
||||
"city": "COLUMBUS",
|
||||
"country": "US",
|
||||
"state": "OH",
|
||||
"streetAddress": "6826 Sawmill Rd",
|
||||
"streetAddress2": "",
|
||||
"zipCode": "43235",
|
||||
"zipCodeCtu": "03357"
|
||||
},
|
||||
"distanceInMiles": 4.136335989015438,
|
||||
"providerNumber": "003357",
|
||||
"companyName": "SAFELITE AUTOGLASS - COLUMBUS, OH",
|
||||
"phoneNumber": "6142336400",
|
||||
"isSafeliteShop": true
|
||||
},
|
||||
{
|
||||
"address": {
|
||||
"city": "Lewis Center",
|
||||
"country": "US",
|
||||
"state": "OH",
|
||||
"streetAddress": "1343 Cameron Ave",
|
||||
"streetAddress2": "",
|
||||
"zipCode": "43035",
|
||||
"zipCodeCtu": "03357"
|
||||
},
|
||||
"distanceInMiles": 8.193072412262042,
|
||||
"providerNumber": "003417",
|
||||
"companyName": "SAFELITE AUTOGLASS - LEWIS CENTER, OH",
|
||||
"phoneNumber": "6147815433",
|
||||
"isSafeliteShop": true
|
||||
}
|
||||
])
|
||||
}
|
||||
jest.mock(
|
||||
'@/helpers/service-location-helper',
|
||||
() => ({
|
||||
getServiceabilityDetails: jest.fn((mockServiceZipCode) => mockGetServiceabilityDetails(mockServiceZipCode))
|
||||
getServiceabilityDetails: jest.fn((mockServiceZipCode) => mockGetServiceabilityDetails(mockServiceZipCode)),
|
||||
getZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode)),
|
||||
getMobileZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode))
|
||||
})
|
||||
);
|
||||
|
||||
const mockMixin = {
|
||||
methods: {
|
||||
getCmsContent: jest.fn((widgetName, cmsFieldName) => {
|
||||
// linkWidgetName is not defined. This whole spec file needs review.
|
||||
if (widgetName === linkWidgetName) {
|
||||
return mockLinkCmsContent[cmsFieldName];
|
||||
const mockRoute = {
|
||||
params: {}
|
||||
};
|
||||
const mockRouter = {
|
||||
navigate: jest.fn()
|
||||
};
|
||||
const mountOptions = {
|
||||
global: {
|
||||
mixins: [
|
||||
{
|
||||
computed: {
|
||||
navigationScenarios() {
|
||||
return navigationScenarios;
|
||||
},
|
||||
routerParams() {
|
||||
return routerParams;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getCmsContent: jest.fn(),
|
||||
getFooterInfoBoxHeight: jest.fn(() => 80),
|
||||
getPageNameByQueryString: jest.fn(() => '')
|
||||
}
|
||||
}
|
||||
|
||||
if (widgetName === modalWidgetName) {
|
||||
return mockModalCmsContent[cmsFieldName];
|
||||
}
|
||||
|
||||
return null;
|
||||
}),
|
||||
|
||||
getZipCodeData: jest.fn((zip) => {
|
||||
if (zip === '43235' || zip === '55555') {
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: false,
|
||||
isValid: true,
|
||||
state: 'OH',
|
||||
zipCodeCtu: '01820'
|
||||
});
|
||||
}
|
||||
|
||||
if (zip === '45433') {
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: true,
|
||||
isValid: true,
|
||||
state: 'OH'
|
||||
});
|
||||
}
|
||||
|
||||
return Promise.resolve({
|
||||
containsMilitaryBase: false,
|
||||
isValid: false,
|
||||
state: null,
|
||||
zipCodeCtu: null
|
||||
});
|
||||
}),
|
||||
|
||||
onSubmit: jest.fn(),
|
||||
onInvalidSubmit: jest.fn()
|
||||
],
|
||||
mocks: {
|
||||
$route: mockRoute,
|
||||
$router: mockRouter
|
||||
},
|
||||
stubs: {
|
||||
alert: true,
|
||||
textBlock: true,
|
||||
appointmentTypeQuestion: true,
|
||||
contentGroupModal: true,
|
||||
siteFooter: true,
|
||||
siteHeader: true,
|
||||
siteSubHeader: true,
|
||||
shopAddress: true,
|
||||
serviceZipQuestion: true
|
||||
}
|
||||
}
|
||||
};
|
||||
function setupMocks({ appointmentType = AppointmentTypeStrings.IN_SHOP }) {
|
||||
mountOptions.global.plugins = [createTestingPinia({
|
||||
initialState: {
|
||||
main: {
|
||||
order: {
|
||||
serviceLocation: {
|
||||
appointmentType: appointmentType
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})];
|
||||
useMainStore().getProviders = jest.fn().mockImplementation(() => mockProviders());
|
||||
const wrapper = mount(serviceLocation, mountOptions);
|
||||
|
||||
describe('navigation', () => {
|
||||
test('if the back button is clicked, navigate back', async () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({
|
||||
wrapper.vm.$router.navigateWithSpinner = jest.fn();
|
||||
wrapper.vm.navigateBack = baseMixin.methods.navigateBack;
|
||||
|
||||
return { wrapper };
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
describe('service-location.vue', () => {
|
||||
describe('navigation', () => {
|
||||
test('if the back button is clicked, navigate back', async () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({
|
||||
});
|
||||
|
||||
// Act
|
||||
await wrapper.vm.navigateBack();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.$router.navigateWithSpinner).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
describe('updating service zip', () => {
|
||||
test('updates the page model after changing the service zip code', () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({ appointmentType: AppointmentTypeStrings.IN_SHOP });
|
||||
|
||||
const newServiceZipCode = '61606';
|
||||
|
||||
const shopAddressComponent = wrapper.findComponent({
|
||||
ref: 'shopAddress'
|
||||
});
|
||||
|
||||
// Act
|
||||
shopAddressComponent.vm.$emit('zip-updated', newServiceZipCode);
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.zipCode).toStrictEqual(newServiceZipCode);
|
||||
});
|
||||
|
||||
// Act
|
||||
await wrapper.vm.navigateBack();
|
||||
test('displays military zip message when zip is updated', async () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({ appointmentType: AppointmentTypeStrings.MOBILE });
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.$router.navigateWithSpinner).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe('updating service zip', () => {
|
||||
test('updates the page model after changing the service zip code', () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({
|
||||
mixins: [mockMixin]
|
||||
});
|
||||
|
||||
const newServiceZipCodeQuestion = {
|
||||
zipCode: '61606',
|
||||
state: 'IL'
|
||||
};
|
||||
|
||||
const serviceZipCodeComponent = wrapper.findComponent({
|
||||
ref: 'serviceZipCodeQuestion'
|
||||
});
|
||||
|
||||
// Act
|
||||
serviceZipCodeComponent.vm.$emit('update:modelValue', newServiceZipCodeQuestion);
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.serviceZipCodeQuestion).toStrictEqual(newServiceZipCodeQuestion);
|
||||
});
|
||||
|
||||
test('displays military zip message when zip is updated', () => {
|
||||
// Arrange
|
||||
const { wrapper } = setupMocks({});
|
||||
|
||||
const mobileLocationQuestionsComponent = wrapper.findComponent({
|
||||
ref: 'mobileLocationQuestions'
|
||||
});
|
||||
mobileLocationQuestionsComponent.resetComponent = jest.fn();
|
||||
|
||||
const serviceZipCodeComponent = wrapper.findComponent({
|
||||
ref: 'serviceZipCodeQuestion'
|
||||
});
|
||||
serviceZipCodeComponent.resetMobileFeePart = jest.fn();
|
||||
|
||||
expect(wrapper.vm.zipContainsMilitaryBase).toBe(false);
|
||||
|
||||
// TODO: Use or remove
|
||||
const newServiceZipCodeQuestion = {
|
||||
zipCode: '45433',
|
||||
state: 'OH'
|
||||
};
|
||||
|
||||
// Act
|
||||
serviceZipCodeComponent.vm.$emit('updated-contains-military-base', true);
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
|
||||
const mobileServiceZipCodeQuestion = wrapper.findComponent({
|
||||
ref: 'mobileServiceZipCodeQuestion'
|
||||
});
|
||||
|
||||
expect(wrapper.vm.zipContainsMilitaryBase).toBe(false);
|
||||
|
||||
const newMobileServiceZipCode = '45433'
|
||||
|
||||
// Act
|
||||
mobileServiceZipCodeQuestion.vm.$emit('update:modelValue', newMobileServiceZipCode);
|
||||
await wrapper.vm.$nextTick();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -62,6 +62,7 @@
|
|||
:isCollapsible="true"
|
||||
alertClass="alert-warning" />
|
||||
<shopAddress
|
||||
ref="shopAddress"
|
||||
v-model="selectedProvider"
|
||||
:serviceZipcode="zipCode"
|
||||
:selectedAppointmentType="selectedAppointmentType"
|
||||
|
|
@ -79,7 +80,7 @@
|
|||
<div
|
||||
v-if="isMobile">
|
||||
<div class="expandable-link-container">
|
||||
<a
|
||||
<a
|
||||
v-if="displayMilitaryZipAlert && !militaryBaseWarningExpanded"
|
||||
href="#"
|
||||
class="expandable-link"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import serviceZipQuestion from '@/layouts/service-location/service-zip-question/
|
|||
describe('service-zip-question.vue', () => {
|
||||
it('Should get the modelValue', async () => {
|
||||
// Arrange
|
||||
const text = 'test';
|
||||
const text = '12345';
|
||||
const wrapper = shallowMount(serviceZipQuestion, {
|
||||
props: {
|
||||
modelValue: text
|
||||
|
|
@ -14,15 +14,15 @@ describe('service-zip-question.vue', () => {
|
|||
|
||||
// Act
|
||||
const modelValueText = wrapper.vm.internalZipcode;
|
||||
wrapper.vm.internalZipcode = 'test also';
|
||||
wrapper.vm.internalZipcode = '55555';
|
||||
|
||||
// Assert
|
||||
expect(modelValueText).toEqual('test');
|
||||
expect(modelValueText).toEqual('12345');
|
||||
});
|
||||
|
||||
it('Should emit to set value', async () => {
|
||||
// Arrange
|
||||
const text = 'test';
|
||||
const text = '12345';
|
||||
const wrapper = shallowMount(serviceZipQuestion, {
|
||||
props: {
|
||||
modelValue: text
|
||||
|
|
@ -31,10 +31,10 @@ describe('service-zip-question.vue', () => {
|
|||
});
|
||||
|
||||
// Act
|
||||
wrapper.vm.internalZipcode = 'test also';
|
||||
wrapper.vm.internalZipcode = '55555';
|
||||
wrapper.vm.updateModelValue();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.emitted('update:modelValue')).toEqual([['test also']]);
|
||||
expect(wrapper.emitted('update:modelValue')).toEqual([['55555']]);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue