javascript - 模拟点击文件ReactJS/JSm

因此，我正在为代码添加一些click事件的代码编写测试。我正在使用Jsm，ReactJS和Mocha / Chai设置。我已经在测试中尝试了以下代码:

document.addEventListener('click', function() {
  console.log('test');
});
React.addons.TestUtils.Simulate.click(document);
//also tried React.addons.TestUtils.Simulate.click(document.body);

但是，此代码不会产生我期望的回声。

有没有一种方法可以使用JSm和ReactJS在文档上模拟单击，键入等？

更新

对于尼克的答案，我尝试将以下代码添加到测试中:

document.body.addEventListener('click', function() {
  console.log('test');
});

document.body.click();

我直到没有控制台日志输出。我不确定JSm是否在执行此类操作时遇到问题。

如果我无法对该代码进行单元测试，那很好，已经有一些我现在无法进行单元测试的代码(需要一个真正的DOM才能获取宽度，高度等的代码)，但是我希望能够对大多数代码进行单元测试(并且我对使用PhantomJS进行单元测试不感兴趣)。我的集成测试将涵盖该类型的代码。

UPDATE2

要注意的另一件事是，当我console.log(document);时，我看到对象附加到_listeners的click属性，因此我知道该事件已附加，它似乎没有执行。

最佳答案

更新: document.body.click将在浏览器中运行，但是对于jsdom，您需要手动创建事件:

document.body.addEventListener('click', function() {
  console.log('test');
});

var evt = document.createEvent("HTMLEvents");
evt.initEvent("click", false, true);
document.body.dispatchEvent(evt)

上面的代码在Jest中为我工作，并且也应与“solo” jsdom一起工作。

2018年秋季假期更新🦃

模拟事件的工具已经变得更好。我目前已经改变了使用出色的react-testing-library呈现组件和调度事件的方法:

import {render, fireEvent} from 'react-testing-library'

test('example', () => {
  const handleClick = jest.fn()

  const {getByText} = render(<div><button onClick={handleClick}>Click Me</button></div>)
  fireEvent.click(getByText('Click Me'))

  expect(handleClick).toHaveBeenCalled()
})

尽管我仍然相信使用木偶或硒(或柏树!)之类的端到端测试可以对某些东西实际起作用提供最高的信心，但是这提供了巨大的值(value)，而不会污染手动创建事件的测试。