diff --git a/cypress/integration/control_autocomplete.js b/cypress/integration/control_autocomplete.js index 6dc57fcf43..4fc825f80d 100644 --- a/cypress/integration/control_autocomplete.js +++ b/cypress/integration/control_autocomplete.js @@ -1,64 +1,53 @@ context("Control Autocomplete", () => { before(() => { cy.login(); - cy.visit("/app/website"); + cy.visit("/app"); + cy.wait(4000); }); - function get_dialog_with_autocomplete(options) { - cy.visit("/app/website"); + const get_dialog_with_autocomplete = (fieldname, options) => { return cy.dialog({ title: "Autocomplete", fields: [ { label: "Select an option", - fieldname: "autocomplete", + fieldname: fieldname, fieldtype: "Autocomplete", - options: options || ["Option 1", "Option 2", "Option 3"], + options: options, }, ], }); - } + }; it("should set the valid value", () => { - get_dialog_with_autocomplete().as("dialog"); - - cy.get(".frappe-control[data-fieldname=autocomplete] input").focus().as("input"); - cy.wait(1000); - cy.get("@input").type("2", { delay: 300 }); - cy.get(".frappe-control[data-fieldname=autocomplete]") - .findByRole("listbox") - .should("be.visible"); - cy.get(".frappe-control[data-fieldname=autocomplete] input").type("{enter}", { - delay: 300, - }); - cy.get(".frappe-control[data-fieldname=autocomplete] input").blur(); + const fieldname = "autocomplete_1"; + get_dialog_with_autocomplete(fieldname, ["Option 1", "Option 2", "Option 3"]).as("dialog"); + cy.get(`.control-input > .awesomplete > input[data-fieldname=${fieldname}]`).as("input"); + cy.wait(500); + cy.get("@input").type("2{enter}", { delay: 300 }); cy.get("@dialog").then((dialog) => { - let value = dialog.get_value("autocomplete"); + let value = dialog.get_value(fieldname); expect(value).to.eq("Option 2"); dialog.clear(); + dialog.hide(); }); }); it("should set the valid value with different label", () => { - const options_with_label = [ + const fieldname = "autocomplete_2"; + get_dialog_with_autocomplete(fieldname, [ { label: "Option 1", value: "option_1" }, { label: "Option 2", value: "option_2" }, - ]; - get_dialog_with_autocomplete(options_with_label).as("dialog"); + ]).as("dialog"); - cy.get(".frappe-control[data-fieldname=autocomplete] input").focus().as("input"); - cy.get(".frappe-control[data-fieldname=autocomplete]") - .findByRole("listbox") - .should("be.visible"); - cy.get("@input").type("2", { delay: 300 }); - cy.get(".frappe-control[data-fieldname=autocomplete] input").type("{enter}", { - delay: 300, - }); - cy.get(".frappe-control[data-fieldname=autocomplete] input").blur(); + cy.get(`.control-input > .awesomplete > input[data-fieldname=${fieldname}]`).as("input"); + cy.wait(500); + cy.get("@input").type("2{enter}", { delay: 300 }); cy.get("@dialog").then((dialog) => { - let value = dialog.get_value("autocomplete"); + let value = dialog.get_value(fieldname); expect(value).to.eq("option_2"); dialog.clear(); + dialog.hide(); }); }); }); diff --git a/frappe/public/js/frappe/form/controls/autocomplete.js b/frappe/public/js/frappe/form/controls/autocomplete.js index 344320c468..beb951a567 100644 --- a/frappe/public/js/frappe/form/controls/autocomplete.js +++ b/frappe/public/js/frappe/form/controls/autocomplete.js @@ -90,16 +90,13 @@ frappe.ui.form.ControlAutocomplete = class ControlAutoComplete extends frappe.ui $(this.input_area).find(".awesomplete ul").css("min-width", "100%"); - this.$input.on( - "input", - frappe.utils.debounce((e) => { - if (this.get_query || this.df.get_query) { - this.execute_query_if_exists(e.target.value); - } else { - this.awesomplete.list = this.get_data(); - } - }, 500) - ); + this.$input.on("input", (e) => { + if (this.get_query || this.df.get_query) { + this.execute_query_if_exists(e.target.value); + } else { + this.awesomplete.list = this.get_data(); + } + }); this.$input.on("focus", () => { if (!this.$input.val()) {