react-native
react-native copied to clipboard
facebook
Currency unit EURO (€) is spoken only for Google Pixel device and not for Samsung devices in Talkback
Description
Currency unit EURO (represented by the € symbol) is spoken ONLY for Google Pixel device and NOT for Samsung devices
Steps to reproduce
- Install the application with yarn android
- Enable Talkback
- Listen to speech output for prices
React Native Version
0.73.6
Affected Platforms
Runtime - Android
Output of npx react-native info
System:
OS: macOS 14.6.1
CPU: (10) arm64 Apple M1 Pro
Memory: 62.84 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 18.13.0
path: ~/.asdf/installs/nodejs/18.13.0/bin/node
Yarn:
version: 1.22.22
path: ~/.asdf/installs/nodejs/18.13.0/bin/yarn
npm:
version: 8.19.3
path: ~/.asdf/plugins/nodejs/shims/npm
Watchman:
version: 2024.05.06.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.12.1
path: /Users/I583816/.asdf/shims/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 23.5
- iOS 17.5
- macOS 14.5
- tvOS 17.5
- visionOS 1.2
- watchOS 10.5
Android SDK:
API Levels:
- "30"
- "31"
- "32"
- "33"
- "33"
- "34"
Build Tools:
- 29.0.2
- 30.0.3
- 31.0.0
- 32.0.0
- 33.0.0
- 33.0.1
- 33.0.2
- 34.0.0
- 34.0.0
- 34.0.0
System Images:
- android-30 | Google APIs ARM 64 v8a
- android-31 | Google APIs ARM 64 v8a
- android-31 | Google Play ARM 64 v8a
- android-33 | Google APIs ARM 64 v8a
- android-34 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2022.3 AI-223.8836.35.2231.11005911
Xcode:
version: 15.4/15F31d
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.9
path: /Users/I583816/Library/Java/JavaVirtualMachines/corretto-17.0.9/Contents/Home/bin/javac
Ruby:
version: 3.1.1
path: /Users/I583816/.asdf/shims/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.73.6
wanted: 0.73.6
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false
Stacktrace or Logs
N/A
Reproducer
N/A
Screenshots and Videos
No response
| :warning: | Missing Reproducible Example |
|---|---|
| :information_source: | We could not detect a reproducible example in your issue report. Please provide either:
|
| :warning: | Newer Version of React Native is Available! |
|---|---|
| :information_source: | You are on a supported minor version, but it looks like there's a newer patch available - 0.73.9. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases. |
| :warning: | Missing Reproducible Example |
|---|---|
| :information_source: | We could not detect a reproducible example in your issue report. Please provide either:
|
| :warning: | Newer Version of React Native is Available! |
|---|---|
| :information_source: | You are on a supported minor version, but it looks like there's a newer patch available - undefined. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases. |
Also this doens't feel like a React Native issue, but yeah a repro woudl help
This issue is waiting for author's feedback since 24 days. Please provide the requested feedback or this will be closed in 7 days.
This issue is waiting for author's feedback since 24 days. Please provide the requested feedback or this will be closed in 7 days.
Just a small code snippet of the affected area
<View style={styles.priceAndCurrency}> <Text testID={buildTestId('productDetail_footer_price')} style={[textStyles.HeadlineH3Extrabold, styles.fixLineHeight, { color: colors.labelColor }]}> {formattedPrice} </Text> </View>
This is a Samsung issue, not an issue with React Native. I reproduced it on a pure, blank native Android project on a Galaxy S10. €100 is read as "100", while $100 is read as "100 dollars". On a OnePlus 8 it's reading € correctly.
@vinvijdev You might be able to workaround it by passing accessibilityLabel="100 euros" (for example) as a prop to <Text> to override what's being read by Talkback.
But yeah, this issue can be closed as it's not an issue in React Native itself.
Hi @RickardZrinski , if we pass accessibilityLabel="100 euros", it will be a hardcoded approach instead of following a dynamic one based on whatever the server response is, even for different currencies. Do we have any other workaround here?
Hi @RickardZrinski , if we pass
accessibilityLabel="100 euros", it will be a hardcoded approach instead of following a dynamic one based on whatever the server response is, even for different currencies. Do we have any other workaround here?
I didn't mean you'd literally hardcode it. It was just an example. You could get the amount and currency values from the backend and you'd do something akin to
const accessibilityLabel = currency == "€" ? `${amount} euros` : null;
return <Text accessibilityLabel={accessibilityLabel}>...</Text>;
If you don't have amount and currency as separate variables, you'd have to do some string splitting / contains checking on your formattedPrice. That'd be an example of a workaround. It doesn't account for different languages (if you hardcode "euros") though so there's some considerations there. Not saying it's perfect, but don't think a workaround will be implemented in React Native Core as it's an issue in Samsung's text-to-speech engine. Also discussed here: https://issuetracker.google.com/issues/326887755
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
This issue was closed because it has been stalled for 7 days with no activity.