Button: Button does not have a role
The name, role, value, states, and properties of user interface components MUST be programmatically determinable by assistive technologies.
Every user interface control must have a role to convey what type of control it is for screen reader and other assistive technology users. Native HTML elements - such as <button>, <a>, <input>, <select> - already have a role, so nothing more needs to be done. If you create a custom version of a native HTML element or a custom control or widget that does not have a native HTML equivalent, you must add the relevant role(s) using ARIA as well as expected keyboard interactions.
Fix this issue by using ONE of the following techniques:
- Use a native HTML <button> element.
- Add role="button" to the custom button container. NOTE: If you use role="button" instead of <button>, you will need to ensure Enter and Spacebar can activate the button.
<span role="button" class="apply-btn" aria-label="Apply Now!"></span>