From 1def053314599b60c09482700ae7c668df87ba16 Mon Sep 17 00:00:00 2001 From: i518532 Date: Wed, 11 Mar 2026 10:19:56 +0200 Subject: [PATCH 1/2] fix(ui5-multi-input, ui5-combobox): focus input on VH icon press --- packages/main/cypress/specs/ComboBox.cy.tsx | 11 +++++++++ packages/main/cypress/specs/MultiInput.cy.tsx | 24 +++++++++++++++++++ packages/main/src/ComboBox.ts | 6 ++++- packages/main/src/MultiInput.ts | 5 ++-- 4 files changed, 42 insertions(+), 4 deletions(-) diff --git a/packages/main/cypress/specs/ComboBox.cy.tsx b/packages/main/cypress/specs/ComboBox.cy.tsx index 69862539d967..3e8c38a5ec36 100644 --- a/packages/main/cypress/specs/ComboBox.cy.tsx +++ b/packages/main/cypress/specs/ComboBox.cy.tsx @@ -176,6 +176,17 @@ describe("General Interaction", () => { cy.get("[ui5-combobox]").should("have.prop", "focused", true); }); + it("keeps focused state when clicking on the arrow icon", () => { + cy.mount( + + + + ); + + cy.get("[ui5-combobox]").shadow().find("[ui5-icon]").realMouseDown(); + cy.get("[ui5-combobox]").should("have.prop", "focused", true); + }); + it("tests Combo with two-column layout", () => { cy.mount( diff --git a/packages/main/cypress/specs/MultiInput.cy.tsx b/packages/main/cypress/specs/MultiInput.cy.tsx index 960bb7dc5a23..541f7045a3bc 100644 --- a/packages/main/cypress/specs/MultiInput.cy.tsx +++ b/packages/main/cypress/specs/MultiInput.cy.tsx @@ -243,6 +243,30 @@ describe("MultiInput Web Component", () => { cy.get("@valueHelpTrigger") .should("have.been.calledTwice"); }); + + it("keeps focused state when clicking on value help icon", () => { + cy.mount( + + + + ); + + cy.get("[ui5-multi-input]") + .as("multiInput"); + + cy.get("@multiInput") + .shadow() + .find(".ui5-input-inner") + .as("innerInput"); + + cy.get("@multiInput") + .shadow() + .find("[ui5-icon]") + .realMouseDown(); + + cy.get("@multiInput") + .should("have.prop", "focused", true); + }); }) describe("MultiInput tokens", () => { diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts index 44ea07993ce6..21c466e405c0 100644 --- a/packages/main/src/ComboBox.ts +++ b/packages/main/src/ComboBox.ts @@ -740,8 +740,12 @@ class ComboBox extends UI5Element implements IFormInputElement { }); } - _arrowClick() { + _arrowMouseDown(e: MouseEvent) { + e.preventDefault(); this.inner.focus(); + } + + _arrowClick() { this._resetFilter(); if (isPhone() && this.value && !this._lastValue) { diff --git a/packages/main/src/MultiInput.ts b/packages/main/src/MultiInput.ts index 39713e7b7617..a5eb1de6ea16 100644 --- a/packages/main/src/MultiInput.ts +++ b/packages/main/src/MultiInput.ts @@ -32,7 +32,6 @@ import type Token from "./Token.js"; import type Tokenizer from "./Tokenizer.js"; import { getTokensCountText } from "./Tokenizer.js"; import type { TokenizerTokenDeleteEventDetail } from "./Tokenizer.js"; -import type Icon from "./Icon.js"; import type { InputSelectionChangeEventDetail as MultiInputSelectionChangeEventDetail, @@ -215,11 +214,11 @@ class MultiInput extends Input implements IFormInputElement { } valueHelpMouseDown(e: MouseEvent) { - const target = e.target as Icon; + e.preventDefault(); + this.focus(); this.closeValueStatePopover(); this.tokenizer.open = false; this._valueHelpIconPressed = true; - target.focus(); } _tokenizerFocusOut(e: FocusEvent) { From 57b54156810dfe187dc5696505366131fee5fb20 Mon Sep 17 00:00:00 2001 From: i518532 Date: Thu, 12 Mar 2026 09:02:11 +0200 Subject: [PATCH 2/2] fix(ui5-multi-input, ui5-combobox): fix tests --- packages/main/src/ComboBoxTemplate.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/main/src/ComboBoxTemplate.tsx b/packages/main/src/ComboBoxTemplate.tsx index b76f1dbbb8fa..1d75e59481d6 100644 --- a/packages/main/src/ComboBoxTemplate.tsx +++ b/packages/main/src/ComboBoxTemplate.tsx @@ -62,6 +62,7 @@ export default function ComboBoxTemplate(this: ComboBox) { "inputIcon--pressed": this._iconPressed, }} accessibleName={this._iconAccessibleNameText} + onMouseDown={this._arrowMouseDown} onClick={this._arrowClick} /> }