diff --git a/src/courseware/course/sequence/Unit/index.test.jsx b/src/courseware/course/sequence/Unit/index.test.jsx index 0e3a0ff6..e341e90b 100644 --- a/src/courseware/course/sequence/Unit/index.test.jsx +++ b/src/courseware/course/sequence/Unit/index.test.jsx @@ -84,6 +84,19 @@ describe('', () => { expect(nextButton).toBeVisible(); }); + + // Test for accessibility compliance: unit title must be an h1 (heading level 1) as the page's primary heading + // for screen reader and accessibility compliance. + // See: https://edx.readthedocs.io/projects/open-edx-building-and-running-a-course/en/latest/course_components/create_html_component.html#the-visual-editor + // JIRA: https://2u-internal.atlassian.net/browse/AU-2135 + it('renders unit title as h1 heading for accessibility', () => { + renderComponent(defaultProps); + + const unitTitle = screen.getByRole('heading', { level: 1 }); + + expect(unitTitle).toBeInTheDocument(); + expect(unitTitle.tagName).toBe('H1'); + }); }); describe('UnitSuspense', () => { diff --git a/src/plugin-slots/UnitTitleSlot/index.jsx b/src/plugin-slots/UnitTitleSlot/index.jsx index f753efc9..78767ce1 100644 --- a/src/plugin-slots/UnitTitleSlot/index.jsx +++ b/src/plugin-slots/UnitTitleSlot/index.jsx @@ -27,7 +27,10 @@ const UnitTitleSlot = ({ >
-

{unit.title}

+ {/* Unit title must be h1 as the page's primary heading for screen reader and accessibility compliance. + See: https://edx.readthedocs.io/projects/open-edx-building-and-running-a-course/en/latest/course_components/create_html_component.html#the-visual-editor + JIRA: https://2u-internal.atlassian.net/browse/AU-2135 */} +

{unit.title}

{isEnabledOutlineSidebar && renderUnitNavigation(true)}