I have set up all my Jest configurations with Babel, but I am unable to run the tests as it keeps showing the same error. My project is using Next.js and TypeScript along with styled-components.
FAIL src/components/Main/main.spec.tsx
● Test suite failed to run
Jest encountered an unexpected token
Jest failed to parse a file due to non-standard JavaScript syntax or incorrect configuration. By default, Jest supports Babel for transforming files based on your Babel setup.
If you are trying to use ECMAScript Modules, refer to https://jestjs.io/docs/ecmascript-modules.
For TypeScript setup, see https://jestjs.io/docs/getting-started#using-typescript.
To transform files in the "node_modules" folder, specify custom "transformIgnorePatterns" in your config.
For mocking non-JS modules, use the "moduleNameMapper" config option.
More details and examples of custom transformations can be found in the docs:
https://jestjs.io/docs/configuration
For custom transformations, visit:
https://jestjs.io/docs/code-transformation
Details:
C:\teste next\mks-sistemas\public\assets\cartImage.png:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){PNG
SyntaxError: Invalid or unexpected token
1 | import React from "react";
2 | import * as S from "./styles";
> 3 | import iconCart from "../../../public/assets/cartImage.png";
| ^
4 | import Image from "next/image";
Snapshots: 0 total Time: 3.841 s Ran all test suites. error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.enter image description here
Despite following multiple configuration tutorials, none of them seem to work for me. It seems like Jest is encountering errors from pages containing SVGs, even though I have specified the test folder correctly.