Working on newly discovered defects related to address-questions show all field logic
This commit is contained in:
parent
dc309e1dae
commit
902d2a10b4
6 changed files with 66 additions and 43 deletions
|
|
@ -7,7 +7,6 @@ import { mount, shallowMount } from "@vue/test-utils";
|
|||
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||
import { storeMutations } from "@/constants/store-mutations";
|
||||
import store from "@/store";
|
||||
import { createImportSpecifier } from "typescript";
|
||||
|
||||
let autocompleteElement;
|
||||
describe("address-questions.vue", () => {
|
||||
|
|
@ -134,22 +133,19 @@ describe("address-questions.vue", () => {
|
|||
});
|
||||
|
||||
test("Should set this.showAddressFields to true when the model is prepopulated", async () => {
|
||||
// Arrange
|
||||
// Act
|
||||
const newAddressModel = {
|
||||
streetAddress: "foo",
|
||||
city: "foo",
|
||||
state: "foo",
|
||||
zipCode: "55555",
|
||||
};
|
||||
const wrapper = shallowMount(addressQuestions, {
|
||||
propsData: {
|
||||
modelValue: newAddressModel,
|
||||
// Arrange / Act
|
||||
const { wrapper } = setupMocks({
|
||||
props: {
|
||||
modelValue: {
|
||||
streetAddress: "foo",
|
||||
city: "foo",
|
||||
state: "foo",
|
||||
zipCode: "55555",
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
// Act
|
||||
wrapper.vm.setupAddressLookup();
|
||||
await wrapper.vm.$nextTick();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.showAddressFields).toBe(true);
|
||||
|
|
|
|||
|
|
@ -237,9 +237,9 @@ export default {
|
|||
this.fillInAddress
|
||||
);
|
||||
|
||||
// When the Street Address textbox receives focus,
|
||||
// append the search results list container to the bottom of the textbox
|
||||
// and disable browser autofill
|
||||
// When the Street Address textbox receives focus,
|
||||
// append the search results list container to the bottom of the textbox
|
||||
// and disable browser autofill
|
||||
this.addressField1.addEventListener("focus", (e) => {
|
||||
// Make place results box stick to the input on scroll
|
||||
const streetAddressField = document.getElementById("streetAddressField");
|
||||
|
|
@ -284,9 +284,7 @@ export default {
|
|||
}
|
||||
|
||||
// Get the address that the user clicked on (if any)
|
||||
const clickedAddress = document.querySelector(
|
||||
".pac-container .pac-item:hover"
|
||||
);
|
||||
const clickedAddress = document.querySelector(".pac-container .pac-item:hover");
|
||||
|
||||
// If the Street Address field changed without clicking (i.e. by pressing Tab, or clicking outside the field)
|
||||
if (clickedAddress === null) {
|
||||
|
|
@ -365,24 +363,39 @@ export default {
|
|||
this.displayVerificationWarning = false;
|
||||
},
|
||||
unloadAutocomplete() {
|
||||
window.google.maps.event.removeListener(this.autocompleteListener);
|
||||
window.google.maps.event.clearInstanceListeners(this.autocomplete);
|
||||
this.addressField1.onchange = null;
|
||||
if (this.autocompleteListener && this.autocomplete) {
|
||||
window.google.maps.event.removeListener(this.autocompleteListener);
|
||||
this.autocompleteListener = null;
|
||||
|
||||
const pacContainer = document.querySelector(".pac-container");
|
||||
if (pacContainer) {
|
||||
pacContainer.remove();
|
||||
window.google.maps.event.clearInstanceListeners(this.autocomplete);
|
||||
this.autocomplete = null;
|
||||
|
||||
this.addressField1.onchange = null;
|
||||
|
||||
const pacContainer = document.querySelector(".pac-container");
|
||||
if (pacContainer) {
|
||||
pacContainer.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// If we already have a full address, show it
|
||||
this.showAddressFields = this.addressModel.streetAddress &&
|
||||
this.addressModel.city &&
|
||||
this.addressModel.state &&
|
||||
this.addressModel.zipCode;
|
||||
|
||||
this.loadGooglePlacesAutocompleteScript();
|
||||
console.log(this.showAddressFields);
|
||||
debugger; // eslint-disable-line no-debugger
|
||||
console.log(`this.addressModel.streetAddress ${this.addressModel.streetAddress}`);
|
||||
console.log(`this.addressModel.city ${this.addressModel.city}`);
|
||||
console.log(`this.addressModel.state ${this.addressModel.state}`);
|
||||
console.log(`this.addressModel.zipCode ${this.addressModel.zipCode}`);
|
||||
this.showAddressFields =
|
||||
this.addressModel.streetAddress !== "" &&
|
||||
this.addressModel.city !== "" &&
|
||||
this.addressModel.state !== "" &&
|
||||
this.addressModel.zipCode !== "";
|
||||
console.log(this.showAddressFields);
|
||||
if (!this.showAddressFields) {
|
||||
this.loadGooglePlacesAutocompleteScript();
|
||||
}
|
||||
},
|
||||
unmounted() {
|
||||
this.unloadAutocomplete();
|
||||
|
|
@ -405,7 +418,7 @@ export default {
|
|||
this.addressModel.state = "";
|
||||
this.addressModel.zipCode = "";
|
||||
}
|
||||
|
||||
|
||||
this.displayVerificationWarning = false;
|
||||
|
||||
// Only deep watch the Address Model after a failed match
|
||||
|
|
@ -428,7 +441,6 @@ export default {
|
|||
alert,
|
||||
},
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
|
|||
|
|
@ -301,11 +301,12 @@ export default {
|
|||
);
|
||||
|
||||
await this.dispatchStoreAction(storeActions.SAVE_EMAIL, this.email, false);
|
||||
|
||||
await this.dispatchStoreAction(
|
||||
storeActions.SAVE_SERVICE_LOCATION,
|
||||
{
|
||||
zipCode: this.serviceZipCode,
|
||||
state: resultMap.serviceZipValidationResponse.state,
|
||||
zipCode: this.serviceZipCode,
|
||||
zipCodeCtu: resultMap.serviceZipValidationResponse.zipCodeCtu,
|
||||
},
|
||||
false
|
||||
|
|
|
|||
|
|
@ -96,7 +96,6 @@ export default {
|
|||
|
||||
<style lang="scss">
|
||||
.appointment-type-question {
|
||||
|
||||
.list-card img {
|
||||
height: auto;
|
||||
width: 3.417rem;
|
||||
|
|
|
|||
|
|
@ -325,8 +325,8 @@ export default {
|
|||
await this.dispatchStoreAction(
|
||||
storeActions.SAVE_SERVICE_ZIP_CODE_INFO,
|
||||
{
|
||||
zipCode: this.serviceZipCode,
|
||||
state: resultMap.zipCodeData.state,
|
||||
zipCode: this.serviceZipCode,
|
||||
zipCodeCtu: resultMap.zipCodeData.zipCodeCtu,
|
||||
},
|
||||
false
|
||||
|
|
@ -352,8 +352,8 @@ export default {
|
|||
{
|
||||
address: vehicleRegistrationInfo.address,
|
||||
city: vehicleRegistrationInfo.city,
|
||||
zipCode: vehicleRegistrationInfo.zipCode,
|
||||
state: vehicleRegistrationInfo.state,
|
||||
zipCode: vehicleRegistrationInfo.zipCode,
|
||||
zipCodeCtu: zipCodeData.zipCodeCtu,
|
||||
},
|
||||
false
|
||||
|
|
@ -362,8 +362,8 @@ export default {
|
|||
await this.dispatchStoreAction(
|
||||
storeActions.SAVE_SERVICE_ZIP_CODE_INFO,
|
||||
{
|
||||
zipCode: this.serviceZipCode,
|
||||
state: zipCodeData.state,
|
||||
zipCode: this.serviceZipCode,
|
||||
zipCodeCtu: zipCodeData.zipCodeCtu,
|
||||
},
|
||||
false
|
||||
|
|
|
|||
|
|
@ -253,9 +253,16 @@ export const mutations = {
|
|||
state.order.serviceLocation.appointmentType = serviceLocationInfo.appointmentType;
|
||||
state.order.serviceLocation.isVehicleProtected = serviceLocationInfo.isVehicleProtected;
|
||||
|
||||
if (serviceLocationInfo.provider) {
|
||||
state.order.serviceLocation.provider = serviceLocationInfo.provider;
|
||||
state.order.serviceLocation.provider = {
|
||||
providerNumber: serviceLocationInfo.provider?.providerNumber,
|
||||
address: {
|
||||
streetAddress: serviceLocationInfo.provider?.address?.streetAddress,
|
||||
city: serviceLocationInfo.provider?.address?.city,
|
||||
state: serviceLocationInfo.provider?.address?.state,
|
||||
zip: serviceLocationInfo.provider?.address?.zip
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
updateSchedule(state, scheduleInfo) {
|
||||
if (scheduleInfo) {
|
||||
|
|
@ -362,7 +369,15 @@ export const mutations = {
|
|||
state.order.serviceLocation.appointmentType = null;
|
||||
},
|
||||
resetServiceLocationProvider(state) {
|
||||
state.order.serviceLocation.provider = null;
|
||||
state.order.serviceLocation.provider = {
|
||||
providerNumber: null,
|
||||
address: {
|
||||
streetAddress: null,
|
||||
city: null,
|
||||
state: null,
|
||||
zip: null
|
||||
}
|
||||
};
|
||||
},
|
||||
resetServiceLocationMobileAddress(state) {
|
||||
state.order.serviceLocation.address = null;
|
||||
|
|
|
|||
Loading…
Reference in a new issue