无法在我的 webpack 入口点为事件侦听器成功编写笑话测试

Question

我很难理解为什么我在 Jest 中的一项测试失败了。

测试本身只是为了看看我是否可以获得任何针对从我的 webpack 入口点导出的函数的测试，所以我选择了我能找到的最简单的匹配器。奇怪的是，只要我在我的 webpack 入口点中定义的函数（它将事件侦听器附加到作为参数传入的元素）未被调用，测试就会通过。

但是，如果调用函数时传入一个元素，则测试会失败并出现引用错误。我在我的 repo 中包含一个 link，你所要做的就是 npm install 然后 npm test 以查看测试是否通过，然后进入 src/client/index.js 并取消注释最后一行代码在打开事件侦听器的底部，您将收到与我收到的相同的错误消息。

我完全迷路了。我觉得我需要做更多的事情来设置 jsdom 环境，但对于我的生活，我无法弄清楚那是什么。我正在从事的项目是我的 Udacity 课程工作的一部分，因此您可能认为他们会包含一些关于如何使用 webpack 设置 jest 的视频，但什么也没有。他们提供的学生导师甚至没有使用过 jest，所以他们除了向我指出我已经阅读的文档外，无法帮助我。

编辑：我尝试手动将元素添加到 jsdom，如下所示：


const element = document.createElement('div');
element.id = 'results';
document.body.appendChild(element);

但我仍然遇到相同的引用错误。

Answer 1

我在 Udacity 的一位导师的帮助下弄明白了。

我没有意识到导入文件时会执行全局级别的代码。此外，我正在创建 dom 元素，我需要在 jsDOM 中正确地进行测试，但需要在需要我想在我的 .spec.js 文件中测试的函数之前让该代码出现。

问题已解决。

无法在我的 webpack 入口点为事件侦听器成功编写笑话测试

Unable to successfully write jest test for event listener in my webpack entry point

node.js

unit-testing

webpack

jestjs

testcase