search

patrickkunka / mixitup

A high-performance, dependency-free library for animated filtering, sorting, insertion, removal and more
Apache License 2.0
4.52k stars 736 forks source link

Multifilter crashes on iOS #546

Open metakolor opened 4 years ago

metakolor commented 4 years ago

Hey Patrick,

I've set up a relatively simple Multifilter-Application you can find it here: https://codepen.io/Metakolor/pen/jOPdrJd

Issue-Description: Filtering and sorting works perfectly fine on desktop. Also on mobile (iPhone X) it seems to work for a while, but if you start activating and deactivating the toggles, clicking the sort buttons and the reset-button multiple times it suddenly stops working.

What I've tried: I've read a little in other closed issues and set the queue-limit to 5, but the problem still persists. I've deleted the callbacks, but the problem still persists. I've disabled the animations completely and this seems to delay the symptoms a little bit but after clicking around for a while (no matter which speed) the filter stops working again.

Device: The mobile device I am using for this tests is an iPhone X, iOS 13.3.1, Safari

patrickkunka commented 4 years ago

Hi @Metakolor,

Do you see the same issues when using the included MultiFilter demos on an iOS device?

metakolor commented 4 years ago

Hey Patrick,

yes indeed - if you randomly click on the buttons on your example (https://www.kunkalabs.com/mixitup-multifilter/) the filtering at some point stops working and crashes.

glmvc commented 3 months ago

The CodePen doesn't seem to work anymore, and I can't reproduce the problem with the MixItUp demo in iOS Safari, but this issue sounds very similar to what I had, and maybe my findings will help someone...

I also searched for other but similar closed issues and kept finding the suggestion to increase the queueLimit. However, I always got the following warning in iOS Safari after a certain amount of time using the filter, and MixItUp suddenly stopped working:

WARNING: An operation was requested but the MixItUp instance was busy. The operation was rejected because the queue is full or queuing is disabled.

After what felt like an eternity, I finally realized that, at least in my case, this issue occurred in iOS Safari when the browser's dynamic (address) bar changed or updated while scrolling or pinch-zooming during a MixItUp operation with animations. I traced the problem back to Safari triggering a resize event when this happens.

It turned out that I had a script running in parallel that prevented all transitions and animations on resize (see "resize animation stopper" for example). If no animations were suppressed on resize, the filter worked fine even in iOS Safari without running into the queue limit problem.

My guess is that suppressing all animations during an operation prevents the transitionend event from being fired on all MixItUp target items, causing the filter operation to never "clean up" as described by @patrickkunka in this StackOverflow answer on a similar issue.