ReferenceError: requestAnimationFrame is not defined

[abharvey]

I have just updated to 2.9.10 and now get this error when running tests in Jest.

ReferenceError: requestAnimationFrame is not defined

  at FlipMove.animateChild (node_modules/react-flip-move/lib/FlipMove.js:376:7)
  at node_modules/react-flip-move/lib/FlipMove.js:82:15
  at Array.forEach (native)
  at FlipMove._this.runAnimation (node_modules/react-flip-move/lib/FlipMove.js:79:23)
  at FlipMove.componentDidUpdate (node_modules/react-flip-move/lib/FlipMove.js:222:14)
  at measureLifeCyclePerf (node_modules/react-dom/lib/ReactCompositeComponent.js:75:12)
  at node_modules/react-dom/lib/ReactCompositeComponent.js:729:11
  at CallbackQueue.notifyAll (node_modules/react-dom/lib/CallbackQueue.js:76:22)
  at ReactReconcileTransaction.close (node_modules/react-dom/lib/ReactReconcileTransaction.js:80:26)
  at ReactReconcileTransaction.closeAll (node_modules/react-dom/lib/Transaction.js:206:25)
  at ReactReconcileTransaction.perform (node_modules/react-dom/lib/Transaction.js:153:16)
  at ReactUpdatesFlushTransaction.perform (node_modules/react-dom/lib/Transaction.js:140:20)
  at ReactUpdatesFlushTransaction.perform (node_modules/react-dom/lib/ReactUpdates.js:89:32)
  at Object.flushBatchedUpdates (node_modules/react-dom/lib/ReactUpdates.js:172:19)
  at ReactDefaultBatchingStrategyTransaction.closeAll (node_modules/react-dom/lib/Transaction.js:206:25)
  at ReactDefaultBatchingStrategyTransaction.perform (node_modules/react-dom/lib/Transaction.js:153:16)
  at Object.batchedUpdates (node_modules/react-dom/lib/ReactDefaultBatchingStrategy.js:62:26)
  at Object.batchedUpdates (node_modules/react-dom/lib/ReactUpdates.js:97:27)
  at node_modules/react-dom/lib/ReactTestUtils.js:348:18
  at ReactWrapper.<anonymous> (node_modules/enzyme/build/ReactWrapper.js:776:11)
  at ReactWrapper.single (node_modules/enzyme/build/ReactWrapper.js:1421:25)
  at ReactWrapper.simulate (node_modules/enzyme/build/ReactWrapper.js:769:14)

[kentcdodds]

I ran into this as well. I'm assuming this is because react-flip-move recently moved to requestAnimationFrame (or removed their polyfill). You could argue that this should have been a major version bump (which I believe it should have been). But in any case, you should probably be polyfilling this API anyway for your app. And In tests (like with Jest), I'm pretty sure this would be sufficient: window.requestAnimationFrame = setImmediate

[joshwcomeau]

Hmmm... So Flip Move has been using requestAnimationFrame from the beginning, and we've never polyfilled it (the compatibility table in the README takes this into account).

Super strange that 2.9.10 caused Jest tests to fail - that change just restricted the number of console warnings to 1 per type.

So for me, the mystery isn't why the error is being thrown (since, as @kentcdodds points out, I think this is a bring-your-own-polyfill type situation), it's why it wasn't being thrown previously.

Will dig into this a bit and see what I can figure out!

[kentcdodds]

Thanks @joshwcomeau! Really strange this started happening. I haven't upgraded Jest yet, so I don't expect it to be that...

[abharvey]

@joshwcomeau Very interesting. I started on 2.9.1 and reverted to it for now. When I have some more time I'll investigate further on what else could change in that regard. I will try @kentcdodds fix asap and let you know what happens

[kentcdodds]

My polyfill didn't really quite do it, I ended up just using this

[joshwcomeau]

Going to close this issue, as it doesn't seem to be affecting users on a wide scale. Still very mysterious to me!

If anyone experiences this issue, please reopen. Additionally, if anyone learns more about this, please share!