ionic-framework
ionic-framework copied to clipboard
bug: Dismissing a LoadingController will cause a swiper Slide flicks back to initial slide when swiping and using showing and then dismissing an Ionic Spinner while loading data
Prerequisites
- [X] I have read the Contributing Guidelines.
- [X] I agree to follow the Code of Conduct.
- [X] I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v8.x
Current Behavior
In the sample application when trying to find out why this was happening in my real application. The basic setup is 2 slides, each with a Angular component, each with some selects, and when swiping from one slide to the next, I show an Ionic spinner while there is a server request for the data of the component in the new slide.
However, I find that if I happen to have opened a select, or any modal popup from within one of the components, and then slide, showing and then hiding the Ionic spinner will cause the slide to go back to the page we just came from.
If I remove the spinner, it does not happen , or we we don't open any "popups" before sliding it does not happen.
The sample app is just a stock newly created Ionic/Angular application, where the main component with the slider is FolderPage. In the slideChanged handler it calls the loadData on the component we are going to, and this is where we call the presentDataLoading and dismissLoaderIfPresent which uses the Ionic LoadingController (which I use everywhere wit no issues)
So, there is some weird interaction between the above elements which is causing the slider to be "pushed" back, but I have no idea what this could be.
Expected Behavior
To be able to slide to the next slide, and not have it then return to the previous when using an LoadingController during the transition
Steps to Reproduce
- Run the sample application
- Open a select
- Slide to the next page
Most often when we call the dismiss the slide will then flick back to the orinaly slide
Code Reproduction URL
https://github.com/pjc2007/swiper-issue2
Ionic Info
Ionic:
Ionic CLI : 7.2.0 (C:\Users\peter\AppData\Roaming\npm\node_modules@ionic\cli) Ionic Framework : @ionic/angular 8.2.6 @angular-devkit/build-angular : 18.1.3 @angular-devkit/schematics : 18.1.3 @angular/cli : 18.1.3 @ionic/angular-toolkit : 11.0.1
Capacitor:
Capacitor CLI : 6.1.1 @capacitor/android : not installed @capacitor/core : 6.1.1 @capacitor/ios : not installed
Utility:
cordova-res : 0.15.4 native-run : 2.0.1
System:
NodeJS : v20.15.1 (C:\Program Files\nodejs\node.exe) npm : 10.7.0 OS : Windows 10
Additional Information
I did do an original post about it on SO (https://stackoverflow.com/questions/78833526/swiper-slidechange-event-sometimes-called-a-second-time-resetting-back-to-the-in), but no real feedback there.
Not sure if this is a swiper or Ionic issue,
@pjc2007 Are you able to resolve this yet?
@pjc2007 Are you able to resolve this yet?
No, I had to replace it with a custom one, i.e. a component with an ion-spinner in it and using an ngIf to show/hide. Could not get around the problem no matter what I tried. This custom component causes no issues.