bug: IonInput race condition with IonChange and IonBlur
See original GitHub issueBug Report
Ionic version: [ ] 4.x [x] 5.x
Current behavior:
I found the bug when we were trying to support the Bitwarden autofill and coming up with an issue.
Basically we found the onBlur event would occur before the onChange.
This causes an issue because we tie the validation to the onBlur. So if the value is not updated before the onBlur event, it would do the validation on an empty input.
Expected behavior: onChange should trigger the value update or at-least make sure the value is updated, since there is a delay option, before onBlur gets called.
Steps to reproduce: Sample app below to test ion-input and native input.
I used Bitwarden to trigger the autofill
Related code: https://github.com/scottix/ionic-bitwarden
Other information:
Ionic info:
Ionic:
Ionic CLI : 6.13.1 (/usr/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/vue 5.6.4
Capacitor:
Capacitor CLI : 2.4.7
@capacitor/core : 2.4.7
Utility:
cordova-res : 0.15.3
native-run : not installed
System:
NodeJS : v12.22.1 (/usr/bin/node)
npm : 6.14.12
OS : Linux 5.4
Issue Analytics
- State:
- Created 2 years ago
- Comments:7 (3 by maintainers)
Top Results From Across the Web
angular - ionic:Change event is not fired on <ion-input> when ...
I am changing input value from one of external javascript file. $('.scoreboardus input').val(200).trigger('onchange');.
Read more >@ionic/angular | Yarn - Package Manager
Bug Fixes. header: fix race condition in collapsible header (#20334 (215d55f); ios: translucent toolbar blur no longer obscures entering page toolbar ...
Read more >How do I turn on the webview autocomplete for an login form ...
The corresponding WebKit bug report is this: ... I had the same issue, seems to work if you just keep the IonInput, and...
Read more >https://raw.githubusercontent.com/moweex/ionic/mas...
Bug Fixes * **list:** remove margin of MD buttons in ion-item-options ... **navigation:** account for race conditions in developer's code ...
Read more >EditorState Race Conditions - Draft.js
Different browser events can trigger the Editor to create a new state and call onChange . For instance, when the user pastes text...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Should probably add this to your docs so other people can make sense of this weird behavior.
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.