Skip to content

Move component checks to the Native side #324

@ceceppa

Description

@ceceppa

Is there an existing issue for this?

  • I have searched the existing issues

Code of Conduct

  • I agree to follow this project's Code of Conduct

Feature Request

Description

Accessibility checks are now primarily performed on the native side, allowing users to rely directly on our custom components (such as Pressable, Text, etc.) for immediate feedback about common accessibility issues. Additionally, this change ensures broader compatibility, allowing the library to integrate seamlessly with any other React Native UI library.

A new Playground app has also been added, providing users a hands-on environment to explore the library’s capabilities, better understand accessibility issues identified by AMA, and practice fixing them interactively.

Extras

  • Move each extra component in a separate package.
    • BottomSheet
  • Make each separate container independent of the core
    • Use console.error for failed checks, if core is not available

Feedback View

  • Visual feedback of the offending components
  • Allow the user to scroll through the error and warnings
  • Popup informs the user on the issue and how to fix it
A screenshot of AMA Playground testing pressable elements

TODO

  • Add a thick border for the popup using the same color of the severity

Checks

Pressable

  • No a11y label
  • No a11y role
  • Size too small
  • Contrast
  • No "pressed" callback + no disabled?

Text

  • Contrast
  • Long numbers, i.e. Possibile phone number or bank account?

Headers

  • Missing headers: No headers in the current screen

UI Interaction

Check if is possible to hijack pressable events to see if its triggering did cause some UI change. For example some new element appeared or changed...
This could allow AMA to possible detect:

  • Missing aria status on the component
  • Missing focus change

Forms

  • Missing Label
  • Missing label during onChange?
  • Keyboard trap

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions