Capture Android and iOS accessibility hierarchy using Abra snapshots

Browser DevTools make web accessibility inspection easy. Chrome, Firefox, and Safari all let you inspect the accessibility tree of any website. With mobile apps, we don't have that luxury.

On Android and iOS, inspecting accessibility traditionally required source code or complicated tooling. Auditing third-party apps meant relying on output of assistive technologies such as the screen reader.

We're excited to announce the ability to capture accessibility snapshots in version 2.2.0 of Abra Desktop. Capture any app's accessibility hierarchy with the press of one button. No source code required. Mobile accessibility inspection, finally on par with the web.

Android snapshot

The Android snapshot contains properties such as:

  • Accessibility actions

  • Bounds (x, y, width, height)

  • Class name

  • Content description

  • Focus states

  • Interaction states

  • Resource name

  • and many more!

Snapshot of Android app displaying in Abra Desktop. Left panel shows the screenshot, with the bounds of elements overlayed. Middle panel shows the hierarchy as tree view. Right panel shows properties of the selected element.iOS snapshot

The iOS snapshot contains properties such as:

  • Accessibility identifier

  • Accessibility traits

  • Accessibility label

  • Accessibility value

  • Bounds (x, y, width, height)

  • Element type

  • and many more!

Snapshot of iOS app displaying in Abra Desktop. Left panel shows the screenshot, with the bounds of elements overlayed. Middle panel shows the hierarchy as tree view. Right panel shows properties of the selected element.Using snapshots during accessibility testing

Snapshots let you "look inside" the app you are currently testing. You can view the hierarchy of elements and their accessibility properties. This helps you understand not only what the issue is, but also why it happens.

During accessibility testing it is often important to see how elements are connected to each other. Many accessibility issues occur when multiple elements are grouped as one control. By viewing the structure in the hierarchy, you can understand how these elements relate and identify where things go wrong.

Snapshots make it easier to analyse accessibility issues, draw the right conclusions, and provide clear feedback to developers, all without requiring access to the source code of an app.

Sharing is caring

Snapshots are saved as .abra files. You can simply share these files with your colleagues.

The .abra file type is automatically associated with Abra Desktop. Simply double click the file to open it with Abra Desktop.

Settings.abra file displayed in FinderWant to give it a try? Contact us to get started with Abra Desktop and see how accessibility snapshots can transform your mobile testing workflow.

Next blog