diff --git a/packages/main/cypress/specs/ComboBox.cy.tsx b/packages/main/cypress/specs/ComboBox.cy.tsx
index 9ed811899860..e92e365fe910 100644
--- a/packages/main/cypress/specs/ComboBox.cy.tsx
+++ b/packages/main/cypress/specs/ComboBox.cy.tsx
@@ -3,6 +3,64 @@ import ComboBoxItem from "../../src/ComboBoxItem.js";
import ComboBoxItemGroup from "../../src/ComboBoxItemGroup.js";
import Link from "../../src/Link.js";
import Input from "../../src/Input.js";
+import Button from "../../src/Button.js";
+
+describe("General Interaction", () => {
+ it("Scrolls the selected item into view after opening the popover", () => {
+ cy.mount(
+ <>
+
+
+
+
+
+
+
+
+
+ >
+ );
+ cy.viewport(500,200);
+
+ cy.get("[ui5-combobox]")
+ .shadow()
+ .find("[ui5-icon]")
+ .as("dropdownIcon");
+
+ cy.get("@dropdownIcon")
+ .realClick();
+
+ cy.get("[ui5-combobox]")
+ .shadow()
+ .find("[ui5-responsive-popover]")
+ .shadow()
+ .find(".ui5-popup-content")
+ .as("scrollContainer");
+
+ cy.get("@scrollContainer")
+ .scrollTo("bottom");
+
+ cy.get("[ui5-cb-item")
+ .eq(4)
+ .realClick();
+
+ cy.get("@dropdownIcon")
+ .realClick();
+
+ cy.get("@scrollContainer")
+ .scrollTo("top");
+
+ cy.get("[ui5-button]")
+ .realClick();
+
+ cy.get("@dropdownIcon")
+ .realClick();
+
+ cy.get("[ui5-cb-item]")
+ .eq(4)
+ .should("be.visible");
+ })
+})
describe("Security", () => {
it("tests setting malicious text to items", () => {
diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts
index efae83073a6b..7ee2a4faf730 100644
--- a/packages/main/src/ComboBox.ts
+++ b/packages/main/src/ComboBox.ts
@@ -578,6 +578,15 @@ class ComboBox extends UI5Element implements IFormInputElement {
this._iconPressed = true;
this.inner.focus();
this.fireDecoratorEvent("open");
+
+ const allItems = this._getItems();
+ const currentItem = allItems.find(item => {
+ return item.selected || item.focused;
+ });
+
+ if (currentItem) {
+ this._scrollToItem(allItems.indexOf(currentItem));
+ }
}
_afterClosePopover() {