iOS 6 js events function not called if has setTimeout in it

Question

I noticed this strange behaviour with the latest iOS (iOS 6). If calling a function for any touch event which has a setTimeout inside, the part inside the setTimeout is neve

Answer 1

Note: It looks like UIWebView does not support requestAnimationFrames. Thanks to Guillaume Gendre for pointing it out!

We ran into a similar issue with a web app we're working on.

For us, it was touchmove that caused issues. We implemented a workaround (found here: https://gist.github.com/3755461) that seemed to work pretty well until another issue forced us to abandon it. (I tried adding the workaround to your fiddle and was able to get the timer to fire once or twice, but it required a weird gesture+scroll event that was damn near impossible to consistently reproduce.)

Anyway, one of the new features in iOS 6 for developers are requestAnimationFrames. My workaround is basically a wrapper for timers, allowing the developer to pass a boolean, which will call either the native function or the workaround function.

For example:

setTimeout(function(){alert("HI")}, 1000); // using native
setTimeout(function(){alert("HI")}, 1000, true); // using workaround

Here are additional ways to use the workaround:

setInterval(function(){console.log("Interval")}, 1000, true);

var timer = setTimeout(function(){ /* ... */ }, 60000, true);
clearTimeout(timer);

var interval = setInterval(someFunc, 10000, true);
if(someCondition) clearInterval(interval);

Here are two fiddles with the workaround examples. Try pinch/zooming on the black squares:

http://jsfiddle.net/xKh5m/embedded/result (Uses native setTimeout function) http://jsfiddle.net/ujxE3/embedded/result

We've been using this workaround for a few months in a production environment, and have not run into any major issues.

Here's a public gist of the workaround: https://gist.github.com/4180482

Here's more information about requestAnimationFrames:

MDN documentation

Paul Irish on requestAnimationFrame

Good luck!