Porting a JavaScriptAnimFrame request to TypeScript

Question

I'm stuck right now trying to port this code to TypeScript.

if (typeof window !== 'undefined') { window.requestAnimFrame = (function(callback){ return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback){ window.setTimeout(callback, 1000 / 60, new Date().getTime()); }; })(); } 

Tsc error:

the parameters provided do not match any signature of the target

I tried declaring an interface WindowEx extends Window containing the signatures, and then switched to (< WindowEx>window).xxx , but I doubt that this is the correct way to convert this "typical" code.

Attempt:

 interface WindowEx extends Window { requestAnimFrame(callback, target?):number; webkitRequestAnimationFrame(callback, target?):number; mozRequestAnimationFrame(callback, target?):number; oRequestAnimationFrame(callback, target?):number; // msRequestAnimationFrame already at WindowAnimationTiming interface } 

Answer 1

Here is what I did to get the code to compile. I just defined requestAnimFrame() as global and typed it so that TypeScript can check it. There is no great way to extend built-in types such as window at the moment, therefore, things like (<any>window).webkitRequestAnimationFrame need to be done. Generally, if the compiler complains and you know its valid JavaScript, you can always use <any> to make it work.

 var requestAnimFrame: (callback: () => void) => void = (function(){ return window.requestAnimationFrame || (<any>window).webkitRequestAnimationFrame || (<any>window).mozRequestAnimationFrame || (<any>window).oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback){ window.setTimeout(callback, 1000 / 60, new Date().getTime()); }; })(); 

Answer 2

The reason the supplied parameters do not match the signature of the target call is because you call this function:

 (function(callback) { ... })(); 

That is, the function accepts a callback , but you do not pass it.

You must remove the callback as a parameter because you are not using it anywhere in the function.