Closed
Description
Issue Description
When deep linking into the app, while the app is in background, from an external link using a custom scheme a la myapp://
the app is stuck on a blank screen on Android. It works fine on iOS, both from background and first launch. Android works fine for first launch.
I found somewhat similar issues reported several time, I tried a patchwork of the proposed fixes, none of them worked.
If someone knows what is happening in the lifecycle of the android activity when coming back from background that would cause such issue, that would be nice.
Steps to Reproduce / Code Snippets / Screenshots
Code is as follows:
app.android.tsx
import React from 'react'; // eslint-disable-line
import AppState from 'react-native';
import { Provider } from 'react-redux';
import { Navigation, NativeEventsReceiver } from 'react-native-navigation';
import { compose, createStore } from 'redux';
import rootReducer from './redux';
import { registerScreens, registerScreenVisibilityListener, tabs, navigatorStyle } from './views';
const store = compose()(createStore)(rootReducer);
registerScreens(store, Provider);
registerScreenVisibilityListener();
function startApp() {
Navigation.startSingleScreenApp({
screen: {
screen: 'app.home',
title: 'Home',
navigatorStyle,
leftButtons: [
{
id: 'sideMenu'
}
]
},
drawer: {
left: {
screen: 'app.drawer'
}
}
});
}
Navigation.isAppLaunched()
.then(appLaunched => {
if (appLaunched) {
startApp(); // App is launched -> show UI
}
new NativeEventsReceiver().appLaunched(startApp); // App hasn't been launched yet -> show the UI only when needed.
});
relevant part of base Component class inherited by all the screens, including Home:
constructor(props) {
super(props);
this._handleOpenURL = this._handleOpenURL.bind(this);
this._checkDeepLink = this._checkDeepLink.bind(this);
this._navigateToScreenAndroid = this._navigateToScreenAndroid.bind(this);
this._handleAppStateChange = this._handleAppStateChange.bind(this);
}
componentDidMount() {
AppState.addEventListener('change', this._handleAppStateChange);
Linking.addEventListener('url', this._handleOpenURL);
}
componentWillUnmount() {
AppState.removeEventListener('change', this._handleAppStateChange);
Linking.removeEventListener('url', this._handleOpenURL);
}
_handleAppStateChange(currentAppState) {
if (currentAppState == 'active') {
Linking.getInitialURL().then(url => this._checkDeepLink(url));
}
}
_handleOpenURL(event) {
this._checkDeepLink(event.url);
}
_checkDeepLink(url) {
if (url) {
var parts = url.split('myapp://myhost.com/')
if (parts.length > 0) {
var target = parts[1];
this._navigateToScreenAndroid(target);
}
}
}
_navigateToScreenAndroid(screen) {
this.props.navigator.resetTo({
screen: 'app.'+screen,
title: screen,
navigatorStyle,
animated: true,
animationType: 'fade',
leftButtons: [
{
id: 'sideMenu'
}
]
});
}
The android-logs show that, after clicking on a deep-link in the browser:
02-16 15:00:53.102 22518 22518 D ReactNative: ReactInstanceManager.detachViewFromInstance()
02-16 15:00:53.102 22518 22518 D ReactNative: ReactInstanceManager.detachViewFromInstance()
02-16 15:00:53.102 22518 22518 D ReactNative: CatalystInstanceImpl.destroy() start
02-16 15:00:53.139 22518 22518 D ReactNative: ReactInstanceManager.ctor()
02-16 15:00:53.172 22518 22518 D ReactNative: ReactInstanceManager.createReactContextInBackground()
02-16 15:00:53.172 22518 22518 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundInner()
02-16 15:00:53.172 22518 22518 D ReactNative: ReactInstanceManager.onJSBundleLoadedFromServer()
02-16 15:00:53.172 22518 22518 D ReactNative: ReactInstanceManager.recreateReactContextInBackground()
02-16 15:00:53.173 22518 22518 D ReactNative: ReactInstanceManager.runCreateReactContextOnNewThread()
02-16 15:00:53.188 22518 22532 D ReactNative: CatalystInstanceImpl.destroy() end
02-16 15:00:53.194 22518 22564 D ReactNative: ReactInstanceManager.createReactContext()
02-16 15:00:53.247 22518 22564 D ReactNative: Initializing React Xplat Bridge.
02-16 15:00:53.248 22518 22564 D ReactNative: Initializing React Xplat Bridge before initializeBridge
02-16 15:00:53.256 22518 22564 D ReactNative: Initializing React Xplat Bridge after initializeBridge
02-16 15:00:53.256 22518 22564 D ReactNative: CatalystInstanceImpl.runJSBundle()
02-16 15:00:53.257 22518 22567 D ReactNative: ReactInstanceManager.setupReactContext()
02-16 15:00:53.257 22518 22567 D ReactNative: CatalystInstanceImpl.initialize()
02-16 15:00:53.273 22518 22518 D ReactNative: CatalystInstanceImpl.destroy() start
02-16 15:00:53.550 22518 22541 D ReactNative: CatalystInstanceImpl.destroy() end
Environment
- React Native Navigation version: 1.1.378
- React Native version: 0.53.0
- Platform(s) (iOS, Android, or both?): android
- Device info (Simulator/Device? OS version? Debug/Release?): Simulator / Debug