FormidableLabs / jest-next-dynamic

Resolve Next.js dynamic import components in Jest tests
MIT License
69 stars 7 forks source link

Not working with next 10.2.0 #25

Open correttojs opened 3 years ago

correttojs commented 3 years ago

hi, it seems the latest nextjs update (10.2.0) doesn't support this solution anymore

pedroct92 commented 3 years ago

We just upgraded to nextjs 10.2.0 and We are experiencing issues too!

Here is the execution error:

` ● Test suite failed to run

/repos/xx/DynamicXx.jsx: The "from" argument must be of type string. Received undefined

  at Import (node_modules/next/build/babel/plugins/react-loadable-plugin.ts:154:21)
  at NodePath._call (node_modules/@babel/traverse/lib/path/context.js:55:20)
  at NodePath.call (node_modules/@babel/traverse/lib/path/context.js:42:17)
  at NodePath.visit (node_modules/@babel/traverse/lib/path/context.js:92:31)
  at TraversalContext.visitQueue (node_modules/@babel/traverse/lib/context.js:116:16)
  at TraversalContext.visitSingle (node_modules/@babel/traverse/lib/context.js:85:19)
  at TraversalContext.visit (node_modules/@babel/traverse/lib/context.js:144:19)
  at Function.traverse.node (node_modules/@babel/traverse/lib/index.js:82:17)

`

@exogen could you guide us on what to do ?

stscoundrel commented 3 years ago

Related issue in Next.js repo: https://github.com/vercel/next.js/issues/24566

correttojs commented 3 years ago

it seems the next/dist/build/babel/plugins/react-loadable-plugin.js is causing the issue. I created a separate babel test config which doesn't include the next/babel preset

tvthatsme commented 3 years ago

@correttojs what does your separate babel test config look like? I tried but couldn't get it working.

correttojs commented 3 years ago
module.exports = (api) => {
    const isTest = api.env('test');
    api.cache(true);
    if (isTest) {
        return {
            presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'],

            env: {
                test: {
                    presets: [['@babel/preset-env', { targets: { node: 'current' } }]],
                },
            },
        };
    }

    return {
        presets: ['next/babel'],
    };
}
tvthatsme commented 3 years ago

@correttojs thanks! Yeah, that works perfectly. I forgot that you could have the export be a function that returns the object, but makes sense ❤️