bug: Ionic5.01, Android 6~8, modalController works strange when two modals open togather.

I test it in emulator, android 6,7,8, all of them reproduce the following issues.
These issues doesn’t exist in ionic 4.4.

Steps:

  1. create modal A, present it.
let modal = await this.modalCtl.create({
component: modalAClass
....
});
modal.present();
  1. in modal A, create modal B.
let modal = await this.modalCtl.create({
component: modalBClass
....
});
modal.present();
  1. in modal B, dismiss itself.
this.modalCtl.dismiss();
  1. then you will see, both modal A and B are dismissed in the UI.
  2. and the page below can’t be interactive anymore.
  3. inspect DOM in devTools, you will see modal A is still there. And more strange is, you call interact with the buttons in modal A, although you can’t see it.

To find more, I try another test.
Steps:

  1. create modal A, present it.
let modal = await this.modalCtl.create({
component: modalAClass
....
});
modal.present();
  1. in modal A, close A, and then create modal B.
this.modalCtl.getTop().dismiss();
let modal = await this.modalCtl.create({
component: modalBClass
....
});
modal.present();
  1. then you will see, both modal A and B are dismissed in the UI
  2. and the page below can’t be interactive anymore.
  3. inspect DOM in devTools, you will see modal B is still there. And as above, you call interact with the buttons in modal B, although you can’t see it.
  4. Workaround: add await before modalA dismiss, modal B will works. But, you will wait until modal A close before modalB popup, which is not a good UI expirence.

Envirorment:
Ionic:
Ionic CLI : 6.1.0
Ionic Framework : @ionic/angular 5.0.1
@angular-devkit/build-angular : 0.900.3
@angular-devkit/schematics : 9.0.3
@angular/cli : 9.0.3
@ionic/angular-toolkit : 2.1.2

Capacitor:
Capacitor CLI : 1.5.0
@capacitor/core : 1.5.0

QQ20200225-193247@2x

1 possible answer(s) on “bug: Ionic5.01, Android 6~8, modalController works strange when two modals open togather.

  1. Can everyone try the following dev build and let me know if it resolves the issue?

    Ionic Angular
    npm i @ionic/angular@5.1.0-dev.202004011618.3123a31

    Ionic React
    npm i @ionic/react@5.1.0-dev.202004011618.3123a31