presentation-role-conflict

Ensure elements with role="none" or role="presentation" are not part of accessibility tree.

Description

Attributes role="none" or role="presentation" should not be used with an element having semantic roles or with other specified global ARIA attributes as then the element is not ignored by the screen readers.

Why is it important?

When utilizing the role="presentation" or role="none" attributes, it is intended for assistive technologies to disregard the default role of an element while keeping its content visible to users. Nonetheless, there are situations where HTML elements may not adhere to the role="none" or role="presentation" instructions. This typically arises when an element possesses inherent behaviors or explicit properties that hold significance for accessibility and clash with the specified presentational roles. Consequently, the roles are overlooked, allowing users to interact with the element as if the specified role was absent.

How to fix?

For every element with role="none" or role="presentation" attribute, ensure that the element cannot be focused and remove any global ARIA attributes.