TypeError: Невозможно вызвать класс как функцию при запуске Jest-теста

Question

В простой настройке, чтобы приступить к тестированию компонентов React с помощью Jest, я получаю сообщение об ошибке «Ошибка типа: невозможно вызвать класс как функцию» при каждом запуске теста с npm test

. Реальная страница React прекрасно работает и рендерится без ошибок.

Я просматривал другие посты, связанные с этой ошибкой, но ни один, который может помочь с этой проблемой, не относится к Jest.

Спасибо всем, кто может помочь.

Вот мои настройки:

package.json

{
  "name": "test-bed",
  "main": "index.js",
  "dependencies": {
    "react": "^16.10.2",
    "react-dom": "^16.10.2"
  },
  "devDependencies": {
    "babel-jest": "^24.9.0",
    "jest": "^24.9.0",
    "react-test-renderer": "^16.10.2",
    "@babel/core": "^7.1.2",
    "@babel/plugin-proposal-class-properties": "^7.1.0",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.4",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "html-webpack-plugin": "3.2.0",
    "webpack": "4.22.0",
    "webpack-cli": "3.1.2",
    "webpack-dev-server": "3.1.10"
  },
  "scripts": {
    "start": "webpack-dev-server --mode development",
    "build": "webpack --mode production",
    "test": "jest"
  }
}

src / index.js

import React from 'react';
import ReactDOM from 'react-dom';
import TestComponent from './components/TestComponent';

ReactDOM.render(<TestComponent />, document.getElementById('app'));

src / components / TestComponent.js

export default class TestComponent extends React.Component {

    render() {
        return (
            <p>I'm v0.0.1 of TestComponent</p>
        )
    }
}

__ tests __ / test-component.snapshot.test.js

import React from 'react';
import renderer from 'react-test-renderer';

import TestComponent from '../src/components/TestComponent';

TestComponent('should display component version', () => {
    const comp = renderer.create(<TestComponent/>);
    let tree = comp.toJSON();
    expect(tree).toMatchSnapshot();
});

Answer 1

Проблема заключается в следующем:

TestComponent('should display component version', () => {
    const comp = renderer.create(<TestComponent/>);
    let tree = comp.toJSON();
    expect(tree).toMatchSnapshot();
});

Это интерпретирует это как желание вызвать функцию TestComponent()

Измените ее на что-то вроде:

describe('TestComponent', () => {
  it('should display component version', () => {
    const comp = renderer.create(<TestComponent/>);
    let tree = comp.toJSON();
    expect(tree).toMatchSnapshot();
  });
})