Repository navigation
Picker.Item with element value crashes (re-opening #17812) #18086
Description
Is this a bug report?
Yes.
Have you read the Contributing Guidelines?
Yes
Environment
Environment:
OS: Windows 10
Node: 6.12.3
Yarn: 1.3.2
npm: 3.10.10
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found
Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.53.3 => 0.53.3
Steps to Reproduce
After react-native init, replace App.js with:
import React, { Component } from 'react';
import { Picker, Text, View } from 'react-native';
export default class App extends Component {
render() {
return (
<View>
<Picker>
<Picker.Item label="foo" value={<Text>Boom</Text>} />
</Picker>
</View>
);
}
}Expected Behavior
I would like to get the element to render from Picker#onValueChange.
Actual Behavior
When testing in android emulator, crashes on startup (i.e. closes and shows "ProjectName has stopped" dialog)
> adb logcat *:S ReactNativeJS
--------- beginning of system
--------- beginning of main
02-25 20:55:25.190 27763 27818 I ReactNativeJS: Running application "ReactNativePickerItemCrash" with appParams: {"rootTag":1}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF
02-25 20:55:25.276 27763 27818 E ReactNativeJS: RangeError: Maximum call stack size exceeded.
02-25 20:55:25.276 27763 27818 E ReactNativeJS:
02-25 20:55:25.276 27763 27818 E ReactNativeJS: This error is located at:
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in AndroidDialogPicker (at PickerAndroid.android.js:107)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in PickerAndroid (at Picker.js:160)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in Picker (at App.js:8)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in View (at App.js:7)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in App (at renderApplication.js:35)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in View (at AppContainer.js:102)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in View (at AppContainer.js:122)
02-25 20:55:25.276 27763 27818 E ReactNativeJS: in AppContainer (at renderApplication.js:34)
02-25 20:55:25.528 27763 27818 E ReactNativeJS: { [Error: C++ exception in 'nativeFlushQueueImmediate'
02-25 20:55:25.528 27763 27818 E ReactNativeJS:
02-25 20:55:25.528 27763 27818 E ReactNativeJS: Malformed calls from JS: field sizes are different.
02-25 20:55:25.528 27763 27818 E ReactNativeJS:
02-25 20:55:25.528 27763 27818 E ReactNativeJS: [[19,29],[2,2],[["RangeError: Maximum call stack size exceeded.\n\nThis error is located at:\n in AndroidDialogPicker (at PickerAndroid.android.js:107)\n in PickerAndroid (at Picker.js:160)\n in Picker (at App.js:8)\n in RCTView (at View.js:71)\n in View (at App.js:7)\n in App (at renderApplication.js:35)\n in RCTView (at View.js:71)\n in View (at AppContainer.js:102)\n in RCTView (at View.js:71)\n in View (at AppContainer.js:122)\n in AppContainer (at renderApplication.js:34)",[[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false"],"http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false",["file"],["isValidArgument"],"isValidArgument",["methodName"],[2251],2251,["lineNumber"],[67],67,["column"],["file","methodName","lineNumber","column"],["http://10.0.
02-25 20:55:25.574 27763 27818 E ReactNativeJS: RangeError: Maximum call stack size exceeded.
02-25 20:55:25.574 27763 27818 E ReactNativeJS:
02-25 20:55:25.574 27763 27818 E ReactNativeJS: This error is located at:
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in AndroidDialogPicker (at PickerAndroid.android.js:107)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in PickerAndroid (at Picker.js:160)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in Picker (at App.js:8)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in View (at App.js:7)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in App (at renderApplication.js:35)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in View (at AppContainer.js:102)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in RCTView (at View.js:71)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in View (at AppContainer.js:122)
02-25 20:55:25.574 27763 27818 E ReactNativeJS: in AppContainer (at renderApplication.js:34)
--------- beginning of crash
Reproducible Demo
From the previous issue, https://snack.expo.io/BJ7CILeUM but Snack behavior is a little different, it complains about missing a render() method, but converted to using a component class, the error shows:
Device: (21:2525) Error: C++ exception in 'nativeFlushQueueImmediate'
Exception creating JSON string: JSON.stringify cannot serialize cyclic structures. (<unknown file>:21)
This error is located at:
in AndroidDialogPicker
in t
in t
in RCTView
in Unknown
in WrappedComponent
in t
in r
in RCTView
in RCTView
in t
Activity
hramos commentedon Mar 13, 2018
According to the source code, Picker.Item's value should be an integer or a string. It has no mention of an element being supported here.
Closing as this appears to be working as intended.
simonbuchan commentedon Mar 13, 2018
Crashing the app is working as intended?
hramos commentedon Mar 13, 2018
I've already pointed out the error in your code. I think that speaks for itself.
simonbuchan commentedon Mar 13, 2018
Are you for real right now? If you threw an exception, sure. If you rendered garbage, sure. If you did literally anything other take down the entire app so hard it can't even send a crash report, sure.
I think the fact that I had to spend like an hour reducing this test case speaks for itself.