Как смоделировать событие реагирующего компонента, когда в качестве обработчика события используется жирная стрелка? - PullRequest
0 голосов
/ 12 декабря 2018

Я хочу смоделировать событие handleClick моего компонента TodoForm.

TodoForm.jsx

import React, { Component } from "react";

    export class TodoForm extends Component {

        handleClick = () => {
            console.log("handle click is called");
        }

        render() {
            return (
                <div>
                    <button onClick={this.handleClick}>Clik</button>
                </div>
            )
        }
    }

в TodoForm.test.js

import React from 'react'
import { mount, shallow } from 'enzyme'
import { TodoForm } from "../TodoForm";


it("must call the mock function when button is clicked", () => {
    const mocked = jest.fn();
    const wrapper = mount(<TodoForm />);

    wrapper.instance().handleClick = mocked;
    wrapper.update();

    wrapper.find("button").simulate("click");
    expect(mocked).toHaveBeenCalled();


})

тест не пройденс "Ожидается, что фиктивная функция была вызвана, но она не была вызвана."

вместо вызова фиктивной функции она вызывает реальную реализацию.

Я использую create-реагировать-приложение,

Реакция: 16.6.3, фермент: 3.8.0,
Фермент-адаптер-реакция-16: 1.7.1

1 Ответ

0 голосов
/ 12 декабря 2018

Это известная проблема с ферментом .update() не вызывает повторного рендеринга.Это приводит к запуску оригинальной handleClick, потому что функция render была вызвана до насмешки над методом.

Обходной путь должен использовать wrapper.instance().forceUpdate() вместо wrapper.update().

Тестируемость равна одна из нескольких причин , чтобы предпочесть связанные методы прототипа методам экземпляра стрелки.

...