fix(ui5-shellbar): image button is now properly read (#12611)

Image button is now properly read by screen readers when there is no effective aria label text.

Author: plamenivanov91

packages/fiori/cypress/specs/ShellBar.cy.tsx

@@ -1396,6 +1396,38 @@ describe("Component Behavior", () => {
 				.find("button")
 				.should("have.attr", "aria-haspopup", NOTIFICATIONS_BTN_ARIA_HASPOPUP);
 		});
+
+		it("tests imageBtnText logical OR fallback - uses default i18n text when no custom text provided", () => {
+			cy.mount(
+				<ShellBar>
+					<img src="https://upload.wikimedia.org/wikipedia/commons/5/59/SAP_2011_logo.svg" slot="profile" />
+				</ShellBar>
+			);
+
+			// When no aria-label is provided, imageBtnText should fallback to SHELLBAR_IMAGE_BTN i18n text
+			cy.get("[ui5-shellbar]").should("have.prop", "imageBtnText", "User Menu");
+		});
+
+		it("tests SHELLBAR_IMAGE_BTN i18n key is properly used as fallback", () => {
+			cy.mount(
+				<ShellBar>
+					<Avatar slot="profile" icon="customer" />
+				</ShellBar>
+			);
+
+			// Verify that the exact i18n text from SHELLBAR_IMAGE_BTN is used
+			cy.get("[ui5-shellbar]").then(($shellbar) => {
+				const imageBtnText = $shellbar.prop("imageBtnText");
+				// This should be exactly "User Menu" from messagebundle.properties SHELLBAR_IMAGE_BTN
+				expect(imageBtnText).to.equal("User Menu");
+			});
+
+			// Verify the profile button actually uses this text in its aria-label
+			cy.get("[ui5-shellbar]")
+				.shadow()
+				.find(".ui5-shellbar-image-button")
+				.should("have.attr", "aria-label", "User Menu");
+		});
 	});
 
 	describe("ui5-shellbar menu", () => {

packages/fiori/src/ShellBar.ts

@@ -72,6 +72,7 @@ import {
 	SHELLBAR_SEARCHFIELD_DESCRIPTION,
 	SHELLBAR_SEARCH_BTN_OPEN,
 	SHELLBAR_PRODUCT_SWITCH_BTN,
+	SHELLBAR_IMAGE_BTN,
 } from "./generated/i18n/i18n-defaults.js";
 
 type ShellBarLogoAccessibilityAttributes = {
@@ -1552,7 +1553,7 @@ class ShellBar extends UI5Element {
 	}
 
 	get imageBtnText() {
-		return getEffectiveAriaLabelText(this);
+		return getEffectiveAriaLabelText(this) || ShellBar.i18nBundle.getText(SHELLBAR_IMAGE_BTN);
 	}
 
 	get _shellbarText() {

packages/fiori/src/i18n/messagebundle.properties

@@ -191,6 +191,9 @@ SHELLBAR_SEARCH = Search
 #XACT: ARIA announcement for the search field
 SHELLBAR_SEARCH_FIELD = Search Field
 
+#XACT: ARIA announcement for the image button
+SHELLBAR_IMAGE_BTN = User Menu
+
 #XACT: ARIA announcement for the search button
 SHELLBAR_SEARCH_BTN_OPEN = Open Search