BackHandler and remote debug

[sm2017]

Is this a bug report?

(Yes)

Have you read the Contributing Guidelines?

(Yes)

Environment

1. react-native -v:

react-native-cli: 2.0.1
react-native: 0.47.1

2. node -v:

v8.1.3

3. npm -v:

5.0.3

4. yarn --version:

0.27.5

Then, specify:

• Target Platform: Android

• Development Operating System: Windows10

• Build tools: react-native run-android

Steps to Reproduce

(Write your steps here:)

class App extends Component {
  componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.onBackPress);
  }
  componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.onBackPress);
  }
  onBackPress = () => {
    return true;
  };
  render() {
    return (
      <Text>Press back buton</Text>
    );
  }
}

If you run the code in development environment , it don't works and when you press back button , app will be closed , but in development environment if you turn on remote debug , the code works well and app not closed

Expected Behavior

(Prevent closing app on back button pressed)

Actual Behavior

(On development environment when remote debug is off it don't woks but when remote debug is on it works)

Reproducible Demo

(N/A)

[sm2017]

Any updates??

[Sean-Snow]

+1

[hramos]

Can you reproduce the issue using Snack? This step is necessary for people to be able to see and debug the issue being reported.

[sm2017]

@hramos I explain in details how to reproduce the issue , I cannot reproduce the issue using Snack because there is no dev menu in Snack , so remote debug is meanless

[hramos]

You can run the Snack within the Expo Client and shake the device to trigger a menu to show up, no?

In any case, this is a community project. To answer your "any updates?" question, we'd take a look at any PR that proposes a fix.

[sm2017]

@hramos , I tried before using Expo Client , there is no dev menu , You can try it yourself
exp://expo.io/@snack/SJn2le4cZ

[dantman]

@sm2017 Is there a Symbol polyfill included by your app or any of your dependencies?

If you do, than this could be caused by issue #11968, which I have a PR to fix #15182.

Most desktop browsers support Symbol natively, so that would explain why the issue doesn't show up in dev mode where the browser's JS engine is used instead of the mobile device's (which may not have a native Symbol implementation).

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[vegetarianlife]

Hi, I am having the same trouble with it.
I am trying to implement custom action for back button and I have added the code like the below.
But it's getting an event when I enable "Debug JS Remotely" but it's not getting an event when I disable it. What's up?
I am trying to implement that backbutton functionality and I am having trouble with that.

componentDidMount () {
ToastAndroid.show("Event` Listener added", ToastAndroid.SHORT);
BackHandler.addEventListener('hardwareBackPress', () => this.backAndroid())
}

componentWillUnmount () {
BackHandler.removeEventListener('hardwareBackPress', () => this.backAndroid())
}

backAndroid () {
ToastAndroid.show("Welcome", ToastAndroid.SHORT);
return true
}