Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Error while evaluating requestAnimationFrame(fn) in angular.js:11328 for old browsers #6654

Closed
chandan-singh opened this issue Mar 12, 2014 · 16 comments

Comments

@chandan-singh
Copy link

Version: Angular.js 1.2.14
Line-number: 11328

In older version of browsers (such as QtWebKit), requestAnimationFrame was not available so when user migrate from 1.2.13 to 1.2.14, she may encounter following error: "'undefined' is not a function (evaluating 'requestAnimationFrame(fn)')". In my case , it is being called from angular.js:9509.

screenshot009

@lefos987
Copy link
Contributor

Hi @chandan-singh . Thank you for this. Can you please provide an example that reproduces this issue for you? Is this something that happened only for QtWebKit or did you get the same problem in other browsers as well? If yes, which are these "old browsers" that cause the issue?

@functionportal
Copy link

Any browser that doesn't support this: https://developer.mozilla.org/en-US/docs/Web/API/window.requestAnimationFrame will get function undefined errors.

@lefos987
Copy link
Contributor

This is introduced by commit 04d7317
Check #6535 and #6601 where a similar issue is already raised.
There is an open PR #6540 to fix the issue for old versions of FF.

@btford btford added this to the 1.3.0 milestone Mar 13, 2014
@IgorMinar
Copy link
Contributor

we should add moz prefix to

var requestAnimationFrame = $window.requestAnimationFrame ||
$window.webkitRequestAnimationFrame;
var cancelAnimationFrame = $window.cancelAnimationFrame ||
$window.webkitCancelAnimationFrame;
and create a fallback via $timeout for browsers that don't have rAF.

@matsko what do you think?

@IgorMinar
Copy link
Contributor

#6535 contains references to patches

@IgorMinar
Copy link
Contributor

I merged #6540 which fixes FF specific variant of this issue

@lefos987
Copy link
Contributor

PR #6691 by @matsko should fix the issue for all browsers that do not support requestAnimationFrame since it adds a $timeout fallback.

@matsko
Copy link
Contributor

matsko commented Mar 14, 2014

Perfect. I was looking for this issue number to reference in the commit message.

matsko added a commit to matsko/angular.js that referenced this issue Mar 14, 2014
matsko added a commit to matsko/angular.js that referenced this issue Mar 14, 2014
@matsko matsko closed this as completed in 7b5e019 Mar 14, 2014
@matsko
Copy link
Contributor

matsko commented Mar 14, 2014

Fixed. Landed as 7b5e019

@fredgalvao
Copy link

Using Angular.js v1.2.17 through Ionic (which recently updated from 1.2.12 on ionic-team/ionic-framework@89d5553), and this now fails for me on any Android devices below 4.4 (tested on 4.0.2 and 4.3), causing pretty much everything else to fail on my application.

The failing part is cancelAnimationFrame, which is undefined.

@matsko
Copy link
Contributor

matsko commented Jun 16, 2014

@fredgalvao do you mean: https://github.com/angular/angular.js/blob/master/src/ng/raf.js#L9

Could you possibly open up a new issue?

@matsko
Copy link
Contributor

matsko commented Jun 16, 2014

@fredgalvao is the issue that with Android version < 4.4 that it doesn't have a cancelAnimationFrame method at all?

@ajoslin
Copy link
Contributor

ajoslin commented Jun 16, 2014

@matsko the issue looks to be with line 14 of raf, which causes an error on line 19.

Some Android browsers do have requestAnimationFrame support, but not cancelAnimationFrame.

If line 14 was changed to var rafSupported = !!(requestAnimationFrame && cancelAnimationFrame), it would work.

I'll open a pull request.

@ajoslin
Copy link
Contributor

ajoslin commented Jun 16, 2014

Nevermind, this is actually Ionic's problem. I just looked at our raf polyfill, and we overwrite window.requestAnimationFrame with our fallback. I think this was accidentally done in a pull request that fixed something else. This is not a problem with angular.

EDIT: fixed now in Ionic via ionic-team/ionic-framework@ae8136d

@fredgalvao
Copy link

Although I agree that my issue itself was caused by Ionic (with the new insight from @ajoslin), I think a safer condition on line 14 is still welcome, as I actually remember reading people talk about browsers that had requestAnimationFrame but didn't have cancelAnimationFrame on the original polyfill from Paul Irish here.

@austinpray
Copy link

Is this fix available as a 1.2.x release?

Nevermind, found it: https://github.com/angular/angular.js/commits/eba192b8638192168e6ba44bdd887172e5321281?page=15

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

9 participants