window.cancelAnimationFrame is not a function

[atinux]

I was testing nuxt with jsdom and it does not work anymore because of vue-meta and it's use of requestAnimationFrame, futhermore it is not supporter in IE < 10

What do you think to polyfill it with https://www.npmjs.com/package/raf?

[atinux]

But this will do the work as well: https://gist.github.com/paulirish/1579671

[zspecza]

@atinux aware of the issue - I'm not keen on including an entire polyfill just for the sake of a utility function. Polyfills belong in user-land - what if my polyfill overwrites another polyfill in some other random library being used on the same webpage? Things would break.

I am happy however to just fallback on setTimeout:

// uncomment this to see that it still works
// window.cancelAnimationFrame = undefined
// window.requestAnimationFrame = undefined

const stopUpdate = window.cancelAnimationFrame || window.clearTimeout
const startUpdate = window.requestAnimationFrame || ((cb) => window.setTimeout(cb, 0))

function batchUpdate (id, callback) {
  stopUpdate(id)
  return startUpdate(() => {
    id = null
    callback()
  })
}

var id = null
var i = 0
var len = 100

for (; i < len; i++) {
  id = batchUpdate(id, () => {
    console.log('foo')
  }) 
}

// "foo" is logged once

I will be back in full force on this tomorrow - I know I said today, but I've been experiencing downtime on many sites here in SA, Github included

[atinux]

It's even better to fallback with setTimeout 👍🏻