Hey there, I've been pondering over this issue for the past few days. It appears to be a common error with multiple solutions.
I'm facing the dreaded:
Jest encountered an unexpected token
/__tests__/index.test.js:16
import React from "react";
^^^^^^
SyntaxError: Cannot use import statement outside a module
at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1796:14)
I've gone through several posts and the documentation in Next.js and Jest. package.json:
{
"name": "some-app",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",
"test": "jest --watch"
},
...
}
index.test.js:
import { render, screen } from '@testing-library/react'
import Home from '../pages/index'
import '@testing-library/jest-dom'
import React from "react";
describe('Home', () => {
it('renders a h', () => {
render(<Home />)
const link = screen.getByRole('link', {
name: "Library",
})
expect(link).toHaveAttribute('href', '/storage-area')
})
});
jest.config.js:
...In the title of my post, it seems like the error message indicates that the import is being added by Next.js at the end of index.test.js.