React Jest Testing onSubmit

Question

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

У меня есть файл с добавлением в корзину, который отображает форму с кнопкой внутри нее. Кнопка является еще одним компонентом, поэтому я не хочу ее проверять. Я должен проверить функцию onSubmit для формы. Есть предположения? Рекомендации?

Вот мой код до сих пор для теста:

describe('AddToCart',() => { 
    const React = require('react'); 
    const BaseRenderer = require('react/lib/ReactTestUtils'); 
    const Renderer = BaseRenderer.createRenderer(); 
    const ReactTestUtils = require('react-addons-test-utils'); 
    const AddToCart = require('../index.js').BaseAddToCart; 

    it('Will Submit',() => { 
    formInstance = ReactTestUtils.renderIntoDocument(<AddToCart product="" quantity=""/>); 
    expect(ReactTestUtils.Simulate.onSubmit(formInstance)).toBeCalled(); 
    }); 
}); 

Я получаю эту ошибку:

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. 

Answer 1

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

Кроме того, я провел выборочный тест, который проверяет функцию Submit в компоненте LogIn.

import React from 'react'; 
import {shallow} from 'enzyme'; 
import LogIn from './LogIn'; 

describe('<LogIn />',() => { 
    const testValues = { 
     username: 'FOO', 
     password: 'BAZ', 
     handleSubmit: jest.fn(), 
    }; 

    it('Submit works',() => { 

     const component = shallow(
      <LogIn {...testValues} /> 
     ); 
     component.find('#submitButton').simulate('click'); 
     expect(testValues.handleSubmit).toHaveBeenCalledTimes(1); 
     expect(testValues.handleSubmit).toBeCalledWith({username: testValues.username, password: testValues.password}); 
    }); 
});