Ionic 3 after "run android" build success but no code gets executed

Hi there

I hope some one can help me with my problem.
I’m currently developing an app for android and ios. My problem is now, that if I run the app with ionic cordova run android --d it builds successfully. But after the app starts, the root page gets loaded (redirect to AuthPage) but no code gets executed inside of it. On iOS it works fine!

The really strange thing now is, this only happens on the very first “startup” after the build. When I close the app and open it again, it works just fine…

ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.0.3 
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.1.9

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0, ios 4.5.5

System:

   ios-deploy : 1.9.2
   NodeJS     : v8.9.4 
   npm        : 5.7.1
   OS         : macOS High Sierra
   Xcode      : Xcode 10.0 Build version 10A255

Now to the code:

app.component.ts:

constructor(public _plt: Platform,
    ...
  ) {
    this.initializeApp();
  }

initializeApp() {
    this._plt.ready().then(() => {

      let parameterPromise = this.referenceService.init();
      let languagePromise = this.languageService.init();

      // Dynamic menu
      this.menuUtils._menuSubject.asObservable().subscribe(() => {
        this.menuItems = this.menuUtils.getPages();
      });

      // Subscribe to network's onDisconnect event
      this.network.onDisconnect().subscribe(() => {
        //doing some stuff
      });

      Promise.all([parameterPromise, languagePromise]).then((values) => {
        return Promise.resolve();
      })
    }).then(() => {
        return this.nav.setRoot(AuthPage)
  });
}

Now the auth page:

ngAfterViewInit() {
      this._plt.ready().then(() => {
        this.init();
      }).catch(ex => {
        console.error(ex);
      });
}

init() {
    ...
    // the code here never gets executed on initial startup after build on android"
    this._storageUtils.checkDeviceSecure().then(res => {
    ...
   });
}

I can open the source code with chrome://inspect and set a breakpoint inside the init() function of the auth page. Like already said, on the very first startup (initial startup) after building/running the app on a device, it will never get there. After closing the app and open it again, it gets executed and the app works fine. The strangest thing is, that this happens with android only.

Anybody got similar problem or have an idea what I did wrong? :slight_smile:

Try to avoid using the constructor inside the app.component.ts. It should be used just for initialization for variables or something like that.

I’m using the Angular Lifecycle-Hook ngOnInit() on the app.component.ts, my constructor includes just configuration settings.

Do you use a splashscreen? If yes, it seems, that you are missing your hide() call on the splashscreen, so it won’t be hidden and allways visible. Why it works on the second app start, I can’t explain.

Let me know, if I could help you.

Cheers
Unkn0wn0x

Hi

Thanks for your input. Unfortunately even if I use the ngOnInit() and not the constructor, the code wont get executed on the initial startup.

Do you use a splashscreen?

Yes, I do use splash screen and have already hidden it with .hide(). I just left the “standard” lines out of the snipped to minimize my posted code^^.

Best

Did you commented in the line

 <script src="cordova.js"></script>

inside of your index.html? By default, it’s commented out, you need to remove the comment-tags <!-- -->

This is neccessary to make the app work like expected.

Cheers
Unkn0wn0x

yes it is and was “active” all the time. never commented out…

I personally don’t think something like missing scripts or stuff. This because the app really works perfectly fine if build for iOS. And after reopen the app on android it also works perfectly fine.

The failure really just appears on the initial startup after building and deploying is finished. And only on android.

Could there be a restriction/malfunction if the app get launched from the terminal and not from the tablet?

I feel so stupid…

The problem was, that the promise handling wasn’t really optimized. Therefore, the app “finished” loading the page, before a given param was set. Because of that the function never got called.

So if others are working with many promises to “prepare” an app before it can be used. And some of them are interdependent… Never do:

x.then(() => {
    // do awesome stuff
}).then(() => {
    // do even more awesome stuff
});

or

x.then(() => {
     // do awesome stuff
    y.then(() => {
        // do even more awesome stuff
    });
});

do it like this:

let p1 = x();
let p2 = y();

Promise.all([p1, p2]).then(() => {
    // most awesome stuff happens here
});

sorry for unnecessary post.

Best