@ui5/webcomponents 2.9.0-rc.1 → 2.9.0-rc.3

package/CHANGELOG.md

@@ -3,6 +3,45 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.9.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v2.9.0-rc.2...v2.9.0-rc.3) (2025-04-03)
+
+
+### Bug Fixes
+
+* **framework:** fix fetching "id" (indonesian) language ([#11251](https://github.com/SAP/ui5-webcomponents/issues/11251)) ([9a36df5](https://github.com/SAP/ui5-webcomponents/commit/9a36df5dc2191758abd665d6fb1014d645e322f7)), closes [#11233](https://github.com/SAP/ui5-webcomponents/issues/11233)
+* **ui5-avatar-group:** correct automatic colorScheme ([#11181](https://github.com/SAP/ui5-webcomponents/issues/11181)) ([be8925d](https://github.com/SAP/ui5-webcomponents/commit/be8925de1674aae140d9f81591ce5e50420f7ff7)), closes [#11113](https://github.com/SAP/ui5-webcomponents/issues/11113)
+* **ui5-calendar:** fix month timestamp calculations ([#11226](https://github.com/SAP/ui5-webcomponents/issues/11226)) ([99ce641](https://github.com/SAP/ui5-webcomponents/commit/99ce6417e9bd8f66ddbb1b88c5c42fcd813e0abb)), closes [#11222](https://github.com/SAP/ui5-webcomponents/issues/11222)
+* **ui5-calendar:** remove auto focus of current day on initial render ([#11213](https://github.com/SAP/ui5-webcomponents/issues/11213)) ([e57ab28](https://github.com/SAP/ui5-webcomponents/commit/e57ab2884890220b1179cde77d4dcf76f630cfbc)), closes [#10728](https://github.com/SAP/ui5-webcomponents/issues/10728)
+* **ui5-date-picker:** display value state message in the value help ([#10919](https://github.com/SAP/ui5-webcomponents/issues/10919)) ([87eaa35](https://github.com/SAP/ui5-webcomponents/commit/87eaa359d2a643868f0e4a6f399376601ea32e94))
+* **ui5-input:** change event firing after clear icon click ([#11147](https://github.com/SAP/ui5-webcomponents/issues/11147)) ([a02d941](https://github.com/SAP/ui5-webcomponents/commit/a02d941d4a97b1810d6bbb88ee74a29acd2e781d))
+* **ui5-select:** add listbox role to meet ARIA parent-child requirements ([#11156](https://github.com/SAP/ui5-webcomponents/issues/11156)) ([dcb4edc](https://github.com/SAP/ui5-webcomponents/commit/dcb4edcf972376f343046dd651e3cd82a78307ed)), closes [#11151](https://github.com/SAP/ui5-webcomponents/issues/11151) [#11152](https://github.com/SAP/ui5-webcomponents/issues/11152)
+
+
+### Features
+
+* **ui5-select:** enhance `value` property ([#10904](https://github.com/SAP/ui5-webcomponents/issues/10904)) ([23707c5](https://github.com/SAP/ui5-webcomponents/commit/23707c57dee10e6d206b1ac04f5907f775dc20d7))
+
+
+
+
+
+# [2.9.0-rc.2](https://github.com/SAP/ui5-webcomponents/compare/v2.9.0-rc.1...v2.9.0-rc.2) (2025-03-27)
+
+
+### Bug Fixes
+
+* **framework:** .d.ts errors that require skipLibCheck ([#11189](https://github.com/SAP/ui5-webcomponents/issues/11189)) ([92f0e68](https://github.com/SAP/ui5-webcomponents/commit/92f0e68c3b3b71ff27f707621b8b3da2248a2719))
+* **ui5-bar:** remove responsive paddings ([#11105](https://github.com/SAP/ui5-webcomponents/issues/11105)) ([e2024b1](https://github.com/SAP/ui5-webcomponents/commit/e2024b1bb7caaf12452a7e20b863eb569405706f)), closes [#10012](https://github.com/SAP/ui5-webcomponents/issues/10012)
+* **ui5-breadcrumbs:** show all items in popover on mobile ([#11138](https://github.com/SAP/ui5-webcomponents/issues/11138)) ([4d75b7d](https://github.com/SAP/ui5-webcomponents/commit/4d75b7db79ede9beee7611dde03de818ba48ad61)), closes [#9697](https://github.com/SAP/ui5-webcomponents/issues/9697)
+* **ui5-date-*:** make tests stable ([#11191](https://github.com/SAP/ui5-webcomponents/issues/11191)) ([b1d9311](https://github.com/SAP/ui5-webcomponents/commit/b1d931167bf29b600797974b29b788fbc3405b1f)), closes [#11188](https://github.com/SAP/ui5-webcomponents/issues/11188)
+* **ui5-input:** remove additional icon in Edge ([#11114](https://github.com/SAP/ui5-webcomponents/issues/11114)) ([9d2dfb1](https://github.com/SAP/ui5-webcomponents/commit/9d2dfb1293194fce19c99157892ac2db6ceff62f))
+* **ui5-popover:** fix popover flickering ([#10955](https://github.com/SAP/ui5-webcomponents/issues/10955)) ([712aae4](https://github.com/SAP/ui5-webcomponents/commit/712aae458b0a9279646ea079cb734674ae3e7b4f))
+* **ui5-tree:** noDataText is now properly rendered ([#11095](https://github.com/SAP/ui5-webcomponents/issues/11095)) ([e1c152c](https://github.com/SAP/ui5-webcomponents/commit/e1c152cbec16a47dd42e9813c68c0052828d6cdf)), closes [#11073](https://github.com/SAP/ui5-webcomponents/issues/11073)
+
+
+
+
+
 # [2.9.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.9.0-rc.0...v2.9.0-rc.1) (2025-03-20)
 
 

package/cypress/specs/AvatarGroup.cy.tsx

@@ -35,7 +35,7 @@ describe("Overflow", () => {
 	});
 });
 
-describe("Avatars arrangement", () => {
+describe("Avatars", () => {
 	it("checks if no unnecessary margin is applied of only one Avatar is available", () => {
 		cy.mount(<AvatarGroup id="ag2" type="Group">
 			<Avatar id="av1" initials="II"></Avatar>
@@ -48,4 +48,19 @@ describe("Avatars arrangement", () => {
 			.invoke("attr", "style")
 			.should("equal", "");
 	});
+
+
+	it("tests if _color-scheme attribute is automatically set to avatars", () => {
+		const avatarCount = 20;
+		cy.mount(<AvatarGroup id="ag" type="Group">
+			{Array.from({ length: avatarCount }, (_, i) => {
+				return <Avatar initials="II"></Avatar>;
+			})}
+		</AvatarGroup>);
+
+		Array.from({ length: avatarCount }, (_, i) => {
+			const index = (i % 10) + 1;
+			cy.get("ui5-avatar").eq(i).should("have.attr", "_color-scheme", `Accent${index}`);
+		});
+	});
 });

package/cypress/specs/Breadcrumbs.mobile.cy.tsx

@@ -0,0 +1,53 @@
+import Breadcrumbs from "../../src/Breadcrumbs.js";
+import BreadcrumbsItem from "../../src/BreadcrumbsItem.js";
+
+describe("Breadcrumbs mobile behavior", () => {
+    before(() => {
+        cy.ui5SimulateDevice("phone");
+    });
+
+    it("displays all items in the popover on mobile", () => {
+        const breadcrumbItems = [
+            "Products",
+            "Categories",
+            "Laptops",
+            "Gaming Laptops",
+            "XPS Pro"
+        ];
+
+        cy.mount(
+            <Breadcrumbs>
+                {breadcrumbItems.map((item, index) => (
+                    <BreadcrumbsItem key={index} href={`#${item}`}>{item}</BreadcrumbsItem>
+                ))}
+            </Breadcrumbs>
+        );
+
+        // Open the overflow popover by clicking on the dropdown arrow within shadow DOM
+        cy.get("ui5-breadcrumbs")
+            .shadow()
+            .find(".ui5-breadcrumbs-dropdown-arrow-link-wrapper ui5-link")
+            .click();
+
+        // Wait for the popover to be fully open
+        cy.get("ui5-breadcrumbs")
+            .shadow()
+            .find("ui5-responsive-popover")
+            .shadow()
+            .find("ui5-dialog")
+            .should("be.visible");
+
+        // Verify that all items are displayed in the popover
+        cy.get("ui5-breadcrumbs")
+            .shadow()
+            .find("ui5-responsive-popover ui5-list ui5-li")
+            .should("have.length", breadcrumbItems.length);
+
+        // Verify the items are in the correct order (reversed)
+        cy.get("ui5-breadcrumbs")
+            .shadow()
+            .find("ui5-responsive-popover ui5-list ui5-li")
+            .eq(0)
+            .should("contain.text", breadcrumbItems[breadcrumbItems.length - 1]);
+    });
+});

package/cypress/specs/Button.cy.tsx

@@ -41,6 +41,7 @@ describe("Button general interaction", () => {
 			.find(".ui5-button-icon")
 			.should("not.exist", "icon is not present");
 	});
+
 	it("tests button's endIon rendering", () => {
 		cy.mount(<Button>Action Bar Button</Button>);
 
@@ -387,3 +388,11 @@ describe("Accessibility", () => {
 			.should("have.text", "999+");
 	});
 });
+
+ui5AccDescribe("Automated accessibility tests", () => {
+	it("Icon only", () => {
+		cy.mount(<Button icon="message-information"></Button>);
+
+		cy.ui5CheckA11y();
+	})
+});

package/cypress/specs/Calendar.cy.tsx

@@ -7,14 +7,15 @@ import "@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js";
 
 const getDefaultCalendar = (date: Date) => {
 	const calDate = new Date(date);
-	const formattedDate = calDate.toLocaleDateString("default", {
-		year: "numeric",
-		month: "short",
-		day: "numeric",
-	});
 
-	return (<Calendar id="calendar1" timestamp={calDate.valueOf() / 1000}>
-		<CalendarDate value={formattedDate}></CalendarDate>
+	const day = String(calDate.getDate()).padStart(2, "0");
+	const month = String(calDate.getMonth() + 1).padStart(2, "0"); // Months are 0-based
+	const year = calDate.getFullYear();
+
+	const value = `${day}/${month}/${year}`;
+
+	return (<Calendar id="calendar1" timestamp={calDate.valueOf() / 1000} formatPattern="dd/MM/yyyy">
+		<CalendarDate value={value}></CalendarDate>
 	</Calendar>);
 };
 
@@ -38,35 +39,41 @@ describe("Calendar general interaction", () => {
 		cy.mount(getDefaultCalendar(date));
 
 		cy.ui5CalendarGetDay("#calendar1", "974851200")
-			.should("have.focus");
+			.as("selectedDay");
 
-		cy.focused().realPress("Tab");
+		cy.get("@selectedDay")
+			.realClick();
+
+		cy.get("@selectedDay")
+			.should("have.focus")
+			.realPress("Tab");
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
 			.find(".ui5-calheader")
+			.as("calheader");
+		
+		cy.get("@calheader")
 			.find("[data-ui5-cal-header-btn-month]")
-			.should("have.focus");
-
-		cy.focused().realPress("Tab");
+			.as("monthBtn");
+		
+		cy.get("@monthBtn")
+			.should("have.focus")
+			.realPress("Tab");
 
-		cy.get<Calendar>("#calendar1")
-			.shadow()
-			.find(".ui5-calheader")
+		cy.get("@calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.should("have.focus");
-
-		cy.focused().realPress(["Shift", "Tab"]);
-
-		cy.get<Calendar>("#calendar1")
-			.shadow()
-			.find(".ui5-calheader")
-			.find("[data-ui5-cal-header-btn-month]")
-			.should("have.focus");
+			.as("yearBtn");
+		
+		cy.get("@yearBtn")
+			.should("have.focus")
+			.realPress(["Shift", "Tab"]);
 
-		cy.focused().realPress(["Shift", "Tab"]);
+		cy.get("@monthBtn")
+			.should("have.focus")
+			.realPress(["Shift", "Tab"]);
 
-		cy.ui5CalendarGetDay("#calendar1", "974851200")
+		cy.get("@selectedDay")
 			.should("have.focus");
 	});
 
@@ -79,7 +86,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -98,7 +105,7 @@ describe("Calendar general interaction", () => {
 		cy.mount(getDefaultCalendar(date));
 
 		cy.ui5CalendarGetDay("#calendar1", "974851200")
-			.click();
+			.realClick();
 
 		cy.focused().realPress("Tab");
 		cy.focused().realPress("Space");
@@ -125,7 +132,7 @@ describe("Calendar general interaction", () => {
 		cy.mount(getDefaultCalendar(date));
 
 		cy.ui5CalendarGetDay("#calendar1", "974851200")
-			.click();
+			.realClick();
 
 		cy.focused().realPress("Tab");
 		cy.focused().realPress("Tab");
@@ -158,7 +165,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar2")
 			.shadow()
@@ -179,7 +186,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-month]")
-			.click();
+			.realClick();
 
 		cy.ui5CalendarGetMonth("#calendar2", todayTimestamp.toString())
 			.should("have.focus")
@@ -195,7 +202,7 @@ describe("Calendar general interaction", () => {
 			.find("[ui5-daypicker]")
 			.shadow()
 			.find("[tabindex='0']")
-			.click();
+			.realClick();
 
 		cy.focused().realPress("PageUp");
 
@@ -223,7 +230,7 @@ describe("Calendar general interaction", () => {
 			.find("[ui5-daypicker]")
 			.shadow()
 			.find("[tabindex='0']")
-			.click();
+			.realClick();
 
 		cy.focused().realPress(["Shift", "PageUp"]);
 
@@ -251,7 +258,7 @@ describe("Calendar general interaction", () => {
 			.find("[ui5-daypicker]")
 			.shadow()
 			.find("[tabindex='0']")
-			.click();
+			.realClick();
 
 		cy.focused().realPress(["Control", "Shift", "PageUp"]);
 
@@ -279,7 +286,7 @@ describe("Calendar general interaction", () => {
 			.find("[ui5-daypicker]")
 			.shadow()
 			.find("[tabindex='0']")
-			.click();
+			.realClick();
 
 		cy.focused().realPress("F4");
 		cy.focused().realPress("PageUp");
@@ -308,7 +315,7 @@ describe("Calendar general interaction", () => {
 			.find("[ui5-daypicker]")
 			.shadow()
 			.find("[tabindex='0']")
-			.click();
+			.realClick();
 
 		cy.focused().realPress(["Shift", "F4"]);
 		cy.focused().realPress("PageUp");
@@ -340,7 +347,7 @@ describe("Calendar general interaction", () => {
 			cy.ui5CalendarGetDay("#calendar1", _timestamp.toString())
 				.as("date");
 
-			cy.get("@date").click();
+			cy.get("@date").realClick();
 			cy.get("@date").should("have.class", "ui5-dp-item--selected");
 		});
 
@@ -381,10 +388,10 @@ describe("Calendar general interaction", () => {
 		const timestamps = [971740800, 971827200, 971913600];
 
 		cy.ui5CalendarGetDay("#calendar1", timestamps[0].toString())
-			.click();
+			.realClick();
 
 		cy.ui5CalendarGetDay("#calendar1", timestamps[2].toString())
-			.click();
+			.realClick();
 
 		cy.ui5CalendarGetDay("#calendar1", timestamps[0].toString())
 			.should("have.class", "ui5-dp-item--selected");
@@ -423,7 +430,7 @@ describe("Calendar general interaction", () => {
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-next]")
 			.should("not.have.class", "ui5-calheader-arrowbtn-disabled")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -441,13 +448,13 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-next]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-next]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -518,7 +525,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-month]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -544,7 +551,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -569,7 +576,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -588,7 +595,7 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-year]")
-			.click();
+			.realClick();
 
 		cy.get<Calendar>("#calendar1")
 			.shadow()
@@ -619,10 +626,10 @@ describe("Calendar general interaction", () => {
 			.shadow()
 			.find(".ui5-calheader")
 			.find("[data-ui5-cal-header-btn-month]")
-			.click();
+			.realClick();
 
 		cy.ui5CalendarGetMonth("#calendar1", timestamp.toString())
-			.click();
+			.realClick();
 
 		cy.ui5CalendarGetDay("#calendar1", timestamp.toString())
 			.should("have.focus");