Как я могу проверить функцию на наличие аргументов без проверки их значений, используя jest & энзим в компоненте реакции?

Question

Я хочу протестировать реагирующий компонент, в котором прослушиватель событий onClick находится в родительском элементе <Div>, передавая e.target в качестве аргумента функции onClick.

Я пытался смоделировать щелчок, используя enzyme.simulate и передавая ложную функцию и ложный аргумент следующим образом:

let wrapper, cellClick, e;
beforeEach(() => {
  cellClick = jest.fn();
  e = {
    target: "div"
  };
  wrapper = shallow(<Board onCellClick={cellClick} />);
});

afterEach(() => {
  cellClick.mockReset();
});

it("should call props.cellClick() whith e.target argument", () => {
    wrapper.simulate("click", e.target);
    expect(cellClick.mock.calls[0][0]).toBe(e.target);
});

вот компонент реакции:

import React from "react";
import PropTypes from "prop-types";
import Div from "./styles";

const Board = props => {
  return (
    <Div onClick={e => props.onCellClick(e.target)}>
      <div id="board">
        <div className="square" data-square="0" />
        <div className="square" data-square="1" />
        <div className="square" data-square="2" />
        <div className="square" data-square="3" />
        <div className="square" data-square="4" />
        <div className="square" data-square="5" />
        <div className="square" data-square="6" />
        <div className="square" data-square="7" />
        <div className="square" data-square="8" />
      </div>
    </Div>
  );
};
Board.propTypes = {
  onCellClick: PropTypes.function
};
export default Board;

и вот результаты теста:

 Interaction with the board cells › should call props.cellClick() whith e.target argument

    expect(received).toBe(expected) // Object.is equality

    Expected: "div"
    Received: undefined

      49 |   it("should call props.cellClick() whith e.target argument", () => {
      50 |     wrapper.simulate("click", e.target);
    > 51 |     expect(cellClick.mock.calls[0][0]).toBe(e.target);
         |                                        ^
      52 |   });
      53 | });
      54 | 

      at Object.toBe (components/Board/Board.test.js:51:40)

Я хочу, чтобы метод имитации имитировал фактический щелчок, чтобы у него был объект события, который затем будет содержать дочерний элемент в качестве цели, без использования фиктивного объекта. Или, по крайней мере, я хочу проверить наличие аргумента без проверки его значения.

Answer 1

Похоже, что вы передаете e.target в wrapper.simulate ...

... просто измените это на e, и оно должно работать:

it("should call props.cellClick() whith e.target argument", () => {
  wrapper.simulate("click", e);  // <= pass e
  expect(cellClick.mock.calls[0][0]).toBe(e.target);  // Success!
});