How to Test Flutter Apps Using Accessibility Mode?

Steps to Test Flutter Apps Using Accessibility Mode

1. Right-click anywhere on the Flutter app screen.

2. Select Inspect from the context menu.

3. In the Elements tab, look for a hidden element that looks like this:

4. Click on the hidden element so it becomes selected in the DOM.

5. Open the Console tab in DevTools.

6. Run the following command in the console to activate accessibility mode:

$0.click();

7. Check the Elements tab again. A whole new tree of elements will be added to the DOM. You should now see elements like:

8. Use these aria-label values to locate elements in your automation tests.

9. Start recording your test using your preferred automation tool.

10. Interact with the elements using their aria-label attributes.

NOTE

• Before executing your test, make sure:
  • Accessibility mode is enabled again.
  • You validate elements using aria-label or semantic attributes, not just visible screen text.

11. Run your test. It should now successfully interact with the Flutter UI using accessibility-based locators.

NOTE

• Accessibility mode is not supported on iOS devices when using the Safari browser.

---