diff --git a/packages/main/cypress/specs/Dialog.cy.tsx b/packages/main/cypress/specs/Dialog.cy.tsx
index 60fe02c45f27..184bfd591c82 100644
--- a/packages/main/cypress/specs/Dialog.cy.tsx
+++ b/packages/main/cypress/specs/Dialog.cy.tsx
@@ -280,3 +280,46 @@ describe("Events", () => {
.should("not.be.visible");
});
});
+
+describe("Initially Open", () => {
+ it("initial focus", () => {
+ cy.mount(
+ <>
+
+
+ );
+
+ cy.get("#dialogId")
+ .should("be.visible");
+
+ cy.get("#innerInput")
+ .should("be.focused");
+ });
+
+ it("initial focus prevented", () => {
+ cy.mount(
+ <>
+
+
+ );
+
+ cy.get("#dialogId")
+ .should("be.visible");
+
+ cy.get("#innerInput")
+ .should("not.be.focused");
+ });
+});
diff --git a/packages/main/src/Popup.ts b/packages/main/src/Popup.ts
index 9cfe7d9890bf..7a51296bc820 100644
--- a/packages/main/src/Popup.ts
+++ b/packages/main/src/Popup.ts
@@ -252,6 +252,7 @@ abstract class Popup extends UI5Element {
_focusedElementBeforeOpen?: HTMLElement | null;
_opened = false;
_open = false;
+ isEnteredInDom = false;
constructor() {
super();
@@ -282,6 +283,7 @@ abstract class Popup extends UI5Element {
}
this.tabIndex = -1;
+ this.isEnteredInDom = true;
if (this.open) {
this.showPopover();
@@ -297,6 +299,8 @@ abstract class Popup extends UI5Element {
this._removeOpenedPopup();
}
+ this.isEnteredInDom = false;
+
ResizeHandler.deregister(this, this._resizeHandler);
deregisterUI5Element(this);
}
@@ -327,7 +331,7 @@ abstract class Popup extends UI5Element {
}
async openPopup() {
- if (this._opened) {
+ if (!this.isEnteredInDom || this._opened) {
return;
}
diff --git a/packages/main/test/pages/DialogInitiallyOpenPreventFocus.html b/packages/main/test/pages/DialogInitiallyOpenPreventFocus.html
new file mode 100644
index 000000000000..9302d83a4de7
--- /dev/null
+++ b/packages/main/test/pages/DialogInitiallyOpenPreventFocus.html
@@ -0,0 +1,40 @@
+
+
+
+
+
+
+
+ Dialog
+
+
+
+
+
+
+
+
+
+
+
+
+
+