react-navigation / react-navigation

Routing and navigation for your React Native apps
https://reactnavigation.org
23.3k stars 4.97k forks source link

[Bridgeless] [RN 0.74] Event cannot be both direct and bubbling: topFocus #11928

Open tjzel opened 1 month ago

tjzel commented 1 month ago

Current behavior

Install brand new app with npx react-native@next init NavigationApp --version 0.74.0-rc.6

add all the necessary dependencies.

When running this bit of code:

import {createNativeStackNavigator} from '@react-navigation/native-stack';
import {NavigationContainer} from '@react-navigation/native';

import React from 'react';

function HomeScreen({navigation}) {
  navigation.setOptions({
    headerSearchBarOptions: {},
    headerTransparent: false,
  });

  return null;
}

const Stack = createNativeStackNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name="Home" component={HomeScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

I am getting the error:

Event cannot be both direct and bubbling: topFocus

It's on:

    "@react-navigation/native": "^7.0.0-alpha.18",
    "@react-navigation/native-stack": "^7.0.0-alpha.20",
    "react": "18.2.0",
    "react-native": "0.74.0-rc.6",
    "react-native-safe-area-context": "^4.10.0-rc.1",
    "react-native-screens": "^3.31.0-rc.1"

Expected behavior

No crashes 🤡

Reproduction

no-repro.com

Platform

Packages

Environment

package version
@react-navigation/native 7.0.0-alpha.18
@react-navigation/native-stack 7.0.0-alpha.20
react-native-safe-area-context 4.10.0-rc.1
react-native-screens 3.31.0-rc.1
react-native 0.74.0-rc.6
github-actions[bot] commented 1 month ago

The versions mentioned in the issue for the following packages differ from the latest versions on npm:

Can you verify that the issue still exists after upgrading to the latest versions of these packages?

github-actions[bot] commented 1 month ago

Hey @tjzel! Thanks for opening the issue. It seems that the issue doesn't contain a link to a repro.

The best way to get attention to your issue is to provide an easy way for a developer to reproduce the issue.

You can provide a repro using any of the following:

github-actions[bot] commented 1 month ago

Hey! Thanks for opening the issue. Seems that this issue is related to react-native-screens library which is a dependency of React Navigation. Can you also post your issue in this repo so that it's notified to the maintainers of that library? This will help us fix the issue faster since it's upto the maintainers of that library to investigate it.

kuldipopenxcell commented 1 month ago

I'm getting similar issue in android when i use Marker component of react-native-maps in MapView.

<MapView provider={PROVIDER_GOOGLE} // remove if not using Google Maps style={styles.map} region={{ latitude: 37.78825, longitude: -122.4324, latitudeDelta: 0.015, longitudeDelta: 0.0121, }}> <Marker coordinate={{latitude: 37.78825, longitude: -122.4324}}>

    </Marker>

Find the attached screenshot: Screenshot 2024-04-12 at 2 35 45 PM

github-actions[bot] commented 6 days ago

Hello 👋, this issue has been open for more than a month without a repro or any activity. If the issue is still present in the latest version, please provide a repro or leave a comment within 7 days to keep it open, otherwise it will be closed automatically. If you found a solution or workaround for the issue, please comment here for others to find. If this issue is critical for you, please consider sending a pull request to fix it.