Accessibility in Angular MaskedTextBox component
26 Feb 20263 minutes to read
The MaskedTextBox component adheres to accessibility guidelines and standards including ADA, Section 508, WCAG 2.2 standards, and WAI-ARIA roles. The following table outlines the accessibility compliance status of the MaskedTextBox component.
- 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.WAI-ARIA attributes
The MaskedTextBox includes complete ARIA accessibility support, enabling access through screen readers and other assistive technology devices. The component is designed following the WAI-ARIA Accessibility practices guidelines for textbox elements.
The MaskedTextBox uses the textbox role and the following ARIA properties based on component state:
| Property | Functionality |
|---|---|
| aria-live | Indicates the priority of updates to a live region. |
| aria-disabled | Indicates the disabled state of the MaskedTextBox. |
| aria-valuenow | Specifies the current value of the MaskedTextBox. |
| aria-invalid | Indicates that the user input is incorrect or outside acceptable ranges. |
| aria-placeholder | Provides a short hint for data entry when the MaskedTextBox has no value. |
| aria-labelledby | References the floating label element associated with the MaskedTextBox. |
Ensuring accessibility
The MaskedTextBox component’s accessibility is validated using industry-standard tools including accessibility-checker and axe-core during automated testing.
The accessibility compliance of the MaskedTextBox is demonstrated in the following sample. Open the sample in a new window to evaluate the MaskedTextBox’s accessibility with accessibility tools.