Skip to content

Accessibility - TalkBack Reads <Text> Styles as Part of Accessible Name #55150

Closed

Description

@Watso196

Description

When Android TalkBack reads a React Native <Text> element, it also announces the styles for the element, even if no non-base styles were declared. For example, <Text>Barcode</Text> reads as "44 pixels dark gray, barcode".

It seems that the style information is inappropriately being added to the accessible name for <Text> elements on Android specifically. I've created a snack as an example, but this is also happening in two apps that my team maintains. The output below is from one of our apps specifically.

Steps to reproduce

  1. Visit this Expo snack: https://snack.expo.dev/@kwatson999/android-accessibility-label-issue-example
  2. Run the snack on an Android device
  3. Turn on Android TalkBack
  4. Use swipe gestures to move TalkBack focus to the text in the snack
  5. TalkBack will announce styles along with the text information, which is undesirable behavior, e.g. "start 52 pixels color black, change your code in the editor..."

React Native Version

0.78.2

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

System:
  OS: macOS 26.1
  CPU: (10) arm64 Apple M1 Pro
  Memory: 151.36 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.20.8
    path: ~/.nvm/versions/node/v18.20.8/bin/node
  Yarn:
    version: 4.5.1
    path: ~/.volta/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v18.20.8/bin/npm
  Watchman:
    version: 2025.03.10.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/kwatson/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 25.0
      - iOS 26.0
      - macOS 26.0
      - tvOS 26.0
      - visionOS 26.0
      - watchOS 26.0
  Android SDK:
    API Levels:
      - "34"
      - "35"
    Build Tools:
      - 35.0.0
      - 35.0.1
      - 36.0.0
    System Images:
      - android-36 | Google Play ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2024.3 AI-243.24978.46.2431.13208083
  Xcode:
    version: 26.0.1/17A400
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.27
    path: /opt/homebrew/bin/javac
  Ruby:
    version: 2.7.5
    path: /Users/kwatson/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.78.2
    wanted: 0.78.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

No crash or failure occurred here that would be logged - all issues are in user experience

MANDATORY Reproducer

https://snack.expo.dev/@kwatson999/android-accessibility-label-issue-example

Screenshots and Videos

example-style-accName.mp4

Activity

  1. react-native-bot commented on Jan 13, 2026

    @react-native-bot
    Collaborator

    Caution

    Too old version: It looks like your issue or the example you provided uses a Too Old Version of React Native.

    Due to the number of issues we receive, we're currently only accepting new issues against one of the supported versions. Please upgrade to latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If you cannot upgrade, please open your issue on StackOverflow to get further community support.

  2. react-native-bot commented on Jan 13, 2026

    @react-native-bot
    Collaborator

    Caution

    Too old version: It looks like your issue or the example you provided uses a Too Old Version of React Native.

    Due to the number of issues we receive, we're currently only accepting new issues against one of the supported versions. Please upgrade to latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If you cannot upgrade, please open your issue on StackOverflow to get further community support.

  3. uloco commented on May 18, 2026

    @uloco
    Contributor

    This issue is still present in the latest react native version

  4. sanjaycpofficial-lab commented on May 21, 2026

    @sanjaycpofficial-lab

    This issue is still present in the latest react native version

    I have posted the solution on latest opened issue of this

  5. mtpetros commented on Sep 23, 2026

    @mtpetros

    I think this may be a feature and not a bug: https://support.google.com/accessibility/android/answer/16800105?hl=en

    Under "Announce text formatting changes":

    To provide more context, TalkBack can now announce changes in text formatting like bold, italics, underline, font size, text color, and background color. Changes in text formatting include a hint that lets you know formatting changes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions