@ui5/webcomponents 2.5.2 → 2.5.3

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.5.3](https://github.com/SAP/ui5-webcomponents/compare/v2.5.2...v2.5.3) (2025-03-04)
+
+
+### Bug Fixes
+
+* **ui5-list:** add correct focus style and accessibility roles for no-data item ([#10503](https://github.com/SAP/ui5-webcomponents/issues/10503)) ([3e4f1f3](https://github.com/SAP/ui5-webcomponents/commit/3e4f1f3c9018b29d6af3e5c37ef1382df838e4f0)), closes [#10436](https://github.com/SAP/ui5-webcomponents/issues/10436)
+* **ui5-toast:** implement popover api to ensure toast is top level element ([#10178](https://github.com/SAP/ui5-webcomponents/issues/10178)) ([0af8f03](https://github.com/SAP/ui5-webcomponents/commit/0af8f03f84e44198129c9c1ba9d0ee7226d9c7c9))
+
+
+
+
+
 ## [2.5.2](https://github.com/SAP/ui5-webcomponents/compare/v2.5.1...v2.5.2) (2025-02-10)
 
 **Note:** Version bump only for package @ui5/webcomponents

package/cypress/specs/Toast.cy.ts

@@ -0,0 +1,43 @@
+import { html } from "lit";
+import "../../src/Toast.js";
+import "../../src/Button.js";
+import "../../src/List.js";
+import type Toast from "../../src/Toast.js";
+
+describe("Toast - test popover API", () => {
+	it("Should verify the toast has the popover attribute set to manual", () => {
+		cy.mount(html`
+		<ui5-toast id="toast" open placement="TopStart">TopStart</ui5-toast>`);
+		cy.get<Toast>("[ui5-toast]")
+			.should("have.attr", "popover", "manual")
+			.should("be.visible");
+	});
+
+	it("Toast should stay on top of list after scroll", () => {
+		cy.mount(html`
+		<ui5-toast id="toast" open duration="999999" placement="TopStart">TopStart</ui5-toast>
+		<ui5-list id="list" header-text="List with ListItemStandard" style="opacity: 0.7">
+			<ui5-li additional-text="3">List Item 1</ui5-li>
+			<ui5-li additional-text="2">List Item 2</ui5-li>
+			<ui5-li additional-text="1">List Item 3</ui5-li>
+		</ui5-list>`);
+
+		cy.get<Toast>("[ui5-toast]")
+			.should("have.attr", "popover", "manual")
+			.should("be.visible");
+
+		cy.get("#toast")
+			.then($toast => {
+				const toastRect = $toast[0].getBoundingClientRect();
+				cy.get("#list")
+					.then($list => {
+						const listRect = $list[0].getBoundingClientRect();
+						const isOverlapping = toastRect.right > listRect.left
+							&& toastRect.left < listRect.right
+							&& toastRect.bottom > listRect.top
+							&& toastRect.top < listRect.bottom;
+						expect(isOverlapping).to.be.true;
+					});
+			});
+	});
+});