Error de relleno de polyfill 'requestAnimationFrame' en las pruebas de Jest

Esto funcionó para mí:

1. Instalar raf

npm install --saveDev raf o yarn add -D raf

1. Añade el polyfill a tu setupFiles en tu jest config en package.json así:

'setupFiles': ['raf/polyfill']

Nota: si tiene otros archivos de instalación en esta matriz, es posible que desee poner raf/polyfill primero.

Si solo necesita rellenarlo para pruebas, entonces realmente no necesita la limitación.

Crea un nuevo archivo con este código:

global.requestAnimationFrame = function (cb) {
    return setTimeout(cb, 0);
};

Agregue ese archivo a la matriz jest/setupFiles en su paquete.json.

Si está utilizando create-react-app, algunas de estas soluciones no funcionarán bien (o en absoluto, en el caso de setupFiles). Lo que funciona bien es crear un archivo en src/setupTests.js y agregar su mock allí:

global.requestAnimationFrame = (cb) => { cb(); };

También puede agregar otras burlas globales allí (por ejemplo, localStorage y navigator.serviceWorker).

Otra solución de trabajo!

La idea es cargar un shim simple antes de cada especificación, usando la propiedad setupFiles en la configuración de jest.

Cree un archivo shim.js (preferiblemente en su directorio raíz) y tenga este código en él:

global.requestAnimationFrame = (callback) => {
    setTimeout(callback, 0);
};

A continuación, es posible que tenga código redundante que reaparezca en todos / la mayoría de sus archivos , y desea ponerlos en un solo archivo y ejecutarlos antes de cada especificación también, para hacer eso:

Crear un archivo setup.js en la raíz dir también. Una buena pieza de código redundante para D. R. Y es el código de configuración del adaptador de enzima react. Pégalo aquí

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

Ahora cree el archivo jest.config.js, para especificar las rutas de los dos archivos

{
    module.exports = {
        "setupFiles": ["<rootDir>shim.js", "<rootDir>setup.js"]
    }
}

N.b.: El archivo de configuración de jest toma json, así que asegúrate de que json está dentro. Además, si sus archivos shim.js y setup.js no están en el mismo directorio que su jest.config.js, ajuste la ruta en consecuencia.

Espero que esto ayude!

Crédito: https://github.com/facebook/jest/issues/4545

Simplemente actualice su react-scripts a la versión 1.0.15 o superior. Ha sido oficialmente arreglado después de esa versión. Ver más detalles en https://github.com/facebook/create-react-app/issues/3199

Buscar en el comentario de gaearon commented on 31 Oct 2017

Resulta que fue porque actualizé enzyme sin actualizar react y react-dom.

React 15.5 trae consigo algunas desaprobaciones que causaron que muchas bibliotecas dependientes también tuvieran que actualizarse. Asegúrese de que está actualizando react, react-dom y compruebe el README de esos paquetes dependientes para las nuevas bibliotecas que tiene que instalar. Por ejemplo, la Enzima 2.8.2 ahora requiere react-addons-test-utils como dependencia.