repack icon indicating copy to clipboard operation
repack copied to clipboard

TypeError: Cannot read property 'validated' of undefined when using createStackNavigator with Repack

Open gopbarbosa opened this issue 4 months ago • 4 comments

Describe the bug

When opening a micro app using repack, I get the following error:

Warning: TypeError: Cannot read property 'validated' of undefined

This error only happens when downloading the micro app. When running the same micro app locally with the dev server, everything works fine.

🔎 Notes

The error seems related to createStackNavigator from @react-navigation/stack. However, we have other parent apps using the same Stack.Navigator without any issue.

📋 Code sample that triggers the error

<KeyboardProvider>
  <IntlProvider locale={locale} messages={localeMessages}>
    <Stack.Navigator initialRouteName="Welcome">
      <Stack.Screen
        name="Welcome"
        options={{
          header: (props) => <WelcomeHeader {...props} hasBackButton />
        }}
      />
    </Stack.Navigator>
  </IntlProvider>
</KeyboardProvider>

✅ Code sample that works fine

<KeyboardProvider>
  <IntlProvider locale={locale} messages={localeMessages}>
    <View />
  </IntlProvider>
</KeyboardProvider>

`

📦 Environment

React Navigation: "@react-navigation/bottom-tabs": "6.5.20" "@react-navigation/drawer": "6.6.15 "@react-navigation/native": "6.1.16" "@react-navigation/stack": "6.3.28" Repack: "@callstack/repack": "5.2.0" "@callstack/repack-plugin-expo-modules": "5.2.0" "@callstack/repack-plugin-reanimated": "5.2.0" React Native: "react-native": "0.79.5" "react": "19.0.0",

🤔 Possible cause

It looks like something related to how the micro app bundle is being loaded by repack, since the issue only happens in that scenario and not when running with the dev server.

❓ Question

Is there anything I can do to enable more detailed logs or debugging options so I can better understand why this error is happening and provide clearer information to help fix it?

System Info

System:
  OS: macOS 15.5
  CPU: (10) arm64 Apple M1 Pro
  Memory: 394.94 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.13.1
    path: ~/.nvm/versions/node/v22.13.1/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v22.13.1/bin/yarn
  npm:
    version: 10.9.2
    path: ~/.nvm/versions/node/v22.13.1/bin/npm
  Watchman:
    version: 2025.02.17.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/user/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.5
      - iOS 18.5
      - macOS 15.5
      - tvOS 18.5
      - visionOS 2.5
      - watchOS 11.5
  Android SDK:
    API Levels:
      - "31"
      - "34"
      - "35"
    Build Tools:
      - 30.0.3
      - 31.0.0
      - 34.0.0
      - 35.0.0
      - 36.0.0
    System Images:
      - android-35 | Google Play ARM 64 v8a
      - android-36 | Google APIs Intel x86_64 Atom
    Android NDK: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.23339.11.2421.12550806
  Xcode:
    version: 16.4/16F6
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.13
    path: /usr/bin/javac
  Ruby:
    version: 3.3.6
    path: /Users/user/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react: Not Found
  react-native: Not Found
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Re.Pack Version

5.2.0

Reproduction

.

Steps to reproduce

.

gopbarbosa avatar Sep 04 '25 17:09 gopbarbosa

@gopbarbosa and i recently updated the app to react-native 0.79 and to repack 5.2.0 and started to get this error when testing the micro apps hosted on S3 on android and iOS:

Image

ElielC avatar Sep 04 '25 18:09 ElielC

The error disappears patching node_modules/react/cjs/react.development.js line 490 like this:

-	 newKey._store.validated = oldElement._store.validated;
+	 newKey._store.validated = oldElement._store?.validated ?? 0;

Maybe it`s something similar to a hydration error?

Is the error related to the fact that we are fetching a production micro-app in a development app or are we to expect this also happens on production?

ElielC avatar Sep 04 '25 19:09 ElielC

Version 19.1.0 of react should fix this issue. There is a commit on react enabling non-dev elements in dev Children

Image

ElielC avatar Sep 05 '25 13:09 ElielC

Version 19.1.0 of react should fix this issue. There is a commit on react enabling non-dev elements in dev Children

Image

@gopbarbosa can you check whether React 19.1.0 fixes this issue for you?

If this is not the case, it would be best to show that this is an issue with Re.Pack and not just other library, usually the best way to do that is to showcase that this works properly in Metro and causes an error in Re.Pack setups

jbroma avatar Sep 09 '25 10:09 jbroma