Accessibility Actions Not Triggering on FlatList Carousel (iOS and Android)

[LucasSan]

Description

I’m trying to add accessibility to a FlatList carousel in my React Native app by using Accessibility Actions. I’ve added both the actions and the corresponding function to handle them. However, when I test it in the simulator (both Xcode for iOS and Android Studio), nothing happens when I attempt to trigger the actions.

Here’s a snippet of what I’ve done:

export default function App() {
  const onAccessibilityAction = (event: any) => {
    console.log("event: ", event);
  };
  const renderItem = ({ item }) => {
    return (
      <Text>{item.id}</Text>
    );
  };
  const data = () => {
    const result = []
    for (let i = 0; i < 50; i++) {
      result.push({ id: i })
    }
    return result;
  }

  return (
         <FlatList
          horizontal={false}
          focusable={true}
          accessibilityActions={[
            { name: "increment" },
            { name: "decrement" },
          ]}
          onAccessibilityAction={onAccessibilityAction}
          accessibilityRole="adjustable"
          renderItem={renderItem}
          data={data()}
        />
  );
}

Steps to reproduce

iOS

1. open xCode and accessibility inspector (xCode -> Open Developer Tool -> Accessibility Inspector)
2. run your app
3. navigate to the list previously created using the accessibility inspector, and try to perform an action of increment or decrement

React Native Version

0.76.6

Affected Platforms

Runtime - Android, Runtime - iOS

Output of npx react-native info

System:
  OS: macOS 15.2
  CPU: (8) arm64 Apple M1 Pro
  Memory: 2.93 GB / 32.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.14.0
    path: ~/.nvm/versions/node/v20.14.0/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v20.14.0/bin/yarn
  npm:
    version: 10.7.0
    path: ~/.nvm/versions/node/v20.14.0/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.2
      - iOS 18.2
      - macOS 15.2
      - tvOS 18.2
      - visionOS 2.2
      - watchOS 11.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.23339.11.2421.12483815
  Xcode:
    version: 16.2/16C5032a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.12
    path: /usr/bin/javac
  Ruby:
    version: 2.7.5
    path: /Users/lucasgermano/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.1.3
    wanted: ^15.1.3
  react:
    installed: 18.3.1
    wanted: ^18.2.0
  react-native:
    installed: 0.76.6
    wanted: ^0.76.6
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: false

Stacktrace or Logs

-

Reproducer

https://snack.expo.dev/WQaHKjYSd8bTv_BVB_r67

Screenshots and Videos

No response

[lindboe]

I briefly looked into this and I think there's multiple things going on here, here's more details that I found:

1. A component that has accessibility actions must have accessible set to true (some components have this by default, which makes it a little more confusing)
2. Component nesting matters. The example snack with the Flatlist nested in Card doesn't recognize the accessibility actions at all. If you remove Card, things change a little bit, but still don't work:
3. On iOS, the non-nested Flatlist will announce "adjustable" and that you can swipe up or down with one finger to adjust the value. This should work with increment/decrement, but doesn't. You can, however, use the Rotor gesture to navigate to actions, select "increment" or "decrement", and it works (but this is clunky UX).
4. On Android, it does recognize that the role is "slider", but nothing else. No actions are announced as available, and I don't see any in the context menu (L-shaped gesture to open).

[react-native-bot]

This issue is stale because it has been open for 180 days with no activity. It will be closed in 7 days unless you comment on it or remove the "Stale" label.