ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.02k stars 13.51k forks source link

bug: (ionChange) event of ion-picker-column not fired on iOS devices #29480

Closed losciur closed 5 months ago

losciur commented 5 months ago

Prerequisites

Ionic Framework Version

v7.x

Current Behavior

In a blank angular ionic project I tested the ion-picker in modal as described here: https://ionicframework.com/docs/api/picker#picker-in-modal

The ionChange event of the ion-picker-column (see https://ionicframework.com/docs/api/picker-column#events) works fine ONLY on android devices when the value change. In iOS nothing is fired.

Expected Behavior

Same behavior as Android

Steps to Reproduce

  1. create a blank angular ionic project
  2. Insert code as the documentation in the home.page.html,home.poge.ts and home.page.scss files: https://ionicframework.com/docs/api/picker#picker-in-modal
  3. To check the bug add in home.page.ts one line to the onIonChange function:
    onIonChange(event: CustomEvent) {
    console.log("onIonChange fired!", event.detail.value) // ADD THIS LINE
    this.currentValue = event.detail.value;  
    }
  4. Try on an Android device: you see in the console the ionChange event fired when value change
  5. Try on an iOS device: nothing is fired when value change

Code Reproduction URL

https://github.com/losciur/ionic-bug-ion-column-picker

Ionic Info

Ionic:

Ionic CLI : 7.2.0 (/Users/losciur/.nvm/versions/node/v18.19.0/lib/node_modules/@ionic/cli) Ionic Framework : @ionic/angular 8.1.1 @angular-devkit/build-angular : 17.3.7 @angular-devkit/schematics : 17.3.7 @angular/cli : 17.3.7 @ionic/angular-toolkit : 11.0.1

Capacitor:

Capacitor CLI : 6.0.0 @capacitor/android : 6.0.0 @capacitor/core : 6.0.0 @capacitor/ios : 6.0.0

Utility:

cordova-res : not installed globally native-run : 2.0.1

System:

NodeJS : v18.19.0 (/Users/losciur/.nvm/versions/node/v18.19.0/bin/node) npm : 10.2.3 OS : macOS Unknown

Additional Information

No response

sean-perkins commented 5 months ago

Hello @losciur, I am not able to reproduce.

Please confirm that you have your Safari devtools to show all logs, not just errors: CleanShot 2024-05-09 at 13 07 52

losciur commented 5 months ago

Hi, thanks for the quick answer. After new tests I have to specify better. My issue was generated trying the picker on a phisical iPad (fifth generation - iPadOS 16.7.5). In that device, while I'm moving along the picker column values, or when I stop on a specific value, the (ionChange) doesn't fire. But now, I found out that if after moving along the picker column values and stop on a specific value, I CLICK on the specific value, THEN the (ionChange) fires!

Other tests: if I use the simulator with more recent device (iOS 17), the (ionChange) correctly fire when I stop on a specific value (I don't need to click on it).

On Android: the (ionChange) fired when I stop on a specific value (no click needed)

losciur commented 5 months ago

I tested the problem in more recent models, and I found out that the bug is only in that old iPad (fifth generation - iPadOS 16.7.5). I think it is possible to close the issue. Thanks

ionitron-bot[bot] commented 4 months ago

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.