Adding tests
This commit is contained in:
brydon1
parent
8a139b96f6
commit
09adcc1114
6 changed files with 108 additions and 24 deletions
|
|
@ -30,7 +30,7 @@
|
|||
</textarea>
|
||||
</div>
|
||||
<p class="character-count margin-top-8">
|
||||
{{ characterCount }}/{{ maxLength }} characters remaining
|
||||
{{ maxLength - characterCount }}/{{ maxLength }} characters remaining
|
||||
</p>
|
||||
<div
|
||||
v-show="errorMessage"
|
||||
|
|
@ -136,7 +136,7 @@ export default {
|
|||
const data = evt.type === 'paste' ? (evt.clipboardData || window.clipboardData) : evt.dataTransfer;
|
||||
const value = data.getData('Text')?.trim();
|
||||
|
||||
this.$emit('update:modelValue', value);
|
||||
this.$emit('update:modelValue', this.modelValue + value);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -4,9 +4,10 @@ import contactDetails from '@/layouts/contact-details/contact-details.vue';
|
|||
// Supporting Files
|
||||
import { shallowMount } from '@vue/test-utils';
|
||||
import { getMountOptions } from '@/helpers/unit-test-helper';
|
||||
import { getRandomString, getRandomInt } from '@/helpers/data-generation';
|
||||
import { getRandomString, getRandomInt, getRandomBoolean } from '@/helpers/data-generation';
|
||||
import { createTestingPinia } from '@pinia/testing';
|
||||
import { navigationScenarios } from '@/router/router-constants/navigation-scenarios';
|
||||
import { useMainStore } from '@/store/index';
|
||||
|
||||
describe('contactDetails.vue', () => {
|
||||
describe('Rendering', () => {
|
||||
|
|
@ -153,7 +154,7 @@ describe('contactDetails.vue', () => {
|
|||
// Assert
|
||||
expect(footer.exists()).toBe(true);
|
||||
});
|
||||
test('Mocked store yields expected data', () => {
|
||||
test('Mocked store with no contact info yields expected data', () => {
|
||||
// Arrange
|
||||
const mountOptions = getMountOptions();
|
||||
|
||||
|
|
@ -184,9 +185,50 @@ describe('contactDetails.vue', () => {
|
|||
// Assert
|
||||
expect(wrapper.vm.firstName).toBe(firstName);
|
||||
expect(wrapper.vm.lastName).toBe(lastName);
|
||||
expect(wrapper.vm.email).toBe(emailAddress);
|
||||
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 wrapper = shallowMount(contactDetails, getMountOptions({
|
||||
global: {
|
||||
plugins: [createTestingPinia({
|
||||
initialState: {
|
||||
main: mainInitialState
|
||||
}
|
||||
})]
|
||||
}
|
||||
}));
|
||||
|
||||
// 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', () => {
|
||||
|
|
@ -222,5 +264,44 @@ describe('contactDetails.vue', () => {
|
|||
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
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@
|
|||
:isRequired="false"
|
||||
:cmsWidgetName="widget.notesQuestion"
|
||||
maxLength="250"
|
||||
:inputRows="3" />
|
||||
:inputRows="4" />
|
||||
|
||||
<p
|
||||
ref="disclaimerText"
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
class="disclaimer-link"
|
||||
linkType="text"
|
||||
text="Terms of Use"
|
||||
href="//www.safelite.com/terms-of-use" />.
|
||||
href="//www.safelite.com/terms-of-use" />{{ "." }}
|
||||
</p>
|
||||
|
||||
<siteFooter
|
||||
|
|
@ -136,14 +136,18 @@ export default {
|
|||
});
|
||||
},
|
||||
data() {
|
||||
const { firstName, lastName, emailAddress, phoneNumber, textUpdates, notesForTechnician }
|
||||
= useMainStore().contactInfo;
|
||||
const { firstName,
|
||||
lastName,
|
||||
emailAddress,
|
||||
phoneNumber,
|
||||
requestTextUpdates,
|
||||
notesForTechnician } = useMainStore().contactInfo;
|
||||
return {
|
||||
firstName,
|
||||
lastName,
|
||||
emailAddress,
|
||||
phoneNumber,
|
||||
requestTextUpdates: textUpdates,
|
||||
requestTextUpdates,
|
||||
notesForTechnician,
|
||||
widget: {
|
||||
siteHeader: 'SiteHeaderWidget',
|
||||
|
|
@ -196,7 +200,7 @@ export default {
|
|||
lastName: this.lastName,
|
||||
emailAddress: this.emailAddress,
|
||||
phoneNumber: this.phoneNumber,
|
||||
textUpdates: this.requestTextUpdates,
|
||||
requestTextUpdates: this.requestTextUpdates,
|
||||
notesForTechnician: this.notesForTechnician
|
||||
};
|
||||
useMainStore().updateContactInfo(contactInfo);
|
||||
|
|
|
|||
|
|
@ -99,7 +99,7 @@ const getDefaultState = () =>
|
|||
lastName: null,
|
||||
emailAddress: null,
|
||||
phoneNumber: null,
|
||||
textUpdates: false,
|
||||
requestTextUpdates: false,
|
||||
notesForTechnician: ''
|
||||
}
|
||||
},
|
||||
|
|
@ -201,7 +201,7 @@ export const useMainStore = defineStore({
|
|||
lastName: s.order.contactInfo.lastName ?? s.order.customer.lastName,
|
||||
emailAddress: s.order.contactInfo.emailAddress ?? s.order.customer.emailAddress,
|
||||
phoneNumber: s.order.contactInfo.phoneNumber ?? s.order.customer.phoneNumber,
|
||||
textUpdates: s.order.contactInfo.textUpdates ?? false,
|
||||
requestTextUpdates: s.order.contactInfo.requestTextUpdates ?? false,
|
||||
notesForTechnician: s.order.contactInfo.notesForTechnician
|
||||
}),
|
||||
experimentOrder: (state) =>
|
||||
|
|
@ -1142,7 +1142,7 @@ export const useMainStore = defineStore({
|
|||
this.order.contactInfo.lastName = contactInfo.lastName;
|
||||
this.order.contactInfo.emailAddress = contactInfo.emailAddress;
|
||||
this.order.contactInfo.phoneNumber = contactInfo.phoneNumber;
|
||||
this.order.contactInfo.textUpdates = contactInfo.textUpdates;
|
||||
this.order.contactInfo.requestTextUpdates = contactInfo.requestTextUpdates;
|
||||
this.order.contactInfo.notesForTechnician = contactInfo.notesForTechnician;
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -422,5 +422,8 @@ describe("Store", () => {
|
|||
expect(store.payment.insuranceCoverage.isVerified).toBe(false);
|
||||
expect(store.payment.insuranceCoverage.coverageStatus).toBe(coverageStatuses.PENDING);
|
||||
});
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
// TODO add tests
|
||||
describe('updateContactInfo method', () => {});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,19 +1,15 @@
|
|||
<template>
|
||||
<a v-if="linkType === 'navigation'" @click="handleClick" class="navigation-link" :href="href">
|
||||
{{text}}
|
||||
<slot name="after-text"></slot>
|
||||
{{text}}<slot name="after-text"></slot>
|
||||
</a>
|
||||
<a v-else-if="linkType === 'footer'" @click="handleClick" class="footer-link" :href="href" target="_blank">
|
||||
{{text}}
|
||||
<slot name="after-text"></slot>
|
||||
{{text}}<slot name="after-text"></slot>
|
||||
</a>
|
||||
<a v-else-if="linkType === 'textSmall'" @click="handleClick" class="small" :href="href">
|
||||
{{text}}
|
||||
<slot name="after-text"></slot>
|
||||
{{text}}<slot name="after-text"></slot>
|
||||
</a>
|
||||
<a v-else-if="linkType === 'text'" @click="handleClick" :href="href">
|
||||
{{text}}
|
||||
<slot name="after-text"></slot>
|
||||
{{text}}<slot name="after-text"></slot>
|
||||
</a>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue