Accessibility in TypeScript Modern Rich Text Editor
The Modern Rich Text Editor control is designed with accessibility in mind, adhering to WAI-ARIA specifications and implementing ARIA roles, states, and properties. This ensures full accessibility support, making it user-friendly for people who rely on assistive technologies (AT) or keyboard navigation.
The accessibility compliance for the Modern Rich Text Editor control is outlined below.
- All features of the component meet the requirement.
- Some features of the component do not meet the requirement.
- The component does not meet the requirement.ARIA attributes
The toolbar in the Modern Rich Text Editor is assigned the role of ‘Toolbar’ and includes the following attributes.
| Property | Functionalities |
|---|---|
| role=”toolbar” | This attribute added to the ToolBar element describes the actual role of the element. |
| aria-orientation | Indicates the ToolBar orientation. Default value is horizontal. |
| aria-disabled | Indicates the disabled state of the toolbar. |
For more details on Toolbar ARIA attributes, refer to the Accessibility of Toolbar documentation.
- The Modern Rich Text Editor element is assigned the role of
application.
| Property | Functionalities |
|---|---|
| role=”application” | This attribute added to the Modern Rich Text Editor element describes the actual role of the element. |
| aria-disabled | Indicates the disabled state of the ToolBar. |
Keyboard navigation
The Modern Rich Text Editor component follows the keyboard interaction guideline, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation.
For detailed information on supported keyboard shortcuts, refer to the Keyboard support documentation.
Implementing accessibility best practices
The Rich Text Editor component’s accessibility levels are ensured through an accessibility-checker and axe-core software tools during automated testing.