Estoy tratando de probar una biblioteca TypeScript-react con jest / @testing-library/react. Cuando importo la lib directamente (el js compilado), las pruebas funcionan, pero recibo una gran advertencia para cada prueba:
console.error Warning: It looks like you're using the wrong act() around your test interactions. Be sure to use the matching version of act() corresponding to your renderer: // for react-dom: import {act} from 'react-dom/test-utils'; // ... act(() => ...); // for react-test-renderer: import TestRenderer from react-test-renderer'; const {act} = TestRenderer; // ... act(() => ...);La biblioteca tiene dependencias en node_modules que no son CommonJS, lo que a menudo es un poco complicado con respecto a la agrupación/transpilación.
Así que creé un paquete web de la biblioteca y todas sus dependencias. Cuando uso el paquete webpack para probar, las advertencias desaparecen.
¿Cómo configuro babel-jest para alcanzar lo mismo que hice con el paquete web? ¿O me equivoco y el error puede tener otra causa?
webpack.config.js:
const path = require('path'); module.exports = { mode: 'production', optimization: { minimize: false }, entry: './lib/index.js', output: { path: path.resolve(__dirname, 'test'), filename: 'webpack-test.js', library: { name: 'webpackTest', type: 'umd', }, globalObject: 'this', }, module: { rules: [ { test: /.ts$/, use: 'ts-loader' }, { test: /.m?js$/, loader: 'babel-loader', exclude: /node_modules/, } ], }, externals: { react: 'react', reactDOM: 'react-dom' } };jest.config.js
module.exports = { transform: { "^.+\\.jsx?$": "babel-jest", "^.+\\.mjs$": "babel-jest", "^.+\\.tsx?$": "ts-jest", }, transformIgnorePatterns: [ // until solved -> transform all (incl. compl. node_modules) ], setupFiles: ["jest-canvas-mock"], testEnvironment: "jsdom", };babel.config.js
module.exports = { presets: [ [ "@babel/preset-env", { targets: { node: "current", }, modules: "cjs", }, ], ["@babel/preset-react", { runtime: "automatic" }], "@babel/preset-typescript", ], };Cualquier ayuda es muy apreciada.