React-native-firebase: Firebase is not receiving data. Android

[serbol]

Analytics data stop sending after several clicks where are triggered functions that have logEvent method. Usually are sent first ~20-30 events then nothing. Data traffic was checked using StreamView. After that, when I try to close/open app several time + do some actions to call logEvent method, app crashes! And then after I delete the app, all data finally come to analytics. What is a reason of such strange behavior? Issue appears on Android.

My app is very simple. Here is App.js file content where is almost all app code:

import React, {Component} from 'react';
import { 
  AppRegistry,
  ListView,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableOpacity,
  Platform,
  Dimensions
} from 'react-native';

import ProgressCircle from 'react-native-progress-circle';

import { StackNavigator, DrawerNavigator } from 'react-navigation';
import firebase from 'react-native-firebase';

import DrawerMenu from "./containers/DrawerMenu";

const MenuIcon = require('./components/MenuIcon');
const ActionButton = require('./components/ActionButton');
const styles = require('./styles.js')

const {height, width} = Dimensions.get('window');
const fonts = {
  NeoTech: Platform.OS === 'ios' ? 'Neo Tech Alt' : 'NeoTech',
  Lato: Platform.OS === 'ios' ? 'Lato Regular' : 'Lato'
};

// Initialize Firebase
const androidConfig = {
  clientId: "x",
  appId: "x",
  apiKey: "x",
  databaseURL: "x",
  storageBucket: "x",
  messagingSenderId: "x",
  projectId: "x",
  persistence: true
};

const iosConfig = {
  clientId: "x",
  appId: "x",
  apiKey: "x",
  databaseURL: "x",
  storageBucket: "x",
  messagingSenderId: "x",
  projectId: "x",
  persistence: true
};

const firebaseApp = firebase.initializeApp(Platform.OS === 'ios' ? iosConfig : androidConfig);

/*
firebaseApp.onReady().then((app) => {
  firebase.app('test').auth().signInAnonymously().then((user) => {
      console.log('testApp user ->', user.toJSON());
  });
});
*/

var app_design = 'default';

// Set default values
firebaseApp.config().setDefaults({
  app_design: 'default',
});

class HomeScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {
      design: 'default',
      isLoaded: true
    };
  }

  componentDidMount() {
    firebaseApp.config().fetch(0)
      .then(() => {
        return firebaseApp.config().activateFetched();
      })
      .then((activated) => {
        if (!activated) console.log('Fetched data not activated');
        return firebaseApp.config().getValue('app_design');
      })
      .then((snapshot) => {
        this.setState({
          design: snapshot.val(),
          isLoaded: true
        })
      })
      .catch(console.error);

    firebaseApp.analytics().setAnalyticsCollectionEnabled(true);
    firebaseApp.analytics().logEvent('open_main_screen', {});
  }

  render() {
    return (
      <View style={styles.mainContainer}>
        {this.state.isLoaded ? (
          <View style={styles.container}>
            <View style={styles.profileContainer}>
              <Image
                style={styles.profileBackground}
                source={require('./images/profile.jpg/')}
                blurRadius={4}
              />
              <Image
                style={styles.profile}
                source={require('./images/profile.jpg/')}
              />
              <Text style={styles.profileText}>John Snow</Text>
            </View>
            <Text style={styles.title}>YOUR BALANCE</Text>
            <ProgressCircle
              percent={15}
              radius={90}
              borderWidth={6}
              color="#b3170c"
              shadowColor="#e4e4df"
              bgColor="#f2f2f2">
              <Text style={styles.number}>1.69</Text>
              <Text style={styles.aed}>AED LEFT</Text>
            </ProgressCircle>
            <Text style={styles.info}>Last Recharge AED 20.0</Text>
            <Text style={styles.date}>06-04-2018</Text>
            <ActionButton 
              onPress={() => {
                firebaseApp.analytics().logEvent('recharge_click', {});
                this.props.navigation.navigate('Recharge');
                }} 
              design={this.state.design}/>
          </View>
        ) : (
          <View style={styles.loaderContainer}>
            <Image
              style={styles.loader}
              source={require('./images/load.gif/')}
            />
          </View>
        )}
      </View>
    )
  }
}

class RechargeScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {

    };
  }

  render() {
    return (
      <View style={[styles.loaderContainer, {padding: 32}]}>
        <Text style={styles.title}>Welcome to recharge screen!</Text>
      </View>
    )
  }
}

const RootStack = StackNavigator({
    Home: {
      screen: HomeScreen,
      navigationOptions: ({ navigation }) => ({
        title: 'My Etisalat',
        headerLeft: <MenuIcon onPress={ () => navigation.navigate('DrawerOpen') } />,
        headerRight: <View></View>
      })
    },
    Recharge: {
      screen: RechargeScreen,
      navigationOptions: ({ navigation }) => ({
        title: 'Recharge',
        headerRight: <View></View>
      })
    }
  },
  {
    initialRouteName: 'Home',
    navigationOptions: {
      headerStyle: {
        justifyContent: 'center',
        backgroundColor: '#719e19'
      },
      headerTintColor: '#fff',
      headerTitleStyle: {
        flex: 1,
        fontWeight: 'normal',
        textAlign: 'center',
        fontFamily: fonts.NeoTech
      }
    }
  }
);

const Drawer = DrawerNavigator(
  {
    Main: { screen: RootStack }
  },
  {
    contentComponent: DrawerMenu,
    drawerWidth: 200
  }
);

export default class App extends Component {
  /*
  componentWillUnmount() {
    firebaseApp.auth().signOut().then(() => {
      console.log('Sign Out');
    });
  }
  */

  render() {
    return <Drawer />;
  }
}

---

Edited by @Salakar - please use code blocks next time

[Salakar]

@serbol you need to use the DebugView - analytics data can take several hours to process - the DebugView will let you see live events

[serbol]

There are no events in DebugView at all!

[anniewey]

+1 Events are log in DebugView for iOS but not in Android. Any help?
@serbol Did u manage to fix it?

[jpamarohorta]

Can this issue be reopened? I'm having exactly the same issue.

iOS events are logged perfectly but Android ones don't appear anywhere.

[Salakar]

Re-opened as requested

[jpamarohorta]

Thank you. I think the issue is different. Let me explain what happened:

Both iOS & Android were setup at the same time and the same events were triggered more or less at the same time. The iOS events in the same day could be seen in Firebase but the Android ones only appear after 2 days.

Also, I followed this guide https://blog.theodo.fr/2018/01/building-google-analytics-funnel-firebase-react-native to configure custom page events. In the iOS dashboard I can see all my custom page events but in Android I only see screen_view events.

It seems there are some differences in the way iOS & Android events are handled. Given that this is not the exact scope of this issue, I can create a different one if needed.

[Salakar]

@jpamarohorta yes please, a separate issue would be helpful otherwise it's going to get lost in this one 🙈