From e76d000f5f6890def3813b3284dd17cb51060dc1 Mon Sep 17 00:00:00 2001 From: Konstantin Kondov Date: Tue, 11 Nov 2025 11:20:26 +0200 Subject: [PATCH 1/4] fix(ui5-popover): render block layers in the correct order OpenUI5 dialogs' and the WebC dialogs' block layers are rendered in order Fixes: 12444 --- packages/base/src/css/OpenUI5PopupStyles.css | 5 ++ packages/base/src/features/patchPopup.ts | 76 +++++++++++++++-- .../test/pages/DialogAndOpenUI5Dialog.html | 81 +++++++++++++++++-- 3 files changed, 150 insertions(+), 12 deletions(-) diff --git a/packages/base/src/css/OpenUI5PopupStyles.css b/packages/base/src/css/OpenUI5PopupStyles.css index 49dad81fd254..d523159cf4fd 100644 --- a/packages/base/src/css/OpenUI5PopupStyles.css +++ b/packages/base/src/css/OpenUI5PopupStyles.css @@ -2,4 +2,9 @@ border: none; overflow: visible; margin: 0; +} + +.sapUiBLy[popover] { + width: 100%; + height: 100%; } \ No newline at end of file diff --git a/packages/base/src/features/patchPopup.ts b/packages/base/src/features/patchPopup.ts index db07986e49c0..f0d186497556 100644 --- a/packages/base/src/features/patchPopup.ts +++ b/packages/base/src/features/patchPopup.ts @@ -68,16 +68,82 @@ const hasWebComponentPopupAbove = (popup: object) => { return false; }; +const blocks: any[] = []; +const popovers: any[] = []; + const openNativePopover = (domRef: HTMLElement) => { + const block = document.getElementById("sap-ui-blocklayer-popup"); + popovers.push(domRef); + + if (block?.hasAttribute("popover")) { + const newBlock = block?.cloneNode(true); + if (newBlock) { + (newBlock as HTMLElement).setAttribute("id", `sap-ui-blocklayer-popup${blocks.length}`); + const staticArea = document.getElementById("sap-ui-static"); + + staticArea?.appendChild(newBlock); + block?.hidePopover(); + block?.removeAttribute("popover"); + blocks.push(newBlock); + } + + block?.removeAttribute("popover"); + } + + block?.setAttribute("popover", "manual"); + // blocks.push(block); + block?.showPopover(); + domRef.setAttribute("popover", "manual"); domRef.showPopover(); }; -const closeNativePopover = (domRef: HTMLElement) => { - if (domRef.hasAttribute("popover")) { - domRef.hidePopover(); - domRef.removeAttribute("popover"); +const closeNativePopover = () => { + const allPopupsIndex = AllOpenedPopupsRegistry.openedRegistry.findIndex(element => { + const instance = element.instance as { _sInitialFocusId?: string }; + return instance._sInitialFocusId === popovers[popovers.length - 1].id; + }); + if (AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 1]?.type === "WebComponent") { + popovers.pop(); + if (popovers.length > 0 && blocks.length > 0) { + popovers[popovers.length - 1].hidePopover(); + blocks[blocks.length - 1].hidePopover(); + document.getElementById("sap-ui-blocklayer-popup")?.hidePopover(); + + (AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 1].instance as HTMLElement).addEventListener("ui5-close", () => { + if ((AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 2]?.type === "OpenUI5")) { + popovers[1].hidePopover(); + const lastBlock = blocks[blocks.length - 1]; + const lastPopover = popovers[popovers.length - 1]; + + arrangeBlocksAndPopovers(lastBlock as HTMLElement, lastPopover as HTMLElement); + } + }); + return; + } + } + + popovers.pop(); + if (popovers.length > 0 && blocks.length > 0) { + const lastBlock = blocks[blocks.length - 1]; + const lastPopover = popovers[popovers.length - 1]; + arrangeBlocksAndPopovers(lastBlock as HTMLElement, lastPopover as HTMLElement); + } + if (popovers.length === 0 && blocks.length > 0) { + blocks[blocks.length - 1]?.hidePopover(); + } +}; + +const arrangeBlocksAndPopovers = (block: HTMLElement, popover: HTMLElement) => { + block?.hidePopover(); + popover.hidePopover(); + block?.showPopover(); + + const ui5block = document.getElementById("sap-ui-blocklayer-popup"); + if (ui5block) { + ui5block.style.visibility = "hidden"; } + popover.showPopover(); }; const isNativePopoverOpen = (root: Document | ShadowRoot = document): boolean => { @@ -132,7 +198,7 @@ const patchClosed = (Popup: OpenUI5Popup) => { const domRef = element instanceof HTMLElement ? element : element?.getDomRef(); _origClosed.apply(this, args); // only then call _close if (domRef) { - closeNativePopover(domRef); // unset the popover attribute and close the native popover, but only if still in DOM + closeNativePopover(); // unset the popover attribute and close the native popover, but only if still in DOM } removeOpenedPopup(this); diff --git a/packages/main/test/pages/DialogAndOpenUI5Dialog.html b/packages/main/test/pages/DialogAndOpenUI5Dialog.html index 8c118a4f8dd8..fd6b251b9aa6 100644 --- a/packages/main/test/pages/DialogAndOpenUI5Dialog.html +++ b/packages/main/test/pages/DialogAndOpenUI5Dialog.html @@ -27,6 +27,7 @@ press: function () { new Dialog("openUI5Dialog", { title: "OpenUI5 Dialog", + draggable: true, content: [ new HTML({ content: @@ -112,7 +113,6 @@ } }).placeAt("dialog1content"); - ShortcutHintsMixin.addConfig(button, { event: "press", position: "0 0", @@ -128,20 +128,31 @@ document.getElementById("popoverButtonNoFocus").addEventListener("click", function (event) { openUI5Popover(event.target); }); + + document.getElementById("someButton2").addEventListener("click", function () { + openUI5Dialog2(); + }); + document.getElementById("someButton3").addEventListener("click", function () { + openUI5Dialog3(); + }); + document.getElementById("someButton4").addEventListener("click", function () { + document.getElementById("newDialog4").open = true; + }); } function openUI5Dialog() { sap.ui.require(["sap/m/Button", "sap/m/Dialog"], (Button, Dialog) => { new Dialog("openUI5DialogWithButtons", { - title: "OpenUI5 Dialog", + title: "UI5 Dialog 1", + draggable: true, content: [ new Button({ text: "Focus stop" }), new Button("openUI5DialogButton", { - text: "Open WebC Dialog", + text: "Open UI5 Dialog 2", press: function () { - document.getElementById("newDialog1").open = true; + openUI5Dialog2(); } }) ], @@ -152,6 +163,52 @@ }); } + function openUI5Dialog2() { + sap.ui.require(["sap/m/Button", "sap/m/Dialog"], (Button, Dialog) => { + new Dialog("openUI5DialogWithButtons2", { + title: "UI5 Dialog 2", + draggable: true, + content: [ + new Button({ + text: "Focus stop" + }), + new Button("openUI5DialogButton2", { + text: "Open WebC Dialog 2", + press: function () { + document.getElementById("newDialog2").open = true; + } + }) + ], + afterClose: function () { + this.destroy(); + } + }).open(); + }); + } + + function openUI5Dialog3() { + sap.ui.require(["sap/m/Button", "sap/m/Dialog"], (Button, Dialog) => { + new Dialog("openUI5DialogWithButtons3", { + title: "UI5 Dialog 3", + draggable: true, + content: [ + new Button({ + text: "Focus stop" + }), + new Button("openUI5DialogButton22", { + text: "Open WebC Dialog 3", + press: function () { + document.getElementById("newDialog3").open = true; + } + }) + ], + afterClose: function () { + this.destroy(); + } + }).open(); + }); + } + function openUI5Popover(opener) { sap.ui.require(["sap/m/Popover", "sap/m/Button"], (Popover, Button) => { new Popover("openUI5PopoverSecond", { @@ -189,7 +246,7 @@
Open WebC Dialog
- +

Web Components: @@ -211,8 +268,18 @@ Open UI5 dialog Open UI5 Popover No Initial Focus - - Some button + + Some button 1 + + + Open UI5 Dialog + + + Some button 3 + + + + Some button 3
Date: Tue, 11 Nov 2025 13:11:36 +0200 Subject: [PATCH 2/4] fix(ui5-popover): render block layers in the correct order Fixes failing test --- packages/base/src/features/patchPopup.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/base/src/features/patchPopup.ts b/packages/base/src/features/patchPopup.ts index f0d186497556..d7f3b6f0d17f 100644 --- a/packages/base/src/features/patchPopup.ts +++ b/packages/base/src/features/patchPopup.ts @@ -143,7 +143,11 @@ const arrangeBlocksAndPopovers = (block: HTMLElement, popover: HTMLElement) => { if (ui5block) { ui5block.style.visibility = "hidden"; } - popover.showPopover(); + if (popover.isConnected) { + popover?.showPopover(); + } else if (popovers.length === 1 && AllOpenedPopupsRegistry.openedRegistry[0]?.type === "WebComponent") { + blocks.forEach(b => { b.hidePopover(); }); + } }; const isNativePopoverOpen = (root: Document | ShadowRoot = document): boolean => { From 598adbba83c530f5ff9228c9a37f8a7a2c5cafb9 Mon Sep 17 00:00:00 2001 From: Teodor Taushanov Date: Tue, 11 Nov 2025 16:09:52 +0200 Subject: [PATCH 3/4] chore: handle opening and closing --- packages/base/src/features/patchPopup.ts | 93 +++++++----------------- 1 file changed, 25 insertions(+), 68 deletions(-) diff --git a/packages/base/src/features/patchPopup.ts b/packages/base/src/features/patchPopup.ts index d7f3b6f0d17f..53171228e1f6 100644 --- a/packages/base/src/features/patchPopup.ts +++ b/packages/base/src/features/patchPopup.ts @@ -37,6 +37,19 @@ const addOpenedPopup = (popupInfo: PopupInfo) => { }; const removeOpenedPopup = (popup: object) => { + if (isNativePopoverOpen()) { + const prevPopup = AllOpenedPopupsRegistry.openedRegistry[AllOpenedPopupsRegistry.openedRegistry.length - 2]; + if (prevPopup && prevPopup.type === "OpenUI5") { + const content = (prevPopup.instance as any).getContent().getDomRef() as HTMLElement; + const block = document.getElementById("sap-ui-blocklayer-popup"); + + content.hidePopover(); + + block?.showPopover(); + content.showPopover(); + } + } + const index = AllOpenedPopupsRegistry.openedRegistry.findIndex(el => el.instance === popup); if (index > -1) { AllOpenedPopupsRegistry.openedRegistry.splice(index, 1); @@ -68,85 +81,29 @@ const hasWebComponentPopupAbove = (popup: object) => { return false; }; -const blocks: any[] = []; -const popovers: any[] = []; - const openNativePopover = (domRef: HTMLElement) => { const block = document.getElementById("sap-ui-blocklayer-popup"); - popovers.push(domRef); - - if (block?.hasAttribute("popover")) { - const newBlock = block?.cloneNode(true); - if (newBlock) { - (newBlock as HTMLElement).setAttribute("id", `sap-ui-blocklayer-popup${blocks.length}`); - const staticArea = document.getElementById("sap-ui-static"); - - staticArea?.appendChild(newBlock); - block?.hidePopover(); - block?.removeAttribute("popover"); - blocks.push(newBlock); - } - - block?.removeAttribute("popover"); - } block?.setAttribute("popover", "manual"); - // blocks.push(block); + block?.hidePopover(); block?.showPopover(); domRef.setAttribute("popover", "manual"); domRef.showPopover(); }; -const closeNativePopover = () => { - const allPopupsIndex = AllOpenedPopupsRegistry.openedRegistry.findIndex(element => { - const instance = element.instance as { _sInitialFocusId?: string }; - return instance._sInitialFocusId === popovers[popovers.length - 1].id; - }); - if (AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 1]?.type === "WebComponent") { - popovers.pop(); - if (popovers.length > 0 && blocks.length > 0) { - popovers[popovers.length - 1].hidePopover(); - blocks[blocks.length - 1].hidePopover(); - document.getElementById("sap-ui-blocklayer-popup")?.hidePopover(); - - (AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 1].instance as HTMLElement).addEventListener("ui5-close", () => { - if ((AllOpenedPopupsRegistry.openedRegistry[allPopupsIndex - 2]?.type === "OpenUI5")) { - popovers[1].hidePopover(); - const lastBlock = blocks[blocks.length - 1]; - const lastPopover = popovers[popovers.length - 1]; - - arrangeBlocksAndPopovers(lastBlock as HTMLElement, lastPopover as HTMLElement); - } - }); - return; - } - } - - popovers.pop(); - if (popovers.length > 0 && blocks.length > 0) { - const lastBlock = blocks[blocks.length - 1]; - const lastPopover = popovers[popovers.length - 1]; - arrangeBlocksAndPopovers(lastBlock as HTMLElement, lastPopover as HTMLElement); - } - if (popovers.length === 0 && blocks.length > 0) { - blocks[blocks.length - 1]?.hidePopover(); +const closeNativePopover = (domRef: HTMLElement) => { + if (domRef.hasAttribute("popover")) { + domRef.hidePopover(); + domRef.removeAttribute("popover"); } -}; -const arrangeBlocksAndPopovers = (block: HTMLElement, popover: HTMLElement) => { - block?.hidePopover(); - popover.hidePopover(); - block?.showPopover(); - - const ui5block = document.getElementById("sap-ui-blocklayer-popup"); - if (ui5block) { - ui5block.style.visibility = "hidden"; - } - if (popover.isConnected) { - popover?.showPopover(); - } else if (popovers.length === 1 && AllOpenedPopupsRegistry.openedRegistry[0]?.type === "WebComponent") { - blocks.forEach(b => { b.hidePopover(); }); + const lastPopup = AllOpenedPopupsRegistry.openedRegistry[AllOpenedPopupsRegistry.openedRegistry.length - 1]; + if (lastPopup.type === "OpenUI5") { + const block = document.getElementById("sap-ui-blocklayer-popup"); + if (block && block.hasAttribute("popover")) { + block.hidePopover(); + } } }; @@ -202,7 +159,7 @@ const patchClosed = (Popup: OpenUI5Popup) => { const domRef = element instanceof HTMLElement ? element : element?.getDomRef(); _origClosed.apply(this, args); // only then call _close if (domRef) { - closeNativePopover(); // unset the popover attribute and close the native popover, but only if still in DOM + closeNativePopover(domRef); // unset the popover attribute and close the native popover, but only if still in DOM } removeOpenedPopup(this); From f7fd078d2bf5b4793216fefd45c0ca26fc4fdbbe Mon Sep 17 00:00:00 2001 From: Konstantin Kondov Date: Wed, 19 Nov 2025 15:19:32 +0200 Subject: [PATCH 4/4] fix(ui5-popover): render block layers in the correct order Updates samples and tests --- packages/base/src/features/patchPopup.ts | 27 ++-- .../cypress/specs/OpenUI5andWebCPopups.cy.tsx | 118 ++++++++++++++++++ .../test/pages/DialogAndOpenUI5Dialog.html | 56 +++++++-- 3 files changed, 179 insertions(+), 22 deletions(-) diff --git a/packages/base/src/features/patchPopup.ts b/packages/base/src/features/patchPopup.ts index 53171228e1f6..5bc6a8d01852 100644 --- a/packages/base/src/features/patchPopup.ts +++ b/packages/base/src/features/patchPopup.ts @@ -14,6 +14,7 @@ type OpenUI5Popup = { getOpenState: () => "CLOSED" | "CLOSING" | "OPEN" | "OPENING", getContent: () => Control | HTMLElement | null, // this is the OpenUI5 Element/Control instance that opens the Popup (usually sap.m.Popover/sap.m.Dialog) onFocusEvent: (...args: any[]) => void, + getModal: () => boolean } }; @@ -39,14 +40,17 @@ const addOpenedPopup = (popupInfo: PopupInfo) => { const removeOpenedPopup = (popup: object) => { if (isNativePopoverOpen()) { const prevPopup = AllOpenedPopupsRegistry.openedRegistry[AllOpenedPopupsRegistry.openedRegistry.length - 2]; - if (prevPopup && prevPopup.type === "OpenUI5") { - const content = (prevPopup.instance as any).getContent().getDomRef() as HTMLElement; + if (prevPopup && prevPopup.type === "OpenUI5" && (prevPopup.instance as any).getModal()) { + const content = (prevPopup.instance as any).getContent()?.getDomRef() as HTMLElement; const block = document.getElementById("sap-ui-blocklayer-popup"); - content.hidePopover(); + content?.hidePopover(); - block?.showPopover(); - content.showPopover(); + if ((prevPopup.instance as any).getModal()) { + block?.showPopover(); + } + + content?.showPopover(); } } @@ -81,13 +85,14 @@ const hasWebComponentPopupAbove = (popup: object) => { return false; }; -const openNativePopover = (domRef: HTMLElement) => { +const openNativePopover = (domRef: HTMLElement, popup: object) => { const block = document.getElementById("sap-ui-blocklayer-popup"); - block?.setAttribute("popover", "manual"); - block?.hidePopover(); - block?.showPopover(); - + if ((popup as any).getModal() && block) { + block?.setAttribute("popover", "manual"); + block?.hidePopover(); + block?.showPopover(); + } domRef.setAttribute("popover", "manual"); domRef.showPopover(); }; @@ -140,7 +145,7 @@ const patchOpen = (Popup: OpenUI5Popup) => { if (element) { const domRef = element instanceof HTMLElement ? element : element?.getDomRef(); if (domRef) { - openNativePopover(domRef); + openNativePopover(domRef, this); } } } diff --git a/packages/main/cypress/specs/OpenUI5andWebCPopups.cy.tsx b/packages/main/cypress/specs/OpenUI5andWebCPopups.cy.tsx index f11c71d574f2..fb5355493235 100644 --- a/packages/main/cypress/specs/OpenUI5andWebCPopups.cy.tsx +++ b/packages/main/cypress/specs/OpenUI5andWebCPopups.cy.tsx @@ -17,6 +17,7 @@ function onOpenUI5InitMethod(win) { press: function () { new Dialog("openUI5Dialog1", { title: "OpenUI5 Dialog", + draggable: true, content: [ new HTML({ content: @@ -49,6 +50,12 @@ function onOpenUI5InitMethod(win) { press: function () { (document.getElementById("respPopoverNoInitialFocus") as any).open = true; } + }), + new Button("openWebCDialog", { + text: "Open WebC Dialog", + press: function () { + (document.getElementById("webCDialog1") as any).open = true; + } }) ], afterClose: function () { @@ -112,6 +119,10 @@ function onOpenUI5InitMethod(win) { openUI5Dialog(win); }); + document.getElementById("openUI5DialogFromWebC").addEventListener("click", function () { + openUI5Dialog(win); + }); + document.getElementById("popoverButtonNoFocus").addEventListener("click", function (event) { openUI5Popover(win, event.target); }); @@ -121,6 +132,7 @@ function openUI5Dialog(win) { (win as any).sap.ui.require(["sap/m/Button", "sap/m/Dialog"], (Button, Dialog) => { new Dialog("openUI5DialogWithButtons", { title: "OpenUI5 Dialog", + draggable: true, content: [ new Button({ text: "Focus stop" @@ -130,6 +142,29 @@ function openUI5Dialog(win) { press: function () { (document.getElementById("newDialog1") as any).open = true; } + }), + new Button("openUI5DialogFromUi5", { + text: "Open UI5 Dialog", + press: function () { + openUI5DialogFromUi5(win) + } + }) + ], + afterClose: function () { + this.destroy(); + } + }).open(); + }); +} + +function openUI5DialogFromUi5(win) { + (win as any).sap.ui.require(["sap/m/Button", "sap/m/Dialog"], (Button, Dialog) => { + new Dialog("openUI5DialogFinal", { + title: "OpenUI5 Dialog", + draggable: true, + content: [ + new Button({ + text: "Focus stop" }) ], afterClose: function () { @@ -204,6 +239,9 @@ describe("ui5 and web components integration", () => { + + +
{ .should('be.focused'); } + function OpenWebCUI5DialogMixed() { + // Open UI5 Dialog + cy.get("#openUI5Button") + .should('be.visible') + .realClick(); + + cy.get("#openUI5Dialog1") + .should('be.visible'); + + // Open WebC Dialog from UI5 Dialog + cy.get("#openWebCDialog") + .should('be.visible') + .realClick(); + + cy.get("#webCDialog1") + .should('be.visible'); + + cy.get("#openUI5Dialog1") + .should('not.be.visible'); + + // Open UI5 Dialog from WebC Dialog + cy.get("#openUI5DialogFromWebC") + .should('be.visible') + .realClick(); + + cy.get("#webCDialog1") + .should('not.be.visible'); + + cy.get("#openUI5Dialog1") + .should('not.be.visible'); + + cy.get("#openUI5DialogWithButtons") + .should('be.visible'); + + // Open UI5 Dialog from UI5 Dialog + cy.get("#openUI5DialogFromUi5") + .should('be.visible') + .realClick(); + + cy.get("#openUI5DialogFinal") + .should('be.visible'); + + cy.get("#openUI5Dialog1") + .should('not.be.visible'); + + cy.get("#webCDialog1") + .should('not.be.visible'); + + cy.get("#openUI5DialogWithButtons") + .should('not.be.visible'); + + // Close all with Escape + cy.realPress("Escape"); + + cy.get("#openUI5DialogFinal") + .should('not.exist'); + + cy.get("#openUI5DialogWithButtons") + .should('be.visible'); + + cy.realPress("Escape"); + + cy.get("#openUI5DialogWithButtons") + .should('not.exist'); + + cy.get("#webCDialog1") + .should('be.visible'); + + cy.realPress("Escape"); + + cy.get("#openUI5Dialog1") + .should('be.visible'); + + cy.realPress("Escape"); + + cy.get("#openWebCDialog") + .should('not.exist'); + } + it("Keyboard", () => { OpenWebCDialog(); OpenWebCDialogOpenOpenUI5Dialog(); @@ -617,6 +734,7 @@ describe("ui5 and web components integration", () => { OpenUI5DialogWebCDialog(); OpenUI5DialogWebCPopoverNoFocus(); OpenUI5DialogWebCSelect(); + OpenWebCUI5DialogMixed(); // Merge it after OpenUI5 Popup shadow dom focus fix is released // OpenUI5DialogWebCComboBox(); }); diff --git a/packages/main/test/pages/DialogAndOpenUI5Dialog.html b/packages/main/test/pages/DialogAndOpenUI5Dialog.html index fd6b251b9aa6..58fb5629124f 100644 --- a/packages/main/test/pages/DialogAndOpenUI5Dialog.html +++ b/packages/main/test/pages/DialogAndOpenUI5Dialog.html @@ -63,6 +63,12 @@ press: function () { document.getElementById("respPopoverNoInitialFocus").open = true; } + }), + new Button("openUI5DialogOpener", { + text: "Open UI5 Dialog", + press: function () { + openUI5Dialog2(); + } }) ], afterClose: function () { @@ -138,6 +144,9 @@ document.getElementById("someButton4").addEventListener("click", function () { document.getElementById("newDialog4").open = true; }); + document.getElementById("openUi5PopoverBlockLayer").addEventListener("click", function () { + openUI5Popover(this); + }); } function openUI5Dialog() { @@ -212,17 +221,41 @@ function openUI5Popover(opener) { sap.ui.require(["sap/m/Popover", "sap/m/Button"], (Popover, Button) => { new Popover("openUI5PopoverSecond", { - title: "OpenUI5 Popover", + title: "OpenUI5 Popover 1", content: [ - new Button("someButton", { + new Button({ + text: "Open ui5 Dialog", + press: function () { + openUI5Dialog3(); + } + }), + new Button({ + text: "Open WebC Dialog", + press: function () { + document.getElementById("newDialog4").open = true; + } + }), + new Button("popoverOpener", { text: "Open new OpenUI5 Popover", press: function (oEvent) { - new Popover({ + new Popover("openUI5PopoverThird", { title: "New OpenUI5 Popover", placement: "Bottom", content: [ new Button({ text: "Focus stop" + }), + new Button({ + text: "Open Ui5 Dialog", + press: function () { + openUI5Dialog3(); + } + }), + new Button({ + text: "Open WebC Dialog", + press: function () { + document.getElementById("newDialog4").open = true; + } }) ], initialFocus: "someButton", @@ -246,7 +279,7 @@
Open WebC Dialog
- +

Web Components: @@ -268,29 +301,30 @@ Open UI5 dialog Open UI5 Popover No Initial Focus - + Some button 1 - + Open UI5 Dialog + Open UI5 Popover - - Some button 3 + + Open WebC Dialog - + Some button 3
+ header-text="This is a Web Component Responsive Popover"> Some button + header-text="This is a Web Component RP with no initial focus"> Some button