Environment
Normal RN dev setup on macos
Description
While running bundled miniapps I've encountered a strange error:
Application is crashing with Warning: TypeError: Cannot read property 'validated' of undefined error.
After some investigation and in-depth debugging we've found that error is originating from ScrollView and going even deeper by this bit in bundle:
function cloneAndReplaceKey ( oldElement , newKey ) {
newKey = ReactElement ( oldElement . type , newKey , void 0 , void 0 , oldElement . _owner , oldElement . props ) ;
newKey . _store . validated = oldElement . _store . validated ;
return newKey ;
}
Reproducible Demo
Clone my PR with updated deps: chore: update react-native to 78.1 #140
bundle shopping app: cd packages/shopping && pnpm bundle:ios
host bundle locally only on different port, eg: python3 -m http.server -d build/generated/ios 9008
edit Host app's rspack config so Shopping will be taken from previously selected port:
- shopping: `shopping@http://localhost:9001/mf-manifest.json`,
+ shopping: `shopping@http://localhost:9008/mf-manifest.json`,
launch and install the app (pnpm start and pnpm:host ios in separate terminal window
inside the application navigate to Services tab and then tap on Shopping card
app crash 💥
Ugly temp fix:
To confirm remove react navigation from mini app and replace ScrollView usage with basic View component in main navigator like so:
const MainNavigator = () => {
- return (
- <Main.Navigator
- screenOptions={{
- headerShown: false,
- }}>
- <Main.Screen name="Tabs" component={TabsNavigator} />
- </Main.Navigator>
- );
+ return <HomeScreen />;
};
additionally inside HomeScreen replace ScrollView with normal View
const HomeScreen = () => {
return (
- <ScrollView
+ <View
style={styles.container}
contentInsetAdjustmentBehavior="automatic">
....
Bundle the Shopping mini app and host it locally again, rester Host's app server and app should work as expected.
App crash -> https://github.com/user-attachments/assets/91c16c6d-a6fe-4e41-ba98-da6e9e1f4010
Ugly temp fix -> https://github.com/user-attachments/assets/dc8d9470-4bfd-4207-8e6d-c20dedd7f832
What's interesting is that when bundle is created with --dev true flag all works normally as well
Environment
Normal RN dev setup on macos
Description
While running bundled miniapps I've encountered a strange error:
Application is crashing with
Warning: TypeError: Cannot read property 'validated' of undefinederror.After some investigation and in-depth debugging we've found that error is originating from
ScrollViewand going even deeper by this bit in bundle:Reproducible Demo
shoppingapp:cd packages/shopping && pnpm bundle:iospython3 -m http.server -d build/generated/ios 9008pnpm startandpnpm:host iosin separate terminal windowUgly temp fix:
To confirm remove react navigation from mini app and replace ScrollView usage with basic View component in main navigator like so:
const MainNavigator = () => { - return ( - <Main.Navigator - screenOptions={{ - headerShown: false, - }}> - <Main.Screen name="Tabs" component={TabsNavigator} /> - </Main.Navigator> - ); + return <HomeScreen />; };additionally inside
HomeScreenreplaceScrollViewwith normalViewconst HomeScreen = () => { return ( - <ScrollView + <View style={styles.container} contentInsetAdjustmentBehavior="automatic"> ....Bundle the Shopping mini app and host it locally again, rester Host's app server and app should work as expected.
What's interesting is that when bundle is created with
--dev trueflag all works normally as well