jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #470 from Safelite/feature/CSR-591

Browse source 
Reverting previous change to disabling address autocomplete after dis…
This commit is contained in:
Leah Schumann 2022-05-18 14:08:58 -04:00 committed by GitHub
commit 6dfd70b77e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue
View file

@ -77,8 +77,6 @@ export default ({
alertCopyVerificationWarning: "", alertCopyVerificationWarning: "",
alertHeadlineNoMatchWarning: "", alertHeadlineNoMatchWarning: "",
alertCopyNoMatchWarning: "", alertCopyNoMatchWarning: "",
autocomplete: {},
autocompleteListener: {}
} }
}, },
computed: { computed: {
@ -167,7 +165,7 @@ export default ({
this.$loadScript(`https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`) this.$loadScript(`https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`)
.then(() => { .then(() => {
// Script is loaded, initialize the autocomplete textbox // Script is loaded, initialize the autocomplete textbox
self.autocomplete = new window.google.maps.places.Autocomplete( const autocomplete = new window.google.maps.places.Autocomplete(
addressField1, addressField1,
{ {
componentRestrictions: { country: ["us"] }, componentRestrictions: { country: ["us"] },
@ -177,7 +175,7 @@ export default ({
); );
// Standard place_changed event handling // 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 // Wrapping the addressField1 element in the Google Address Autocomplete object
// will cause "autocomplete='off'" which Chrome completely ignores. This event // 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 // Make place results box stick to the input on scroll
const streetAddressField = document.getElementById("streetAddressField"); const streetAddressField = document.getElementById("streetAddressField");
const autocompleteResultsContainer = document.getElementsByClassName("pac-container")[0]; const autocompleteResultsContainer = document.getElementsByClassName("pac-container")[0];
streetAddressField.appendChild(autocompleteResultsContainer); if (autocompleteResultsContainer) {
streetAddressField.appendChild(autocompleteResultsContainer);
}
}) })
addressField1.onchange = function() { addressField1.onchange = function() {
@ -223,10 +224,12 @@ export default ({
function fillInAddress(place) { function fillInAddress(place) {
if (!place) { if (!place) {
place = self.autocomplete.getPlace(); place = autocomplete.getPlace();
} }
if (place && place.address_components) { if (place && place.address_components) {
self.showAddressFields = true;
for (const component of place.address_components) { for (const component of place.address_components) {
const componentType = component.types[0]; const componentType = component.types[0];
@ -257,15 +260,18 @@ export default ({
self.displayVerificationWarning = false; self.displayVerificationWarning = false;
self.displayNoMatchWarning = false; self.displayNoMatchWarning = false;
self.showAddressFields = true;
} }
else { else {
self.displayVerificationWarning = true; self.displayVerificationWarning = true;
self.displayNoMatchWarning = false; 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 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: { components: {