Broken animation when using navigation.dispatch(CommonActions)

[namachan0219]

Hello!

The problem occurs during the screen transition between the Stack Screens nested in the Bottom Navigator. The bottom navigation animation stops at the screen before the transition. The screen transition has been executed correctly and we are now on a new screen, but the bottom navigation is where it was before the screen transition. The code below illustrates this. After the screen transition, we are at the specified ScreenA, and The bottom navigation remains at routeStack02. If we use goBack() on ScreenA, we will return to routeStack01. I believe that the navigation is executed correctly.

"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "~0.63.4",
"react-native-animated-nav-tab-bar": "^3.1.4",

// bottom Navigation
<Tabs.Navigator>
    <Tabs.Screen
        name="Stack01"
        comonent={Stack01}
    />
    <Tabs.Screen
        name="Stack02"
        comonent={Stack02}
    />
</Tabs.Navigator>   

// Stack01
<Stack.Navigator>
    <Stack.Screen
        name="routeStack01"
        comonent={routeStack01}
    />
    <Stack.Screen
        name="ScreenA"
        comonent={ScreenA}
    />
</Stack.Navigator>

// Stack02
<Stack.Navigator>
    <Stack.Screen
        name="routeStack02"
        comonent={routeStack02}
    />
</Stack.Navigator>  

// navigation in routeStack02
<View>
    <Button onPress={() => {
    navigation.dispatch(
        CommonActions.reset({
            index: 1,
            routes: [
                { name: "Stack01" },
                { name: "ScreenA" }
            ]
        })
    );
    navigation.dispatch(
        CommonActions.navigate({
            name: 'ScreenA'
        })
    );
    }}>CommonActions</Button>
</View>

[github-actions[bot]]

Stale issue message

[hlarrainq]

Hey!

I have this same bug. Do you know any workaround to fix this?