Illegal node ID set as an input for Animated.DiffClamp node

[emrekaranfil]

Hello, modalize is working on my detail page.

I usually get this error when I leave the page and enter another detail page and open it to modalize.

I also get this error when I constantly open and close modalize.

How do I fix this error.

Dependencies:

• react-native-modalize [^2.0.6]
• react-native [0.63.3]
• react-native-gesture-handler [^1.8.0]
• react-navigation/native [^5.7.5]

[riordanpawley]

https://github.com/facebook/react-native/issues/23620 from what i gather it might be an issue with react native "fast refresh"ing animated components. Have you seen this crash in release builds?

[jeremybarbet]

I've been seeing this on my projects as well. It only happened to me in dev with the fast refreshing

[jagwingchoy]

Hi everyone, I have encountered this error when applying <SafeAreaView /> into the content of <Modalize />, and enabled adjustToContentHeight to true. I have tried disabling the fast refreshing but still cannot solve it. The error won't pop out every time I opened the <Modalize /> (once among 5 - 8 times opening). When the error occurred, the modal component will jitter. I have gone through those examples in this repo but seems there is no handle on the safe area for iOS devices. Any solution for this, or may I know how you handle the safe area for iPhone X or above? Appreciate any shares and helps.

<Portal>
  <Modalize ref={ref} adjustToContentHeight>
    <SafeAreaView>
      <Text style={styles.title}>Hi There!</Text>
    </SafeAreaView>
  </Modalize>
</Portal>

[TomCorvus]

Hi @jagwingchoy,

I had the same problem with the <SafeAreaView /> component. I resolved this on putting <SafeAreaView /> in <Modalize /> FooterComponent prop like this:

<Portal>
  <Modalize ref={ref} adjustToContentHeight FooterComponent={<SafeAreaView />}>
    <View>
      <Text style={styles.title}>Hi There!</Text>
    </View>
  </Modalize>
</Portal>

[marcshilling]

@TomCorvus excellent tip! I too was experience performance issues with a SafeAreaView as a child - lots of jittering and lag, plus this occasional illegal node ID crash. All good after moving into the footer.

[jagwingchoy]

Thanks @TomCorvus for the answer, but I have already used another solution to solve the issue. I am using the package react-native-safe-area-context to get and set the padding bottom of modalize component. This ideas brainstormed from react-navigation.

[likeSo]

I got the same error. I think there are 2 ways to resolve this problem:

• Use react-native-safe-area-context's SafeAreaView
• Remove SafeAreaView, use useSafeAreaInsetsand make paddings manually

For me, i used the second way to solve this

[kuzkokov]

just FYI guys, this method from comment above

• Use react-native-safe-area-context's SafeAreaView

isn't working

[hungvu193]

I got the same error. I think there are 2 ways to resolve this problem:

• Use react-native-safe-area-context's SafeAreaView
• Remove SafeAreaView, use useSafeAreaInsetsand make paddings manually

For me, i used the second way to solve this

this works for me! Seem like problems came from FooterComponent

[emrekaranfil]

.