feat(ui5-select): implement accessibilityInfo getter (#12614)

* feat(ui5-select): implement accessibilityInfo getter

* chore: fix lint errors

* chore: make type translatable and add missing disabled property

* chore: remove aria label from description and return it as label property

Author: IlianaB

packages/main/cypress/specs/Select.cy.tsx

@@ -513,6 +513,85 @@ describe("Select - Accessibility", () => {
 			.find(".ui5-select-label-root")
 			.should("contain.text", "SelectedOption – ExtraInfo");
 	});
+
+	it("tests accessibilityInfo getter returns correct values", () => {
+		cy.mount(
+			<>
+				<span id="labelRef">Reference Label</span>
+				{/* Basic select with selected option */}
+				<Select id="basicSelect">
+					<Option value="Option1" selected>Option 1</Option>
+					<Option value="Option2">Option 2</Option>
+				</Select>
+				
+				{/* Select with accessibleName */}
+				<Select id="namedSelect" accessibleName="Select Name">
+					<Option value="Option1" selected>Option 1</Option>
+				</Select>
+				
+				{/* Select with accessibleNameRef */}
+				<Select id="refSelect" accessibleNameRef="labelRef">
+					<Option value="Option1" selected>Option 1</Option>
+				</Select>
+				
+				{/* Select with readonly and required attributes */}
+				<Select id="propsSelect" readonly required disabled>
+					<Option value="Option1" selected>Option 1</Option>
+				</Select>
+			</>
+		);
+
+		// Test basic select
+		cy.get("#basicSelect").then(($select) => {
+			const select = $select[0] as Select;
+			const accessInfo = select.accessibilityInfo;
+			
+			expect(accessInfo.role).to.equal("combobox");
+			expect(accessInfo.type).to.equal("Listbox");
+			expect(accessInfo.readonly).to.be.false;
+			expect(accessInfo.required).to.be.false;
+			expect(accessInfo.description).to.equal("Option 1"); // Just text
+			expect(accessInfo.label).to.be.undefined; // No aria-label
+		});
+
+		// Test select with accessibleName
+		cy.get("#namedSelect").then(($select) => {
+			const select = $select[0] as Select;
+			const accessInfo = select.accessibilityInfo;
+			
+			expect(accessInfo.description).to.equal("Option 1"); // Just text
+			expect(accessInfo.label).to.equal("Select Name"); // Aria label
+		});
+
+		// Test select with accessibleNameRef
+		cy.get("#refSelect").then(($select) => {
+			const select = $select[0] as Select;
+			const accessInfo = select.accessibilityInfo;
+			
+			expect(accessInfo.description).to.equal("Option 1"); // Just text
+			expect(accessInfo.label).to.equal("Reference Label"); // Aria label from ref
+		});
+
+		// Test select with readonly and required properties
+		cy.get("#propsSelect").then(($select) => {
+			const select = $select[0] as Select;
+			const accessInfo = select.accessibilityInfo;
+			
+			expect(accessInfo.readonly).to.be.true;
+			expect(accessInfo.required).to.be.true;
+			expect(accessInfo.disabled).to.be.true;
+		});
+
+		// Update the referenced label and check if the label updates
+		cy.get("#labelRef").invoke("text", "Updated Reference");
+		cy.get("#refSelect").then(($select) => {
+			const select = $select[0] as Select;
+			const accessInfo = select.accessibilityInfo;
+			
+			expect(accessInfo.description).to.equal("Option 1"); // Text remains the same
+			expect(accessInfo.label).to.equal("Updated Reference"); // Updated aria label from ref
+		});
+	});
 });
 
 describe("Select - Popover", () => {
@@ -1740,4 +1819,4 @@ describe("Select general interaction", () => {
 			.should("have.attr", "selected");
 		cy.get("[ui5-select]").should("have.prop", "value", "C");
 	});
-});
+});

packages/main/src/Select.ts

@@ -34,7 +34,7 @@ import "@ui5/webcomponents-icons/dist/information.js";
 import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
-import type { Timeout } from "@ui5/webcomponents-base/dist/types.js";
+import type { Timeout, AriaRole } from "@ui5/webcomponents-base/dist/types.js";
 import InvisibleMessageMode from "@ui5/webcomponents-base/dist/types/InvisibleMessageMode.js";
 import { getScopedVarName } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
 import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js";
@@ -1174,6 +1174,18 @@ class Select extends UI5Element implements IFormInputElement {
 		return ids.length ? ids.join(" ") : undefined;
 	}
 
+	get accessibilityInfo() {
+		return {
+			role: "combobox" as AriaRole,
+			type: this._ariaRoleDescription,
+			description: this.text,
+			label: this.ariaLabelText,
+			readonly: this.readonly,
+			required: this.required,
+			disabled: this.disabled,
+		};
+	}
+
 	_updateAssociatedLabelsTexts() {
 		this._associatedDescriptionRefTexts = getAllAccessibleDescriptionRefTexts(this);
 	}