diff --git a/packages/main/cypress/specs/CheckBox.cy.tsx b/packages/main/cypress/specs/CheckBox.cy.tsx index 701075f36e2a..8f19a3a7fbb9 100644 --- a/packages/main/cypress/specs/CheckBox.cy.tsx +++ b/packages/main/cypress/specs/CheckBox.cy.tsx @@ -387,4 +387,90 @@ describe("Accessibility", () => { .should("have.attr", "aria-label", labelText); }); }); -}); \ No newline at end of file + + it("should provide correct accessibilityInfo properties", () => { + cy.mount( + <> + + + ); + + cy.get("#accessibilityTestCb").then($checkbox => { + const checkbox = $checkbox[0] as CheckBox; + const accInfo = checkbox.accessibilityInfo; + + // Description should come from accessibleName property + expect(accInfo.description).to.equal("Custom Aria Label"); + + expect(accInfo.readonly).to.be.true; + expect(accInfo.required).to.be.true; + expect(accInfo.disabled).to.be.false; + + expect(accInfo.role).to.equal("checkbox"); + }); + }); + + it("should provide correct accessibilityInfo description from accessibleNameRef", () => { + cy.mount( + <> + + + + ); + + cy.get("#accessibilityTestCb1").then($checkbox => { + const checkbox = $checkbox[0] as CheckBox; + const accInfo = checkbox.accessibilityInfo; + + // Description should come from associated label + expect(accInfo.description).to.equal("Label For Accessibility Test"); + }); + }); + + it("should provide correct accessibilityInfo description from text", () => { + cy.mount( + <> + + + ); + + cy.get("#accessibilityTestCb2").then($checkbox => { + const checkbox = $checkbox[0] as CheckBox; + const accInfo = checkbox.accessibilityInfo; + + // Description should come from text property + expect(accInfo.description).to.equal("Accessibility Test Text"); + }); + }); + + it("should provide correct accessibilityInfo description from associated label", () => { + cy.mount( + <> + + + + ); + + cy.get("#accessibilityTestCb3").then($checkbox => { + const checkbox = $checkbox[0] as CheckBox; + const accInfo = checkbox.accessibilityInfo; + + // Description should come from associated label + expect(accInfo.description).to.equal("Label For Accessibility Test"); + }); + }); +}); diff --git a/packages/main/src/CheckBox.ts b/packages/main/src/CheckBox.ts index cca68ae71efc..3d6809acf1a3 100644 --- a/packages/main/src/CheckBox.ts +++ b/packages/main/src/CheckBox.ts @@ -465,6 +465,16 @@ class CheckBox extends UI5Element implements IFormInputElement { return this.displayOnly && !this.disabled; } + get accessibilityInfo() { + return { + role: this.accInfo.role, + description: this.ariaLabelText || this.text || "", + disabled: !!this.accInfo.ariaDisabled, + readonly: !!this.accInfo.ariaReadonly, + required: this.accInfo.ariaRequired, + }; + } + get accInfo() { return { "role": this._accInfo ? this._accInfo.role : "checkbox" as AriaRole,