My registerBackButtonAction callback is never called

Hello,

I have an Ionic 2.2 project where I override the default behavior of the back button using platform.registerBackButtonAction(). But something strange happened because it used to work but now the callback never gets called and the app just exits. I do the following in the app.components.ts file:

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar, Splashscreen } from 'ionic-native';
import { TabsPage } from '../pages/tabs/tabs';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage = TabsPage;

  constructor(platform: Platform) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      Splashscreen.hide();

      platform.registerBackButtonAction(() => {

          console.log("Backbutton pressed.");

      }, 100);

    });
  }
}

The same code works in a vanilla starter app. I have debugged the register function and I see that my callback is added to the Platform backbutton callbacks array normally.

I also tried with different priority levels with no luck.

This is so annoying, I spent days trying to figure out what is wrong. I did the usual re-install of the node modules and platform etc. I also tried going back to cordova 6, but it is not that.

My setup is:

@ionic/cli-plugin-cordova       : 1.6.2
@ionic/cli-plugin-ionic-angular : 1.4.1
@ionic/cli-utils                : 1.7.0
ionic (Ionic CLI)               : 3.7.0
Cordova CLI : 7.0.1
@ionic/app-scripts : 1.1.4
Cordova Platforms  : android 6.2.3
Ionic Framework    : ionic-angular 2.2.0

Android SDK Tools : 26.0.2
Node              : v6.11.2
OS                : Windows 7
npm               : 5.3.0

What could be causing this ?

Anyone has a suggestion ? I’m really pulling my hair out on this one. Am I the only one that problem ever happened?

I also tried this without any luck:

document.addEventListener("backbutton", function () {

        }, false);

It seems the ionic or cordova back button handler mechanism is completely ignored. The application closes instantly. I even debugged the ionic code where the back button handlers are called and my breakpoints never get triggered. In fact I see it enter the function in a flash but something closes the application and so it does not have time to stop on the breakpoint.

I don’t know how much sense it make to give advice when your app-scripts is so out of date. You could be running into all kinds of bugs. Unless there’s a reason you just can’t update, I’d recommend you update everything.

Yes I understand and that’s what I am considering now. Up to now my ionic 2 project was working fine and I did not want to upgrade to ionic 3 fearing that things would not work well anymore. But now, I guess I have no other choice.

I will try upgrading to ionic 3.

Thanks

It took me about 4 hours to upgrade a project from 2 to 3, getting all pages to lazy load. So it’s work. But I only had to do it once.

1 Like

Same problem I am desperate with back button hardware, my code…

 this.platform.ready().then(() => {
      this.statusBar.backgroundColorByHexString('#c4d600');
      this.backgroundMode.enable();
       document.addEventListener('backbutton', (e) => {
         e.preventDefault();
         this.preventExit();
      }, false);

Previously I did try this without luck…

   this.platform.registerBackButtonAction(() => {
        if(this.menuCtrl.isOpen()){
          this.menuCtrl.close();
        }else{
          if (this.nav.length() == 1) {
            if (!this.showedAlert) {
              this.confirmExitApp();
            } else {
              this.showedAlert = false;
              this.confirmAlert.dismiss();
            }
          }  
        }

@CodeIgnitedX can you show us the output of your ionic info command ?

Of course.

cli packages: (C:\Users\Marco\AppData\Roaming\npm\node_modules)
@ionic/cli-utils : 1.9.2
ionic (Ionic CLI) : 3.9.2
global packages:
Cordova CLI : 7.0.0
local packages:
@ionic/app-scripts : 2.1.3
Cordova Platforms : android 6.2.3
Ionic Framework : ionic-angular 3.6.0
System:
Node : v6.11.0
npm : 4.6.1
OS : Windows 7

Ok so you have the same problem as me in ionic 3… Not very encouraging…

Do you use any plugins like google maps and geolocation? I use those.

I’m wondering if the problem could be caused by a plugin. Because I don’t have the problem with a vanilla starter app.

Did you try the backbutton code in a starter app?

Effectively!, I use native google maps and native geolocation., I will try encapsulate geolocation inside function and call it before or later to test it.

At least I have a clue, thank you!.

Ok, and are you using the v2 beta google maps plugin by any chance ? I am and I think that when I re-installed my plugins to solve another issue, it upgraded the google maps plugin to latest version and there may be a problem with the latest beta. This would make sense cause the problem really appeared out of nowhere.

I am in the process of upgrading to ionic 3 right now but if I still have that back button issue after the ionic upgrade, I will try reverting to an older google maps plugin version, maybe v1 instead of v2 beta.

Ok, found the culprit ! The google maps plugin v2 beta !

I removed the plugin from my project and now my back button handler is called, just like it should.

2 weeks I was pulling my hair on this.

1 Like

UPDATE: After re-installing the google maps plugin v2 beta, the back button is now working ok.

Since the v2 beta may change anytime, I guess that 2 weeks ago when I re-installed the plugin, I got a buggy version. Seems to be fixed now.

However, the latest google maps plugin v2 beta has other issues. It really slows down the whole app, not just the page with the map. My lists are super slow now, it takes 2 seconds to react to a tap on a button, everything is sluggish. So I uninstalled that plugin. Will try with an older version instead.

platform.ready() should not be in constructor, rather it should be in the initializeApp()

@arnoldparge: Ok. But this was generated from starter app by ionic.