Description
React Native version:
System:
OS: macOS 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
Memory: 376.00 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 12.3.1 - ~/.nvm/versions/node/v12.3.1/bin/node
Yarn: 1.16.0 - /usr/local/bin/yarn
npm: 6.9.0 - ~/.nvm/versions/node/v12.3.1/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
Android SDK:
API Levels: 23, 24, 26, 28
Build Tools: 28.0.2, 28.0.3
System Images: android-23 | Google APIs ARM EABI v7a, android-Q | Android TV Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5522156
Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.6 => 16.8.6
react-native: 0.60.4 => 0.60.4
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-create-library: 3.1.2
Steps To Reproduce
- Create a new app 'out of the box' with React Native CLI.
- Add a TouchableOpacity, or Button element with an OnPress method to log to console.
- Deploy to Android TV (I am using a physical Amazon FireStick device)
- Observe the console log message happens twice.
Describe what you expected to happen:
The OnPress method should only happen once. It should not have a duplicate event on Android TV Devices.
Here is the code for the App I have replaced in the App.js:
function handlePress() {
console.log('TouchableOpacity press');
}
function handleBtnPress() {
console.log('Button press');
}
return (
<Fragment>
<StatusBar barStyle="dark-content" />
<SafeAreaView>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={styles.scrollView}
>
<Header />
{global.HermesInternal == null ? null : (
<View style={styles.engine}>
<Text style={styles.footer}>Engine: Hermes</Text>
</View>
)}
<View style={styles.body}>
<TouchableOpacity activeOpacity={0.4} onPress={handlePress}>
<View>
<Text>Test Regular</Text>
</View>
</TouchableOpacity>
</View>
<Button title="button" onPress={handleBtnPress}>Button</Button>
</ScrollView>
</SafeAreaView>
</Fragment>
);
};```