Jest: Jest обнаружил неожиданный токен в приложении React

У меня такая же проблема.

Здесь та же проблема.

такая же проблема ... немного сложнее, так как я работаю с монорепозиторием.

@fabioSalimbeni @hoaiduyit @mikedloss Я Jest и enzyme ) в монорепозитории Lerna с использованием Babel 7.

Вам нужно использовать новую конфигурацию Babel с babel.config.js если вы работаете в монорепозитории: https://babeljs.io/docs/en/v7-migration.

Это мой babel.config.js для корня монорепо:

module.exports = {
    overrides: [
        {
            test: 'platforms/webApp1',
            extends: 'platforms/webApp1/babel.config.js'
        },
        {
            test: 'platforms/webApp2',
            extends: 'platforms/webApp2/babel.config.js'
        }
    ]
};

Вот как выглядит мой babel.config.js для webApp1 одного из приложений monorepo:

module.exports = {
    env: {
        test: {
            presets: [
                [
                    '@babel/preset-env',
                    {
                        modules: 'commonjs',
                        debug: false
                    }
                ],
                '@babel/preset-flow',
                '@babel/preset-react'
            ],
            plugins: [
                '@babel/plugin-syntax-dynamic-import',
                '@babel/plugin-proposal-class-properties'
            ]
        },
        production: {
            presets: [
                ['@babel/preset-env', { modules: false }],
                '@babel/preset-flow',
                '@babel/preset-react'
            ],
            plugins: [
                '@babel/plugin-syntax-dynamic-import',
                '@babel/plugin-proposal-class-properties'
            ]
        },
        development: {
            presets: [
                ['@babel/preset-env', { modules: false }],
                '@babel/preset-flow',
                '@babel/preset-react'
            ],
            plugins: [
                '@babel/plugin-syntax-dynamic-import',
                '@babel/plugin-proposal-class-properties'
            ]
        }
    }
};

А это конфигурация Jest:

    "jest": {
        "verbose": true,
        "clearMocks": true,
        "collectCoverage": true,
        "setupTestFrameworkScriptFile": "<rootDir>/config/setupTest.js",
        "transform": {
            "^.+\\.js$": "babel-jest"
        },
        "moduleNameMapper": {
            "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
            "\\.(css|scss)$": "<rootDir>/__mocks__/styleMock.js"
        }
    }

setupTest.js выглядит так:

const Enzyme = require('enzyme');
const Adapter = require('enzyme-adapter-react-16');

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

fileMocks.js выглядит так:

module.exports = 'i-am-a-stubbed-file';

styleMocks.js выглядит так:

module.exports = {};

Вам также нужно будет добавить несколько плагинов Babel и версию babel-core как devDependencies в package.json каждого приложения:

        ...
        "@babel/cli": "^7.0.0",
        "@babel/core": "^7.0.0",
        "@babel/plugin-proposal-class-properties": "^7.0.0",
        "@babel/plugin-syntax-dynamic-import": "^7.0.0",
        "@babel/preset-env": "^7.0.0",
        "@babel/preset-flow": "^7.0.0",
        "@babel/preset-react": "^7.0.0",
        "babel-core": "7.0.0-bridge.0",
        "babel-eslint": "^9.0.0",
        "babel-jest": "^23.4.2",
        "babel-loader": "^8.0.2",
        ...
        "jest": "^23.5.0",
        "jest-cli": "^23.5.0",
        ...

Спустя 3 дня я просто узнаю решения этой проблемы.
Для этого есть 2 решения:

Решение 1:

Вы можете изменить имя файла с .babelrc на babel.config.js , и это сработает.

## Решение 2:
Я использую этот способ.
Создайте такой файл преобразования (у меня jest-transforme.js ):

const config = {
  babelrc: false,
  presets: [
    [
      "@babel/env",
      {
        modules: false
      }
    ],
    "@babel/react"
  ],
  plugins: [
    ["@babel/plugin-proposal-decorators", { legacy: true }],
    ["@babel/plugin-proposal-class-properties", { loose: true }],
    "transform-es2015-modules-commonjs"
  ]
};
module.exports = require("babel-jest").createTransformer(config);

Вот мой jest.config.js :

module.exports = {
  collectCoverageFrom: ["src/**/*.{js,jsx,mjs}"],
  testMatch: ["<rootDir>/src/**/__tests__/**/*.{js,jsx,mjs}", "<rootDir>/src/**/?(*.)(spec|test).{js,jsx,mjs}"],
  transform: {
    "^.+\\.(js|jsx|mjs)$": "<rootDir>/config/jest/jest-transformer.js"
  },
  transformIgnorePatterns: ["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$"]
};

И у меня все еще есть свои .babelrc
`` ''
const enviroments = require ("./ env-config.js");

module.exports = {
предустановки: [
[
"следующий / бабель",
{
"preset-env": {
useBuiltIns: "запись"
}
}
]
],
плагины: [
["стилизованные-компоненты", {ssr: true, displayName: true, preprocess: false}],
[
"модуль-резольвер",
{
корень: ["./"]
}
]
],
env: {
dev: {
плагины: [
["преобразовать-определить", окружения],
["модуль-преобразователь", {корень: ["./"]}],
"преобразовать-декораторы-наследие",
"преобразование-класс-свойства"
]
},
строить: {
плагины: [
["преобразовать-определить", окружения],
["модуль-преобразователь", {корень: ["./"]}],
"преобразовать-декораторы-наследие",
"преобразование-класс-свойства"
]
},
производство: {
предустановки: [
[
"minify", // зачем добавлять здесь minify, мы запускаем uglify для всего пакета кода
{
калечить: ложь,
оценить: ложь
}
]
],
плагины: [
["преобразовать-определить", окружения],
["@ babel / plugin-offer-decorators", {legacy: true}],
["@ babel / плагин-предложение-класс-свойства", {свободно: истина}],
["модуль-преобразователь", {корень: ["./"]}]
],
комментарии: ложь,
компактный: правда,
minified: true
}
}
};
`` ''
Надеюсь, это поможет вам, ребята, решить эту проблему. Радость.

@GeorgianSorinMaxim Проблема в том, что мое приложение-шутка игнорирует файл .babelrc , а изменение на babel.config.js решит проблему, но я все равно решил ее, мой ответ выше этого комментария.

спасибо @GeorgianSorinMaxim @hoaiduyit, в конце концов, я решил это, просто создав собственный преобразователь для babel-jest. Никаких других изменений там, где это необходимо.

Похоже, что Babel 7 требует для правильной работы babel.config.js , используйте это вместо babelrc.

babel-jest прежнему полагается на babel-core из Babel 6, если вы хотите использовать Babel 7, вы можете использовать
этот трансформер babel7-jest

babel-jest отлично работает с babel 7, нет необходимости в настраиваемом преобразователе

@SimenB Я переименовал свой .babelrc в babel.config.js но он по-прежнему показывает эту ошибку с неожиданным токеном. Однако он работает с babel7-pre.42. Есть ли еще что-нибудь, что часто упускают? :) Спасибо.

@alexindigo Узнайте, как писать babel.config.js

https://babeljs.io/docs/en/configuration

Да, запуск yarn upgrade --latest устранил проблему :)

@alexindigo @hoaiduyit Как вы вообще узнали это о babel.config.js ? Борясь с той же проблемой и находя твои решения, я думал про себя ... _ "Хммм, это ни за что не сработает, но я все равно попробую." _ Но, конечно же, это сработало. Благодарность

Конфигурация Jest и фермента: добавьте следующий код в package.json

"jest": {
    "testEnvironment": "jsdom",
    "moduleDirectories": [
      "src",
      "node_modules"
    ],
    "moduleNameMapper": {
      "\\.(css|scss)$": "<rootDir>/__mocks__/styleMock.js",
      "\\.(jpg|gif|ttf|eot|svg)$": "<rootDir>/__mocks__/fileMock.js"
    },
    "transform": {
      "^.+\\.(js|jsx)$": "babel-jest",
      ".+\\.(css|styl|less|sass|scss)$": "<rootDir>/node_modules/jest-css-modules-transform"
    },
    "setupTestFrameworkScriptFile": "<rootDir>/setupTests.js",
    "setupFiles": [
      "<rootDir>setup.js"
    ],
    "moduleFileExtensions": [
      "css",
      "scss",
      "js",
      "json",
      "jsx"
    ],
    "testRegex": "\/test\/spec\/.*\\.js$",
    "transformIgnorePatterns": [
      "/node_modules/(?!test-component).+\\.js$"
    ]
  }

Для настройки Enzyme => setup.js

import { configure } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'
configure({ adapter: new Adapter() })

Для setupTestFrameworkScriptFile: setupTests.js global.fetch = require ('jest-fetch-mock')

const { JSDOM } = require('jsdom')
const jsdom = new JSDOM('<!doctype html><html><body></body></html>')
const { window } = jsdom

const exposedProperties = ['window', 'navigator', 'document']
const { document } = new JSDOM('').window
global.document = document
global.window = document.defaultView
global.HTMLElement = window.HTMLElement
global.HTMLAnchorElement = window.HTMLAnchorElement

Object.keys(document.defaultView).forEach(property => {
  if (typeof global[property] === 'undefined') {
    exposedProperties.push(property)
    global[property] = document.defaultView[property]
  }
})

global.navigator = {
  userAgent: 'node.js',
}

просто файлы .tsx сталкиваются с той же проблемой?

просто распространяя новости, Jest v24 был обновлен для внутреннего использования Babel 7, использование babel bridge или babel7-jest больше не требуется
https://twitter.com/i/web/status/1088904207653105664

Я переименовал .babelrc в babel.config.js а также обновился до Babel7, но по-прежнему имеет ту же ошибку, что и раньше. Мой babel.config.js файл:

module.exports = function (api) {
  api.cache(true);

  const presets = ["@babel/preset-env"];

  return {
    presets
  };
}

Я установил @babel/preset-react и добавил его в свой файл babel.config.js . Исправлена ​​ошибка.

Мой babel.config.js файл не обнаруживался babel-jest , потому что я поместил его в каталог __test__ . Я переместил его в верхний каталог, где находился package.json и все

Я решил аналогичную проблему, выполнив следующие действия:

1- добавьте файл настройки фермента и напишите следующее:

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

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

2- добавьте конфигурацию jest в свой package.json следующим образом:

"jest": {
 "setupFilesAfterEnv": [
  "./path to your setup file/setupEnzyme.js"
 ]
}

3- добавьте файл .babelrc к корневому пути и напишите в нем следующее:

{
    "env": {
        "test": {
            "presets": [
                "@babel/preset-env",
                "@babel/preset-react"
            ]
        }
    }
}

4- если вы получили ошибку в ключевом слове "ожидать" в вашем тесте, просто запустите npm install -D chai и импортируйте функцию ожидания в свой тестовый код, например, import { expect } from 'chai';

если вы все еще получаете сообщение об ошибке, попробуйте установить такие зависимости babel npm install -D @babel/core @babel/preset-env @babel/preset-react

надеюсь это поможет.

Спустя 3 дня я просто узнаю решения этой проблемы.
Для этого есть 2 решения:

Решение 1:

Вы можете изменить имя файла с .babelrc на babel.config.js , и это сработает.

Мое решение:

У меня не было файла .babelrc, поэтому я решил, что обратное тоже сработает, и создал файл .babelrc, используя вместо этого предустановленную информацию из babel.config.js. (Создал дополнительный файл, оригинал не переименовал)
При повторном запуске теста я получил новую ошибку: Requires Babel "^7.0.0-0", but was loaded with "6.26.3" .
Я погуглил эту ошибку, и она привела меня сюда . Я выполнил инструкции ( npm install [email protected] ), и теперь тест выполняется и проходит.

просто распространяя новости, Jest v24 был обновлен для внутреннего использования Babel 7, использование babel bridge или babel7-jest больше не требуется
https://twitter.com/i/web/status/1088904207653105664

Обновление до Jest v24 устранило эту проблему для меня :)

получение ошибки unexpected token для

> 10 | const browser; (точка с запятой в конце)

мой package.json

 "dependencies": {
    "@babel/cli": "^7.2.3",
    "@babel/core": "^7.3.4",
    "@babel/register": "^7.0.0",
    "assert": "^1.4.1",
    "chai": "^4.2.0",
    "jest-puppeteer": "^4.0.0",
    "screen-info": "^1.0.1",
    "screenres": "^2.0.1"
  },
  "devDependencies": {
    "@babel/plugin-transform-modules-commonjs": "^7.2.0",
    "@babel/preset-env": "^7.3.4",
    "babel-jest": "^24.5.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-jest": "^24.3.0",
    "jest": "^24.5.0",
    "jest-cli": "^24.5.0",
    "puppeteer": "^1.13.0"
  },
  "jest": {
    "transformIgnorePatterns": [
      "/node_modules/(?!@babel).+\\.js$"
    ],
    "transform": {
      "^.+\\.js?$": "babel-jest"
    }
  },

babel.config.js

module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        targets: {
          node: 'current'
        },
      },
      'jest'
    ]
  ],
  env: {
    test: {
      plugins: ['@babel/plugin-transform-modules-commonjs']
    }
  }
}

Проверено решение hoaiduyit. Это работает. Мне просто нужно добавить babel.config.js, установить babel-jest transform / transpile jest в jest.config.js

Спустя 3 дня я просто узнаю решения этой проблемы.
Для этого есть 2 решения:

Решение 1:

Вы можете изменить имя файла с .babelrc на babel.config.js , и это сработает.

Решение 2:

Я использую этот способ.
Создайте такой файл преобразования (у меня jest-transforme.js ):

const config = {
  babelrc: false,
  presets: [
    [
      "@babel/env",
      {
        modules: false
      }
    ],
    "@babel/react"
  ],
  plugins: [
    ["@babel/plugin-proposal-decorators", { legacy: true }],
    ["@babel/plugin-proposal-class-properties", { loose: true }],
    "transform-es2015-modules-commonjs"
  ]
};
module.exports = require("babel-jest").createTransformer(config);

Вот мой jest.config.js :

module.exports = {
  collectCoverageFrom: ["src/**/*.{js,jsx,mjs}"],
  testMatch: ["<rootDir>/src/**/__tests__/**/*.{js,jsx,mjs}", "<rootDir>/src/**/?(*.)(spec|test).{js,jsx,mjs}"],
  transform: {
    "^.+\\.(js|jsx|mjs)$": "<rootDir>/config/jest/jest-transformer.js"
  },
  transformIgnorePatterns: ["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$"]
};

И у меня все еще есть свои .babelrc

const enviroments = require("./env-config.js");

module.exports = {
  presets: [
    [
      "next/babel",
      {
        "preset-env": {
          useBuiltIns: "entry"
        }
      }
    ]
  ],
  plugins: [
    ["styled-components", { ssr: true, displayName: true, preprocess: false }],
    [
      "module-resolver",
      {
        root: ["./"]
      }
    ]
  ],
  env: {
    dev: {
      plugins: [
        ["transform-define", enviroments],
        ["module-resolver", { root: ["./"] }],
        "transform-decorators-legacy",
        "transform-class-properties"
      ]
    },
    build: {
      plugins: [
        ["transform-define", enviroments],
        ["module-resolver", { root: ["./"] }],
        "transform-decorators-legacy",
        "transform-class-properties"
      ]
    },
    production: {
      presets: [
        [
          "minify", // why add minify here, we run uglify over the whole code bundles
          {
            mangle: false,
            evaluate: false
          }
        ]
      ],
      plugins: [
        ["transform-define", enviroments],
        ["@babel/plugin-proposal-decorators", { legacy: true }],
        ["@babel/plugin-proposal-class-properties", { loose: true }],
        ["module-resolver", { root: ["./"] }]
      ],
      comments: false,
      compact: true,
      minified: true
    }
  }
};

Надеюсь, это поможет вам, ребята, решить эту проблему. Радость.

спасибо за ваш метод ~ этот метод может исправить мою проблему правильно!

Привет, я пробовал несколько вещей в этой теме, но, похоже, ничего не работает. Основная ошибка - странная b / c, она, кажется, указывает на номера строк, которые не имеют смысла, почти как исходный код и фактический код, пытающийся запустить, не совпадают.

Эта ошибка, Jest обнаружил неожиданный токен, остается. Я нахожусь на Jest> 24, без типового скрипта, его приложение для создания реакции было выброшено совсем недавно (6 месяцев назад ~). Очистка кеша и удаление node_modules не помогли. Возможно, кто-то может объяснить, какая именно конфигурация должна быть на месте для правильного преобразования и запуска jest и какие подсказки дает моя точная ошибка ...

FAIL  __e2e__/chat/sms.spec.js
  ● Test suite failed to run

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    /Users/ben/dev/app/webui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js:17
    export default function _asyncToGenerator(fn) {
    ^^^^^^

    SyntaxError: Unexpected token export

       5 |   afterEach(async () => {
       6 |     await logout();
    >  7 | 
         | ^
       8 |     await page.evaluate(() => {
       9 |       localStorage.clear();
      10 |     });

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:471:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:513:25)
      at Object.<anonymous> (__e2e__/chat/sms.spec.js:7:49)

Спасибо вам всем,

Jenkins не работает из-за этой проблемы, есть ли рабочие решения?

Для тех, кто использует Create-React-App, добавление transformignorepatterns в ваш package.json не решит проблему, поскольку при использовании CRA в package.json можно изменить только определенные конфигурации jest.

У меня были проблемы с Jest, собирающим внутреннюю библиотеку, Jest отображал ошибки «неожиданного токена» везде, где у меня был мой импорт из этой библиотеки.

Чтобы решить эту проблему, вы можете изменить свой тестовый сценарий на следующий:
"test": "react-scripts test --transformIgnorePatterns 'node_modules/(?!(<your-package-goes-here>)/)'",

Привет всем, я изо всех сил пытался выполнить модульное тестирование моего небольшого проекта, который называется JetSet и написан на React Native. Я искал 2 дня, чтобы решить эту проблему, и я пытался отредактировать такие вещи, как babel.config.js, удалить этот файл, а затем создать файл .babel (и добавить немного дерьма).

_Сообщение об ошибке:_
D: \ jetset \ JetSetApp> jest SaveData.test.js
FAIL __test __ / SaveData.test.js
● Не удалось запустить набор тестов.

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

Details:

D:\jetset\JetSetApp\node_modules\expo-file-system\build\index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import * as FileSystem from './FileSystem';
                                                                                                ^

SyntaxError: Unexpected token *

  1 | import React, { Component } from 'react'
  2 | import { View, Text, TouchableOpacity, TextInput, StyleSheet } from 'react-native'
> 3 | import { documentDirectory, getInfoAsync, readDirectoryAsync, readAsStringAsync, writeAsStringAsync, deleteAsync } from 'expo-file-system';
    | ^
  4 |
  5 | /**
  6 |  * This class primarily serves to handle files within the phone system so that results can be stored

  at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
  at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
  at Object.<anonymous> (app/resources/SaveData/SaveData.js:3:1)

Наборы тестов: 1 неудачно, всего 1
Тесты: всего 0
Снимки: всего 0
Время: 3,509 с
Выполнить прогон всех наборов тестов, соответствующих /SaveData.test.js/i.

_ babel.config.js _
module.exports = function (api) {
api.cache (правда);
возвращение {
пресеты: ['babel-preset-expo'],
};
};

_ package.json _
{
"main": "node_modules / expo / AppEntry.js",
"scripts": {
"старт": "старт выставки",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"тест": "шутка"
},
"шутка": {
"preset": "react-native"
},
"dependencies": {
"expo": "^ 34.0.1",
"файловая-экспо-система": "^ 6.0.2",
"expo-mail-composer": "^ 6.0.0",
"момент": "^ 2.24.0",
"реагировать": "16.8.3",
"react-dom": "^ 16.8.6",
"react-native": " https://github.com/expo/react-native/archive/sdk-34.0.0.tar.gz ",
"реагировать-родной-жест-обработчик": "^ 1.3.0",
"реагировать-родной-выбор-группа": "^ 1.1.2",
"react-native-web": "^ 0.11.4"
},
"devDependencies": {
"@ babel / core": "^ 7.6.2",
"@ babel / preset-env": "^ 7.6.2",
"babel-jest": "^ 24.9.0",
"babel-preset-expo": "^ 6.0.0",
"шутка": "^ 24.9.0",
"prop-types": "^ 15.7.2",
"реагировать-родная-увольнять-клавиатура": "^ 1.0.0",
"response-native-modal-datetime-picker": "^ 7.5.0",
"реагировать-навигация": "^ 3.12.1"
},
"частный": правда
}

К вашему сведению, я думаю, что мы в конечном итоге нашли действительно глупое решение для этого, например, вся система сборки плохо себя вела, если не был установлен NODE_ENV = "test".

В более новых версиях React Jest встроен, поэтому в package.json тестовый скрипт должен быть
"test": "react-scripts test"
вместо того
"test": "jest"

В более новых версиях React Jest встроен, поэтому в package.json тестовый скрипт должен быть
"test": "react-scripts test"
вместо того
"test": "jest"

Большое спасибо, что проблема для меня решена!

Попробовав МНОГО, проблема для меня:
отсутствует "transform-es2015-modules-commonjs", в файле .babelrc

{
  "presets": ["next/babel"],
  "plugins": [
    ["styled-components", { "ssr": true, "displayName": true, "preprocess": false } ],
    "transform-flow-strip-types",
    "jsx-control-statements",
    "import-glob",
    "transform-es2015-modules-commonjs",
    [
      "import",
      {
        "libraryName": "antd",
        "style": "css"
      }
    ]
  ]
}

"шутка": "^ 24.9.0",
"babel-jest": "23.6.0",

Попробуй обновить свою шутку и бабел-шутку

Я переименовал .babelrc в babel.config.js а также обновился до Babel7, но по-прежнему имеет ту же ошибку, что и раньше. Мой babel.config.js файл:

module.exports = function (api) {
  api.cache(true);

  const presets = ["@babel/preset-env"];

  return {
    presets
  };
}

Я установил @babel/preset-react и добавил его в свой файл babel.config.js . Исправлена ​​ошибка.

это устранило мою проблему, я установил @ babel / preset-env и добавил в babel.config.js, и он исправил

спасибо @jmayergit

Я изменил файл babel.rc на файл babel.config.js, но у меня он не работал. Затем я увидел этот ответ: https://stackoverflow.com/questions/58470062/test-jest-with-babel-plugin-import
Если у вас есть плагины импорта, разделите плагины для тестовой среды, среды разработки и производственной среды.

Мой файл babel.config.js теперь выглядит так, и он работает:

module.exports = {
  presets: [
    [
      'next/babel',
    ],
  ],
  env: {
    test: {

    },
    dev: {
      plugins: [
        ['import', { libraryName: 'antd', style: 'css' }],
      ],
    },
    production: {
      plugins: [
        ['import', { libraryName: 'antd', style: 'css' }],
      ],
    },
  },
};

Я тоже борюсь с этой ошибкой с 5 дней

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".   

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    SyntaxError: C:\Users\SK-PC\Desktop\React-Course\expansify\src\test\components\MyNavbar.test.js: Unexpected token (5:28)

      3 | import { MyNavbar } from '../../components/MyNavbar'
      4 | test("Should return MyNavbar component", () => {
    > 5 |     const wrapper = shallow(<MyNavbar />)
        |                             ^
      6 |     expect(wrapper.find('.navbar-brand').find('kbd').text()).toBe("Expensify")
      7 |     // const renderer = new ReactShallowRenderer()
      8 |     // renderer.render(<MyNavbar />)

      at Parser._raise (node_modules/@babel/parser/src/parser/location.js:241:45)
      at Parser.raiseWithData (node_modules/@babel/parser/src/parser/location.js:236:17)
      at Parser.raise (node_modules/@babel/parser/src/parser/location.js:220:17)
      at Parser.unexpected (node_modules/@babel/parser/src/parser/util.js:149:16)
      at Parser.parseExprAtom (node_modules/@babel/parser/src/parser/expression.js:1144:20)
      at Parser.parseExprSubscripts (node_modules/@babel/parser/src/parser/expression.js:539:23)
      at Parser.parseMaybeUnary (node_modules/@babel/parser/src/parser/expression.js:519:21)
      at Parser.parseExprOps (node_modules/@babel/parser/src/parser/expression.js:311:23)
      at Parser.parseMaybeConditional (node_modules/@babel/parser/src/parser/expression.js:263:23)
      at Parser.parseMaybeAssign (node_modules/@babel/parser/src/parser/expression.js:211:21)

 PASS  src/test/reducers/filters.test.js

Test Suites: 1 failed, 5 passed, 6 total
Tests:       29 passed, 29 total
Snapshots:   0 total
Time:        12.144s
Ran all test suites.

@fullstacksk

В более новых версиях React Jest встроен, поэтому в package.json тестовый скрипт должен быть
"test": "react-scripts test"
вместо того
"test": "jest"

Вы можете прочитать документ по адресу:
https://jestjs.io/docs/en/tutorial-react
https://create-react-app.dev/docs/running-tests/#docsNav

@ catmans1
Я не устанавливал зависимости, такие как create-response-app или react-scripts.
Это будет работать?
"test": "react-scripts test"
вместо того
"test": "jest"

Теперь он работает, когда я использовал babel-preset-jest для тестирования опции с env и react. Я снял babel-jeast.

Сработало для меня: включить «@ babel / preset-response» в babel.config.js

https://medium.com/@audreyhal/how -to-resolve-jest-error-with-create-react-app-part-1-80f33aa1661a

Я увидел эту ошибку после глупой ошибки и написания моего первого тестового файла с расширением .ts вместо .tsx . Далеко от исходной проблемы, но я думаю, что это может быть полезно для кого-то 😄