1.13.0 crashes on iOS - Githubissues

aldebout commented 3 weeks ago

Describe the bug When I navigate to a screen that contains a KeyboardAwareScrollView or KeyboardAvoidingView, the app crashes with typeError: 0, _eventHandler.registerEventHandler is not a function (it is undefined) and it points to this line.

Downgrading to 1.12.7 solves the issue.

Code snippet

<KeyboardAwareScrollView className="flex-1 bg-white p-4">
  <Text className='my-2" mx-3'>{`Email: ${user?.email}`}</Text>
</KeyboardAwareScrollView>

Repo for reproducing Let me know if you need a repro repo, since this a regression for a very recent release I thought I'd open the issue as fast as possible :)

Expected behavior No crash.

Smartphone (please complete the following information):

Desktop OS: MacOS 14.5 (MBP M1 Pro)
Device: Simulator - iPhone SE (3rd gen)
OS: iOS 17.5
RN version: 0.74.5
RN architecture: new
JS engine: Hermes
Library version: 1.13.0

Additional context Fresh install of the library, I couldn't understand what was going on until I saw your release tweet by chance :)

kirillzyusko commented 3 weeks ago

@aldebout which version of react-native-reanimated are you using? 👀

aldebout commented 3 weeks ago

Sorry I should have added it earlier, this is part of my package.json:

    "@gorhom/bottom-sheet": "^4.6.4",
    "@shopify/flash-list": "1.6.4",
    "expo": "^51.0.28",
    "expo-apple-authentication": "~6.4.2",
    "expo-constants": "~16.0.2",
    "expo-crypto": "~13.0.2",
    "expo-dev-client": "~4.0.23",
    "expo-image": "~1.12.13",
    "expo-linking": "~6.3.1",
    "expo-localization": "^15.0.3",
    "expo-router": "~3.5.23",
    "expo-secure-store": "~13.0.2",
    "expo-splash-screen": "~0.27.5",
    "expo-status-bar": "~1.12.1",
    "google-libphonenumber": "^3.2.38",
    "i18next": "^23.12.2",
    "jotai": "^2.9.1",
    "nativewind": "~4.0.36",
    "react": "18.3.1",
    "react-dom": "18.3.1",
    "react-hook-form": "^7.51.4",
    "react-i18next": "^15.0.0",
    "react-native": "~0.74.5",
    "react-native-calendars": "^1.1306.0",
    "react-native-css-interop": "~0.0.36",
    "react-native-floating-action": "^1.22.0",
    "react-native-gesture-handler": "~2.16.2",
    "react-native-google-places-autocomplete": "^2.5.6",
    "react-native-keyboard-controller": "^1.12.7",
    "react-native-mmkv": "^2.12.2",
    "react-native-modal": "^13.0.1",
    "react-native-modal-datetime-picker": "^17.1.0",
    "react-native-phone-number-input": "^2.1.0",
    "react-native-reanimated": "~3.15.0",
    "react-native-restart": "^0.0.27",
    "react-native-safe-area-context": "~4.10.5",
    "react-native-screens": "~3.31.1",
    "react-native-svg": "^15.2.0",
    "react-native-url-polyfill": "^1.3.0",

I upgraded react-native-reanimated when I was investigating the crash, from 3.10 to 3.15, didn't change anything.

mercpls commented 3 weeks ago

Same issue on an Expo app,

"react-native-reanimated": "~3.6.0", // resolves to 3.6.3

kirillzyusko commented 3 weeks ago

I upgraded react-native-reanimated when I was investigating the crash, from 3.10 to 3.15, didn't change anything.

Okay, this is a very interesting! I'm also using reanimated 3.15.0 in example app and I don't have such problem 🤔

Do you think it would be possible to create a reproduction example? Or maybe you can add logger here and print console.log(REACore)?

kirillzyusko commented 3 weeks ago

This is the PR that introduced this regression (just for a reference): https://github.com/kirillzyusko/react-native-keyboard-controller/pull/538

kirillzyusko commented 3 weeks ago

Just created a fresh project using RN 0.74.5 + REA 3.10.0 - it works well:

I added console.log(123, registerEventHandler); in src/internal.ts and console.log("REACore", REACore); in event-handler.js and it prints:

 LOG  REACore {"configureLayoutAnimationBatch": [Function configureLayoutAnimationBatch], "createWorkletRuntime": [Function createWorkletRuntime], "enableLayoutAnimations": [Function enableLayoutAnimations], "executeOnUIRuntimeSync": [Function executeOnUIRuntimeSync], "getViewProp": [Function getViewProp], "initializeSensor": [Function initializeSensor], "isConfigured": [Function isReanimated3], "isReanimated3": [Function isReanimated3], "jsiConfigureProps": [Function jsiConfigureProps], "makeMutable": [Function makeMutable], "makeShareable": [Function makeShareableNative], "makeShareableCloneRecursive": [Function makeShareableCloneRecursive], "registerEventHandler": [Function registerEventHandler], "registerSensor": [Function registerSensor], "runOnJS": [Function runOnJS], "runOnRuntime": [Function runOnRuntime], "runOnUI": [Function runOnUI], "setShouldAnimateExitingForTag": [Function setShouldAnimateExitingForTag], "startMapper": [Function startMapper], "stopMapper": [Function stopMapper], "subscribeForKeyboardEvents": [Function subscribeForKeyboardEvents], "unregisterEventHandler": [Function unregisterEventHandler], "unregisterSensor": [Function unregisterSensor], "unsubscribeFromKeyboardEvents": [Function unsubscribeFromKeyboardEvents]}
 LOG  123 [Function registerEventHandler]

Really curious what's going wrong here 🤔

aldebout commented 3 weeks ago

@kirillzyusko exploring the files to patch, it looks like lib/module/event-handler.js doesn't get built properly, here is the code I get in my node modules:

export {};
//# sourceMappingURL=event-handler.js.map-native-reanimated/src/core");
} catch (e1) {
  try {
    REACore = require("react-native-reanimated/src/reanimated2/core");
  } catch (e2) {
    console.warn("Failed to load REACore from both paths");
  }
}
const registerEventHandler = REACore.registerEventHandler;
const unregisterEventHandler = REACore.unregisterEventHandler;
export { registerEventHandler, unregisterEventHandler };
//# sourceMappingURL=event-handler.js.map

I'm thinking I have an esm setup whereas you have a cjs one? I'll try to repro.

kirillzyusko commented 3 weeks ago

I'm thinking I have an esm setup whereas you have a cjs one? I'll try to repro.

Yeah, probably you are right! The code doesn't seem to be compiled properly (I also noticed that, but i couldn't point out my project to use that file - it was throwing other errors).

It would be super cool if you can prepare a reproduction - it would significantly speed up the process of fix preparation 🚀

aldebout commented 3 weeks ago

https://github.com/aldebout/react-native-keyboard-controller-repro

Super basic repro, I just ran npx create-expo-app and added the lib/components. It crashes really well :)

kirillzyusko commented 3 weeks ago

@aldebout awesome! Thank you very much!

In a meantime I prepared a blind fix https://github.com/kirillzyusko/react-native-keyboard-controller/pull/552 - if you want to try feel free to do that 😊

Basically the problem was in the fact that I had two files with identical name but different extension: event-handler.ts and event-handler.js. And it looks like compiler could randomly overwrite the content of event-handler.js with output from event-handler.ts 🤦‍♂️

Obviously in my case event-handler.ts served as declaration file only and I forgot to add .d extension (it had to be .d.ts).

Anyway - I finished work for today. I will checkout your repo tomorrow and will check if my fix is working - since it involves build process it'll take slightly more time to verify it, but anyway I hope I can find a fix till next Monday 😊

Thank you again for opening this issue and spotting the problem in such early stage! I appreciate it! And thank you for such quick response and so for such fast repro providing! Amazing speed 🚀

kirillzyusko commented 3 weeks ago

@aldebout weird, but when I run your project it works on my machine:

Any ideas what I'm doing wrong? 🙈 I just run npm install + npm run ios 🤷‍♂️

nikitapilgrim commented 3 weeks ago

same problem

corasan commented 3 weeks ago

Started having the same issue after upgrading as well (using expo). I upgrade reanimated to 3.15.0, prebuilt and built the app and still same issue. Not using the new arch btw.

kirillzyusko commented 3 weeks ago

@nikitapilgrim @corasan can you check if #552 fixes the problem for you? You can install it directly from GitHub and try it out in your project 👀

aldebout commented 3 weeks ago

@kirillzyusko honestly no idea why it works on yours, BUT #552 seems to fix it for me :)

kirillzyusko commented 3 weeks ago

@aldebout cool, thank you for testing 😊

Let me then merge this PR and prepare a new release 👍

kirillzyusko commented 3 weeks ago

The fix is published under 1.13.1! Let me know if the issue is still there so that I can re-open this issue!

raphaelweis commented 3 weeks ago

@kirillzyusko After upgrading to 1.13.1, is it resolved for me. I installed the lib this morning, crashed because of this bug, downgraded to 1.12.7, and now a few hours later it's already solved!

Thanks :)

kirillzyusko commented 3 weeks ago

@raphaelweis my pleasure 😊

aldebout commented 3 weeks ago

Also upgraded and it's looking good so far, thanks @kirillzyusko for the super quick reaction!

kirillzyusko commented 3 weeks ago

You are welcome @aldebout

Thank you for your quick responses and help! 😊

kirillzyusko / react-native-keyboard-controller

1.13.0 crashes on iOS #551