App crash when going back from nested navigation

[bengy]

Description

We have a setup in our app with Rive and React-Navigation where we navigate from our root stack into one that has a screen with a Rive animation. If we then navigate into another substack and then navigate back two times the app crashes with the following error:

Unhandled SoftException
FATAL EXCEPTION: main
Process: com.rivenesteddoublerelease, PID: 30266
java.lang.IllegalArgumentException: Failed requirement.
	at app.rive.runtime.kotlin.core.NativeObject.release(NativeObject.kt:77)
	at app.rive.runtime.kotlin.core.NativeObject.dispose(NativeObject.kt:102)
	at app.rive.runtime.kotlin.core.NativeObject.release(NativeObject.kt:80)
	at app.rive.runtime.kotlin.core.File.release(File.kt:116)
	at app.rive.runtime.kotlin.controllers.RiveFileController.setFile(RiveFileController.kt:90)
	at app.rive.runtime.kotlin.controllers.RiveFileController.release(RiveFileController.kt:720)
	at app.rive.runtime.kotlin.renderers.Renderer.disposeDependencies(Renderer.kt:225)
	at app.rive.runtime.kotlin.RiveArtboardRenderer.disposeDependencies(RiveArtboardRenderer.kt:341)
	at app.rive.runtime.kotlin.renderers.Renderer.cppDelete(Native Method)
	at app.rive.runtime.kotlin.renderers.Renderer.delete(Renderer.kt:212)
	at app.rive.runtime.kotlin.RiveTextureView.onDetachedFromWindow(RiveTextureView.kt:93)
	at app.rive.runtime.kotlin.RiveAnimationView.onDetachedFromWindow(RiveAnimationView.kt:873)
	at android.view.View.dispatchDetachedFromWindow(View.java:22051)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3979)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.clearDisappearingChildren(ViewGroup.java:7114)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3981)
	at android.view.ViewGroup.dispatchDetachedFromWindow(ViewGroup.java:3979)
	at android.view.ViewGroup.endViewTransition(ViewGroup.java:7225)
	at com.swmansion.rnscreens.ScreenStack.endViewTransition(ScreenStack.kt:53)
	at androidx.fragment.app.DefaultSpecialEffectsController$4$1.run(DefaultSpecialEffectsController.java:258)
	at android.os.Handler.handleCallback(Handler.java:958)
	at android.os.Handler.dispatchMessage(Handler.java:99)
	at android.os.Looper.loopOnce(Looper.java:205)
	at android.os.Looper.loop(Looper.java:294)
	at android.app.ActivityThread.main(ActivityThread.java:8194)
	at java.lang.reflect.Method.invoke(Native Method)
	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552)
	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:971)

Provide a Repro

Minimal Reproduction example
Has some boilerplate from react-native init but the relevant parts is in App.tsx

import React from 'react';
import {Button, SafeAreaView, Text, View} from 'react-native';
import {createNativeStackNavigator} from '@react-navigation/native-stack';
import {NavigationContainer, useNavigation} from '@react-navigation/native';

function OtherScreen(): React.JSX.Element {
  const navigation = useNavigation();
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <Text>Other Nested Stack</Text>
      <Button onPress={() => navigation.goBack()} title="3. Go back" />
    </View>
  );
}

const OtherStack = createNativeStackNavigator();
function OtherNestedSTack(): React.JSX.Element {
  return (
    <OtherStack.Navigator>
      <Stack.Screen name="Other" component={OtherScreen} />
    </OtherStack.Navigator>
  );
}

function HomeScreen(): React.JSX.Element {
  const navigation = useNavigation();
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <Text>Home Screen</Text>
      <Button
        onPress={() => navigation.navigate('RiveNestedStack', {screen: 'Rive'})}
        title="1. Navigate to nested rive"
      />
    </View>
  );
}

function RiveScreen(): React.JSX.Element {
  const navigation = useNavigation();
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <Rive
        url="https://public.rive.app/community/runtime-files/2195-4346-avatar-pack-use-case.riv"
        artboardName="Avatar 1"
        stateMachineName="avatar"
        style={{width: 400, height: 400}}
      />
      <Button
        onPress={() =>
          navigation.navigate('OtherNestedStack', {screen: 'Other'})
        }
        title="2. Navigate to other nested"
      />
      <Button onPress={() => navigation.goBack()} title="5. Go back" />
    </View>
  );
}

const RiveStack = createNativeStackNavigator();
function RiveNestedStack(): React.JSX.Element {
  return (
    <RiveStack.Navigator>
      <Stack.Screen name="Rive" component={RiveScreen} />
    </RiveStack.Navigator>
  );
}

const Stack = createNativeStackNavigator();

function App(): React.JSX.Element {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="RiveNestedStack" component={RiveNestedStack} />
        <Stack.Screen name="OtherNestedStack" component={OtherNestedSTack} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

Source .riv/.rev file

Every rive animation we tested.
Also the public one from the example

Expected behavior

Navigating back from the nested screen works if we do not navigate to another nested screen in between.

Additional context

In our App we use version "6.1.1" but the reproduction example uses "6.2.0"

[bengy]

Compared to simply going back after visiting the first nested navigator (the one with the animation), when navigating to another nested screen in between there is a onDropViewInstance being called:

// This event isn't fired in the simple case but occurs when navigating into the other nested screen first.
release:116, File (app.rive.runtime.kotlin.core)
dispose:46, ControllerState (app.rive.runtime.kotlin.controllers)
dispose:120, RiveReactNativeView (com.rivereactnative)
onDropViewInstance:118, RiveReactNativeViewManager (com.rivereactnative)
onDropViewInstance:9, RiveReactNativeViewManager (com.rivereactnative)
dropView:635, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
dropView:646, NativeViewHierarchyManager (com.facebook.react.uimanager)
manageChildren:499, NativeViewHierarchyManager (com.facebook.react.uimanager)
execute:217, UIViewOperationQueue$ManageChildrenOperation (com.facebook.react.uimanager)
run:926, UIViewOperationQueue$1 (com.facebook.react.uimanager)
flushPendingBatches:1037, UIViewOperationQueue (com.facebook.react.uimanager)
-$$Nest$mflushPendingBatches:-1, UIViewOperationQueue (com.facebook.react.uimanager)
doFrameGuarded:1097, UIViewOperationQueue$DispatchUIFrameCallback (com.facebook.react.uimanager)
doFrame:29, GuardedFrameCallback (com.facebook.react.uimanager)
doFrame:175, ReactChoreographer$ReactChoreographerDispatcher (com.facebook.react.modules.core)
doFrame:85, ChoreographerCompat$FrameCallback$1 (com.facebook.react.modules.core)
run:1341, Choreographer$CallbackRecord (android.view)
run:1352, Choreographer$CallbackRecord (android.view)
doCallbacks:952, Choreographer (android.view)
doFrame:878, Choreographer (android.view)
run:1326, Choreographer$FrameDisplayEventReceiver (android.view)
handleCallback:958, Handler (android.os)
dispatchMessage:99, Handler (android.os)
loopOnce:205, Looper (android.os)
loop:294, Looper (android.os)
main:8194, ActivityThread (android.app)
invoke:-1, Method (java.lang.reflect)
run:552, RuntimeInit$MethodAndArgsCaller (com.android.internal.os)
main:971, ZygoteInit (com.android.internal.os)

// This will try to delete the renderer which free's up the renderers resources resulting in trying to release the already released file
release:116, File (app.rive.runtime.kotlin.core)
lambda 'let' in 'file':90, RiveFileController (app.rive.runtime.kotlin.controllers)
lambda 'synchronized' in 'file':88, RiveFileController (app.rive.runtime.kotlin.controllers)
setFile:86, RiveFileController (app.rive.runtime.kotlin.controllers)
release:720, RiveFileController (app.rive.runtime.kotlin.controllers)
lambda 'forEach' in 'disposeDependencies':225, Renderer (app.rive.runtime.kotlin.renderers)
forEach:1855, Renderer (app.rive.runtime.kotlin.renderers)
disposeDependencies:225, Renderer (app.rive.runtime.kotlin.renderers)
lambda 'synchronized' in 'disposeDependencies':341, RiveArtboardRenderer (app.rive.runtime.kotlin)
disposeDependencies:341, RiveArtboardRenderer (app.rive.runtime.kotlin)
cppDelete:-1, Renderer (app.rive.runtime.kotlin.renderers)
delete:212, Renderer (app.rive.runtime.kotlin.renderers)
onDetachedFromWindow:93, RiveTextureView (app.rive.runtime.kotlin)
onDetachedFromWindow:873, RiveAnimationView (app.rive.runtime.kotlin)
dispatchDetachedFromWindow:22051, View (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
dispatchDetachedFromWindow:3979, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
clearDisappearingChildren:7114, ViewGroup (android.view)
dispatchDetachedFromWindow:3981, ViewGroup (android.view)
dispatchDetachedFromWindow:3979, ViewGroup (android.view)
endViewTransition:7225, ViewGroup (android.view)
endViewTransition:53, ScreenStack (com.swmansion.rnscreens)
run:258, DefaultSpecialEffectsController$4$1 (androidx.fragment.app)
handleCallback:958, Handler (android.os)
dispatchMessage:99, Handler (android.os)
loopOnce:205, Looper (android.os)
loop:294, Looper (android.os)
main:8194, ActivityThread (android.app)
invoke:-1, Method (java.lang.reflect)
run:552, RuntimeInit$MethodAndArgsCaller (com.android.internal.os)
main:971, ZygoteInit (com.android.internal.os)

[AndrewBudziszek]

We're also experiencing this bug. This bug isn't present on iOS builds.

[AndrewBudziszek]

@bengy Do you still experience this if you downgrade rive-android runtime to v8.4.0

[bengy]

@bengy Do you still experience this if you downgrade rive-android runtime to v8.4.0

Yes the issue is still there with the older runtime.

[HayesGordon]

Hi all, appologies for the delay in this issue. This should be resolved in the latest v6.2.1 - please reopen if you encounter any issues.