Merge pull request #1863 from Safelite/feature/CSR-2065

Feature/csr 2065
This commit is contained in:
Leah Schumann 2024-05-23 09:46:38 -04:00 committed by GitHub
commit 65a0327a0f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -250,16 +250,20 @@ export default {
// 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");
const autocompleteResultsContainer =
document.getElementsByClassName("pac-container")[0];
this.addressField1.addEventListener(
"focus",
(e) => {
// Make place results box stick to the input on scroll
const streetAddressField = document.getElementById("streetAddressField");
const autocompleteResultsContainer =
document.getElementsByClassName("pac-container")[0];
if (autocompleteResultsContainer) {
streetAddressField.appendChild(autocompleteResultsContainer);
}
});
if (autocompleteResultsContainer) {
streetAddressField.appendChild(autocompleteResultsContainer);
}
},
{ once: true }
);
this.addressField1.addEventListener("keydown", (e) => {
// When the user presses a key in the Street Address field, immediately disable autocomplete for that field.
@ -287,22 +291,25 @@ export default {
// });
this.addressField1.addEventListener("input", (e) => {
console.log(`input event`);
console.log(e);
// console.log(`input event`);
// console.log(e);
switch (e.inputType) {
case "insertText":
case "insertFromPaste":
case "deleteContentBackward":
// If the user enters text by typing, or pasting text, or deleting text already entered, disable *autofill*
this.disableAutoFill();
break;
default:
// If the user enters text by *autofill* then disable the *autocomplete*
//this.showAddressFields = true;
//this.addressField1.dispatchEvent(new Event("change"))
this.unloadAutocomplete();
}
this.$nextTick(() => {
switch (e.inputType) {
case "insertText":
case "insertFromPaste":
case "deleteContentBackward":
// If the user enters text by typing, or pasting text, or deleting text already entered, disable *autofill*
this.disableAutoFill();
break;
default:
// If the user enters text by *autofill* then disable the *autocomplete*
this.showAddressFields = true;
this.addressField1.classList.remove("has-icon");
//this.addressField1.dispatchEvent(new Event("change"))
this.unloadAutocomplete();
}
});
});
},
disableAutoFill() {
@ -448,24 +455,37 @@ export default {
}
// Temporary
const element = document.getElementsByClassName("address-questions")[0];
element.addEventListener("change", (e) => {
console.log(`change event`);
console.log(e);
if (this.showAddressFields) {
return false;
}
// const element = document.getElementsByClassName("address-questions")[0];
// element.addEventListener(
// "change",
// (e) => {
// // console.log(`change event`);
// // console.log(e);
let autoFilledInputs = [];
autoFilledInputs = element.querySelectorAll("input:-webkit-autofill");
// if (this.showAddressFields) {
// return false;
// }
this.showAddressFields = autoFilledInputs.length > 0;
if (this.showAddressFields) {
this.unloadAutocomplete();
}
// let autoFilledInputs = [];
// autoFilledInputs = element.querySelectorAll("input:-webkit-autofill");
this.addressField1.classList.remove("has-icon");
});
// console.log(this.addressModel.city);
// this.$nextTick(() => {
// this.showAddressFields = autoFilledInputs.length > 0;
// console.log(this.addressModel.city);
// console.log(document.getElementById("city").value);
// });
// console.log(this.addressModel.city);
// console.log(document.getElementById("city").value);
// if (this.showAddressFields) {
// this.unloadAutocomplete();
// }
// this.addressField1.classList.remove("has-icon");
// }
// // { once: true }
// );
},
beforeUpdate() {
// It is necessary to set focus on the street address on this lifecycle hook when this component is used in a modal.