AppState change event not triggered on android when app is reopened after being closed by the hardware back button

[MinaZakaria]

Description

Actual Behavior
AppState Change Event is called as expected when the app is moved to the background with the hardware back button but it is not called when the app is resumed from the background.

AppState Change Event is called as expected when resuming the app after using the Home button so it seems to only be an issue with the hardware back button.

note:
Home button not call componentWillUnmount while Back button call it
So opening app after Home button press not calling componentDidMount while opening app after Back button calls the componentDidMount but not _handleAppStateChange

Version

0.66.3

Output of react-native info

System:
OS: macOS 11.6
CPU: (4) x64 Intel(R) Core(TM) i5-5287U CPU @ 2.90GHz
Memory: 197.88 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.13.0 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/local/bin/yarn
npm: 6.12.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.10.1 - /Users/ivasystem/.rvm/rubies/ruby-2.7.0-preview1/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 15.0, DriverKit 20.4, macOS 11.3, tvOS 15.0, watchOS 8.0
Android SDK:
API Levels: 23, 28, 29, 30
Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2
System Images: android-28 | Intel x86 Atom_64, android-28 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5977832
Xcode: 13.0/13A233 - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_232 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: 0.66.3 => 0.66.3
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

Open app
Close app using the Android hardware back button
Open app again
AppState Change Event is not triggered
Expected Behavior
AppState Change Event should be called when app resumes from the background

Snack, code example, screenshot, or link to a repository

Reproducible Demo

class AppStateTest extends Component {
	constructor(props) {
	  super(props);
	
	  this.state = {
	  	appState: AppState.currentState
	  };
	}

	componentDidMount() {
		this.appStateSubscription = AppState.addEventListener('change', this._handleAppStateChange);
	}
        componentWillUnmount() {
            this.appStateSubscription.remove();
        }

        _handleAppStateChange = (nextAppState) => {
  	    console.log(this.state.appState, nextAppState)
            this.setState({appState: nextAppState})
       };
}

[justinkx]

Description

Actual Behavior AppState Change Event is called as expected when the app is moved to the background with the hardware back button but it is not called when the app is resumed from the background.

AppState Change Event is called as expected when resuming the app after using the Home button so it seems to only be an issue with the hardware back button.

note: Home button not call componentWillUnmount while Back button call it So opening app after Home button press not calling componentDidMount while opening app after Back button calls the componentDidMount but not _handleAppStateChange

Version

0.66.3

Output of react-native info

System: OS: macOS 11.6 CPU: (4) x64 Intel(R) Core(TM) i5-5287U CPU @ 2.90GHz Memory: 197.88 MB / 8.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 12.13.0 - /usr/local/bin/node Yarn: 1.22.4 - /usr/local/bin/yarn npm: 6.12.0 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Managers: CocoaPods: 1.10.1 - /Users/ivasystem/.rvm/rubies/ruby-2.7.0-preview1/bin/pod SDKs: iOS SDK: Platforms: iOS 15.0, DriverKit 20.4, macOS 11.3, tvOS 15.0, watchOS 8.0 Android SDK: API Levels: 23, 28, 29, 30 Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2 System Images: android-28 | Intel x86 Atom_64, android-28 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom Android NDK: Not Found IDEs: Android Studio: 3.5 AI-191.8026.42.35.5977832 Xcode: 13.0/13A233 - /usr/bin/xcodebuild Languages: Java: 1.8.0_232 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 17.0.2 => 17.0.2 react-native: 0.66.3 => 0.66.3 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Steps to reproduce

Open app Close app using the Android hardware back button Open app again AppState Change Event is not triggered Expected Behavior AppState Change Event should be called when app resumes from the background

Snack, code example, screenshot, or link to a repository

Reproducible Demo

class AppStateTest extends Component {
	constructor(props) {
	  super(props);
	
	  this.state = {
	  	appState: AppState.currentState
	  };
	}

	componentDidMount() {
		this.appStateSubscription = AppState.addEventListener('change', this._handleAppStateChange);
	}
        componentWillUnmount() {
            this.appStateSubscription.remove();
        }

        _handleAppStateChange = (nextAppState) => {
  	    console.log(this.state.appState, nextAppState)
            this.setState({appState: nextAppState})
       };
}

+1 same issue

[raulgordejev]

Same issue here

react: 17.0.2
react-native: 0.65.1

Only seems to be working correctly on Android 12. All others get stuck in 'background' state.

[thecookieorg]

Same issue here

[isinha-onefc]

Same issue, not even working on Android 12 if I open the app from a deep link after sending it to background.

"react": "17.0.2",
"react-native": "^0.68.5",

[vincentmegia]

interesting...
"change" event already fires at initial render, observation below

First load

Running "AppStateChangeIssueAndroid" with {"rootTag":191}
LOG AppSTate: {"_emitter": {}, "currentState": "active", "isAvailable": true}
LOG re-attach appState event listener
LOG _handleAppStateChange appState: active

Back button pressed, and loaded again from background, same behaviour with above mentioned

unmount AppSTate: {"_emitter": {}, "currentState": "background", "isAvailable": true}
LOG unmount here:
LOG Running "AppStateChangeIssueAndroid" with {"rootTag":201}
LOG AppSTate: {"_emitter": {}, "currentState": "active", "isAvailable": true}
LOG re-attach appState event listener

sample code
`const App = () => {
useEffect(() => {
console.log('AppSTate: ', AppState);
const appStateSubscription = AppState.addEventListener(
'change',
_handleAppStateChange,
);
console.log('re-attach appState event listener');
return () => {
appStateSubscription.remove();
console.log('unmount AppSTate: ', AppState);
console.log('unmount here:');
};
}, []);

const _handleAppStateChange = nextAppState => {
console.log('_handleAppStateChange appState:', nextAppState);
};

return (
<>
{new Date().getMilliseconds()}
</>
);
};`

[ilber]

"react": "18.1.0",
"react-native": "0.70.6"

Same issue.

[ws333]

Same here. I get these results when reopening my app exited with BackHandler.exitApp()

• AppState change event not firing on Android 8 (tested on real device) and Android 11 (tested on real device & emulator)
• Works as expected on Android 12 emulator

Seems like BackHandler.exitApp() has different effects on Android <=11 and Android >=12
On Android <=11 the app rerenders, so for now I'm catching the different behaviours with useEffect.

"react": "18.1.0",
"react-native": "0.70.6",

[jkoutavas]

Any news on this front?

[github-actions]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.