From fc8e44938499b33fddad70fcc7958b4fb5a84d70 Mon Sep 17 00:00:00 2001
From: Leah Schumann <leah.schumann@safelite.com>
Date: Wed, 18 May 2022 14:02:29 -0400
Subject: [PATCH] Reverting previous change to disabling address autocomplete
 after displaying additional address fields

---
 .../address-questions/address-questions.vue   | 35 ++++++++-----------
 1 file changed, 15 insertions(+), 20 deletions(-)

diff --git a/src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue b/src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue
index c310fbd10..8a677c14c 100644
--- a/src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue
+++ b/src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue
@@ -77,8 +77,6 @@ export default ({
 			alertCopyVerificationWarning: "",
 			alertHeadlineNoMatchWarning: "",
 			alertCopyNoMatchWarning: "",
-			autocomplete: {},
-			autocompleteListener: {}
 		}
 	},
 	computed: {
@@ -167,7 +165,7 @@ export default ({
 			this.$loadScript(`https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`)
 				.then(() => {
 					// Script is loaded, initialize the autocomplete textbox
-					self.autocomplete = new window.google.maps.places.Autocomplete(
+					const autocomplete = new window.google.maps.places.Autocomplete(
 						addressField1,
 						{
 							componentRestrictions: { country: ["us"] },
@@ -177,7 +175,7 @@ export default ({
 					);
 
 					// Standard place_changed event handling
-					self.autocompleteListener = window.google.maps.event.addListener(this.autocomplete, 'place_changed', fillInAddress);
+					const autocompleteListener = window.google.maps.event.addListener(autocomplete, 'place_changed', fillInAddress);
 
 					// Wrapping the addressField1 element in the Google Address Autocomplete object 
 					// will cause "autocomplete='off'" which Chrome completely ignores. This event
@@ -189,7 +187,10 @@ export default ({
 						// Make place results box stick to the input on scroll
 						const streetAddressField = document.getElementById("streetAddressField");
 						const autocompleteResultsContainer = document.getElementsByClassName("pac-container")[0];
-						streetAddressField.appendChild(autocompleteResultsContainer);
+						if (autocompleteResultsContainer) {
+							streetAddressField.appendChild(autocompleteResultsContainer);
+						}
+						
 					})
 
 					addressField1.onchange = function() {
@@ -223,10 +224,12 @@ export default ({
 
 					function fillInAddress(place) {
 						if (!place) {
-							place = self.autocomplete.getPlace();
+							place = autocomplete.getPlace();
 						}
 
 						if (place && place.address_components) {
+							self.showAddressFields = true;
+
 							for (const component of place.address_components) {
 								const componentType = component.types[0];
 
@@ -257,15 +260,18 @@ export default ({
 
 							self.displayVerificationWarning = false;
 							self.displayNoMatchWarning = false; 
-
-							self.showAddressFields = true;
 						} 
 						else {
 							self.displayVerificationWarning = true;
 							self.displayNoMatchWarning = false;
 						}
 						
-
+						// after showing the address fields, disable the address autocomplete
+						window.google.maps.event.removeListener(autocompleteListener);
+						window.google.maps.event.clearInstanceListeners(autocomplete);
+						addressField1.onchange = null;
+						const pacContainer = document.querySelector(".pac-container");
+						pacContainer.remove();
 
 					}
 				})
@@ -293,17 +299,6 @@ export default ({
 				}				
 			},
 			deep: true
-		},
-		showAddressFields: {
-			handler(newValue) {
-				// after showing the address fields, disable the address autocomplete
-				window.google.maps.event.removeListener(this.autocompleteListener);
-				window.google.maps.event.clearInstanceListeners(this.autocomplete);
-				const addressField1 = document.getElementById("autocomplete");
-				addressField1.onchange = null;
-				const pacContainer = document.querySelector(".pac-container");
-				pacContainer.remove();
-			}
 		}
 	},	
 	components: {