Ошибка запуска теста снимка Jest с использованием настраиваемого сериализатора снимков - jest-styled-components - PullRequest
Новая
       47

Ошибка запуска теста снимка Jest с использованием настраиваемого сериализатора снимков - jest-styled-components

0 голосов
/ 17 января 2020

У меня есть приложение реагирования, созданное с помощью Create-React-app. Я пытаюсь добавить модульный тест для одного из компонентов с помощью встроенного теста снимка. Наряду с обычными подозреваемыми, у меня есть styled-components, jest-styled-components и Prettier, установленные как зависимости dev. Я добавил 'jest-styled-components' как snapshotSerializer в свою конфигурацию jest в пакете. json.

Я получаю следующую ошибку при запуске модульного теста - 

    PrettyFormatPluginError: plugins[p].test is not a functionTypeError: plugins[p].test is not a function

  15 |   );
  16 | 
> 17 |   expect(container).toMatchInlineSnapshot();
     |                     ^
  18 | });
  19 | 
  20 | test("it renders empty cart message", () => {

  at findPlugin (node_modules/pretty-format/build/index.js:343:22)
  at prettyFormat (node_modules/pretty-format/build/index.js:523:22)
  at Object.toMatchInlineSnapshot (node_modules/expect/build/index.js:342:33)
  at Object.<anonymous> (src/components/cart-dropdown/__tests__/cart-dropdown.js:17:21)

Я не могу понять, что происходит не так. Пожалуйста, помогите. 

// package.json
...
"devDependencies": {
        "@testing-library/dom": "^6.11.0",
        "@testing-library/jest-dom": "^5.0.0",
        "@testing-library/react": "^9.4.0",
        "jest-styled-components": "^7.0.0",
        "prettier": "^1.19.1"
      },
      "jest": {
        "snapshotSerializers": [
          "jest-styled-components"
        ]
      }

// unit test
import React from "react";
import { render } from "@testing-library/react";
import CartDropdown from "../cart-dropdown";

test("it renders", () => {
  const mockHistory = jest.fn();
  const mockDispatch = jest.fn();

  const { container, debug } = render(
    <CartDropdown
      cartItems={[]}
      history={mockHistory}
      dispatch={mockDispatch}
    />
  );

  expect(container).toMatchInlineSnapshot();
});

1 Ответ

0 голосов
/ 20 января 2020

Удаление записи snapshotSerializers из конфигурации jest и добавление импорта jest-styled-components в тестовый файл решило эту проблему. 

// unit test
import React from "react";
import { render } from "@testing-library/react";
import CartDropdown from "../cart-dropdown";

//add the below and remove entry for snapshotSerializers in jest config
import 'jest-styled-components'

test("it renders", () => {
  const mockHistory = jest.fn();
  const mockDispatch = jest.fn();

  const { container, debug } = render(
    <CartDropdown
      cartItems={[]}
      history={mockHistory}
      dispatch={mockDispatch}
    />
  );

  expect(container).toMatchInlineSnapshot();
});
...