diff --git a/packages/main/cypress/specs/Input.cy.tsx b/packages/main/cypress/specs/Input.cy.tsx
index d9189c67c0ba..aea5cd30342d 100644
--- a/packages/main/cypress/specs/Input.cy.tsx
+++ b/packages/main/cypress/specs/Input.cy.tsx
@@ -384,13 +384,13 @@ describe("Input general interaction", () => {
it("tests selection-change with custom items", () => {
cy.mount(
-
-
-
-
-
+
+
+
+
+
- );
+ );
cy.get("ui5-input")
.as("input");
@@ -435,11 +435,11 @@ describe("Input general interaction", () => {
it("Should fire 'input' event when the value is cleared with ESC", () => {
cy.mount(
- );
+ );
- cy.get("[ui5-input]").then($input => {
- $input[0].addEventListener("ui5-input", cy.spy().as("inputEvent"));
- });
+ cy.get("[ui5-input]").then($input => {
+ $input[0].addEventListener("ui5-input", cy.spy().as("inputEvent"));
+ });
cy.get("[ui5-input]").realClick();
cy.get("[ui5-input]").realPress("a");
@@ -499,13 +499,13 @@ describe("Input arrow navigation", () => {
it("Should navigate up and down through the suggestions popover with arrow keys", () => {
cy.mount(
-
-
-
-
-
+
+
+
+
+
- );
+ );
cy.get("#myInput2")
.as("input");
@@ -551,7 +551,7 @@ describe("Input PAGEUP/PAGEDOWN navigation", () => {
beforeEach(() => {
cy.mount(
-
+
@@ -564,9 +564,9 @@ describe("Input PAGEUP/PAGEDOWN navigation", () => {
-
+
- );
+ );
});
it("Should focus the tenth item from the suggestions popover with PAGEDOWN", () => {
cy.get("ui5-input")
@@ -626,11 +626,11 @@ describe("Selection-change event", () => {
it("Selection-change event fires with null arguments when suggestion was selected but user alters input value to something else", () => {
cy.mount(
-
-
-
+
+
+
- );
+ );
cy.get("ui5-input")
.as("input");
@@ -676,6 +676,61 @@ describe("Selection-change event", () => {
expect(eventCount).to.equal(2);
});
});
+
+ it("Fires selection-change when same item is reselected after input is changed", () => {
+ cy.mount(
+
+
+
+
+
+ );
+
+ cy.get("ui5-input")
+ .as("input");
+
+ cy.get("ui5-input")
+ .shadow()
+ .find("input")
+ .as("innerInput");
+
+ cy.get("@input").then($input => { $input[0].addEventListener("ui5-selection-change", cy.stub().as("inputSelectionChange")); });
+
+ cy.get("@innerInput")
+ .realClick();
+
+ cy.get("[ui5-suggestion-item")
+ .eq(0)
+ .as("suggestion-item");
+
+ cy.get("@innerInput")
+ .type("C");
+
+ cy.get("@suggestion-item")
+ .realClick();
+
+ cy.get("@inputSelectionChange").should("have.been.calledOnce");
+
+ cy.get("@innerInput")
+ .should("have.value", "Cozy");
+
+ cy.get("@innerInput")
+ .realClick();
+ cy.get("@innerInput")
+ .clear();
+
+ cy.get("@inputSelectionChange").should("have.been.calledTwice");
+
+ cy.get("@innerInput")
+ .type("C");
+ cy.get("@suggestion-item")
+ .realClick();
+
+ cy.get("@inputSelectionChange").should("have.been.calledThrice");
+
+ cy.get("@innerInput")
+ .should("have.value", "Cozy");
+ });
});
describe("Change event behavior when selecting the same suggestion item", () => {
@@ -684,15 +739,15 @@ describe("Change event behavior when selecting the same suggestion item", () =>
beforeEach(() => {
cy.mount(
-
+
-
+
- );
+ );
cy.get("#myInput")
.as("input");
diff --git a/packages/main/src/Input.ts b/packages/main/src/Input.ts
index 5f3d6abafa12..879b6cba48bf 100644
--- a/packages/main/src/Input.ts
+++ b/packages/main/src/Input.ts
@@ -1534,6 +1534,7 @@ class Input extends UI5Element implements SuggestionComponent, IFormInputElement
fireResetSelectionChange() {
if (this._isLatestValueFromSuggestions) {
this.fireSelectionChange(null, false);
+ this.valueBeforeItemSelection = this.value;
}
}