Ionic-framework: [4.12.0] [ion-picker] dismiss function doesn't pass data and role data to onDidDismiss

[dletran]

Bug Report

Ionic version:


4.12.0

Current behavior:
When the ion-picker gets dismissed the onDidDismiss() data and role properties are both undefined.

Expected behavior:
When the picker gets dismissed it should have the role parameter set. E.g. When closing via a Button with that button's role.
So we can perform some action based on whether the user clicked the button or not

Steps to reproduce:
Create a picker, present it and tap on one of the buttons so the onDidDismiss() method is called.

const picker = await this.pickerController.create({
  buttons: [
   {
     text: 'CANCEL',
     role: 'cancel'
   },
   {
     text: 'CONFIRM',
     role: 'confirm'
   }
  ],
  columns: [
    {
      name: 'column',
      options: [
        {
          text: 'First',
          value: 'first'
        },
        {
          text: 'Second',
          value: 'second'
        }
      ]
    }
  ]
});

picker.present();

const dismiss = await picker.onDidDismiss();
console.log('Dismissed picker', dismiss);
if(dismiss.role === 'close') {
  console.log('Close button pressed!');
}

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.12.0
   Ionic Framework               : @ionic/angular 4.2.0
   @angular-devkit/build-angular : 0.13.6
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.4.0

Cordova:

   cordova (Cordova CLI) : 9.0.0 ([email protected])
   Cordova Platforms     : not available
   Cordova Plugins       : not available

System:

   NodeJS : v10.16.0 (/home/dletran/.nvm/versions/node/v10.16.0/bin/node)
   npm    : 6.9.0
   OS     : Linux 4.13

[brandyscarney]

Thanks for the issue! I was able to reproduce this with the following: https://codepen.io/brandyscarney/pen/YbggLb

I believe this line of code is the problem: https://github.com/ionic-team/ionic/blob/0a7aae28a7eb0270cdcd100933c01850403b66db/core/src/components/picker/picker.tsx#L176

Also, the backdrop dismiss is wrong: https://github.com/ionic-team/ionic/blob/0a7aae28a7eb0270cdcd100933c01850403b66db/core/src/components/picker/picker.tsx#L201

[lukabers]

Any updates on this issue?

[jeffricks]

Also interested in a fix for this. Cancelling a picker is a pretty fundamental operation for a core component.

[abalad]

Same issue here

[hobbydevs]

Any updates ? Having the same issue.

[RashmiChandran]

Hi Team, Any updates for this issue?

[hidertanure]

Hi guys,
As a workaround, my issue was solved using the _handler_ callback like this:

{ text: 'Done', role: 'select', handler: (value) => { console.log(value); } }

Don't need to use the _onDidDismiss_ anymore.

[BrunoUY]

Hi, Any news?

[LucaCorcella]

Hi, any news?

picker.onDidDismiss().then(data => { console.log(data); });.

return undefiined

[brandyscarney]

PR submitted here: https://github.com/ionic-team/ionic/pull/19787

Dev release is based on the 5.0.0-beta.0 release: 5.0.0-dev.201910292106.aebfdfc

[claytongulick]

fix won't be backported to 4.x branch?

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.