ionic Hardware back not working after displaying ads

Question

Ionic version: 3.x

Current behavior: After registering the hardware back then if ads are displayed, pressing the hardware back exits the app and does not bind to the normal behavior

Expected behavior: Hardware back should execute the registered functions

Steps to reproduce:

1. Create a new app with any template add.
2. Add the admob-free plugin
3. Register hardwarback to log something(Not to exit).
4. Display ads.
5. Press hardware back

Related code:

In the constructor of app.component.ts register the back handler

    platform.registerBackButtonAction(() => {
    console.log("Back Pressed");
  });

Display banner ads or interstitials then without pressing anything in the app press the back button. The app will exit. We are not exiting the app in our handler.

APP REPO HERE.

A related issue can be seen here.

Ionic Info:

cli packages: (C:\Users\prantikv\AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.12.0
    ionic (Ionic CLI) : 3.12.0

global packages:

    cordova (Cordova CLI) : 7.0.1

local packages:

    @ionic/app-scripts : 3.0.0
    Cordova Platforms  : android 6.0.0
    Ionic Framework    : ionic-angular 3.7.1

System:

    Android SDK Tools : 25.2.5
    Node              : v6.11.3
    npm               : 5.4.2
    OS                : Windows 10

Misc:

    backend : pro

Answer 1

Add your addeventlistener to the document, and capture the event in the capture phase. It will be useful to stopPropagation when the event is fired, to prevent other event listeners from firing.

document.addEventListener("backbutton", onBackKeyDown, true);