fix(ui5-multi-input, ui5-combobox): focus input on VH icon press

Author: ivoplashkov

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(
+			<ComboBox>
+				<ComboBoxItem text="One" />
+			</ComboBox>
+		);
+
+		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(
 			<ComboBox>

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(
+			<MultiInput showValueHelpIcon={true}>
+				<Token slot="tokens" text="Amet"></Token>
+			</MultiInput>
+		);
+
+		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", () => {

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) {

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) {