iOS Popover issue with press event

@gemcomputers wrote:

Hey everyone,

I have an ion-list, where each item has a press event which triggers a popover.
On Android this works fine, but on iOS there’s something causing the popover to instantly dismiss as it shows. This happens about 80-90% of press events. Sometimes it doesn’t immediately dismiss.

On an actual device, you can press, and then while still pressing, you can slide your finger over the popover, which then seems to keep it open.

I need to have the popover stay open until you either tap outside of the popover or on one of the ion-items inside the popover.

If I set enableBackdropDismiss to false, then it stays open as expected.
So I guess there’s an additional tap event on the backdrop being triggered when it shouldn’t be.

This is the code for the home.ts page. Very straightforward, just loading up the popOver.

pressEvent(event: any) {
    console.log('Pressed...');
    this.presentPopover(event);
  }

  tapEvent() {
    console.log('Tapped...');
  }

  presentPopover(event: any) {
    let popover = this.popoverCtrl.create(MyPopOverPage, {}, { enableBackdropDismiss: false });
    popover.present({
      ev: event
    });
    this.popoverOpen = true;

    popover.onDidDismiss((popoverData) => {
      this.popoverOpen = false;
      console.log('Popover dismissed');
    });
  }

The list on the home.html is as follows.

<ion-list>
    <ion-item>
      <ion-avatar item-start (press)="pressEvent($event)" (tap)="tapEvent()">
        <img src="assets/imgs/avatar-ts-woody.png">
      </ion-avatar>
      <h2>Cher</h2>
      <p>Ugh. As if.</p>
    </ion-item>
  </ion-list>

Here’s what it looks like in the browser:

Any ideas on how to prevent the backdrop tap being incorrectly triggered? Or perhaps manually re-enable backdrop dismiss after the popover opens up?

Any help would be hugely appreciated!

Ionic info:

ionic info                                                           (master✱)                                                                                   (master✱)

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.0
    ionic (Ionic CLI) : 3.19.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.6
    Cordova Platforms  : ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.2
    ios-sim    : 5.0.4
    Node       : v6.11.2
    npm        : 3.10.10
    OS         : macOS High Sierra
    Xcode      : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro

Posts: 1

Participants: 1

Read full topic