无法在我的 webpack 入口点为事件侦听器成功编写笑话测试
Unable to successfully write jest test for event listener in my webpack entry point
我很难理解为什么我在 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);
但我仍然遇到相同的引用错误。
我在 Udacity 的一位导师的帮助下弄明白了。
我没有意识到导入文件时会执行全局级别的代码。此外,我正在创建 dom 元素,我需要在 jsDOM 中正确地进行测试,但需要在需要我想在我的 .spec.js 文件中测试的函数之前让该代码出现。
问题已解决。
我很难理解为什么我在 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);
但我仍然遇到相同的引用错误。
我在 Udacity 的一位导师的帮助下弄明白了。
我没有意识到导入文件时会执行全局级别的代码。此外,我正在创建 dom 元素,我需要在 jsDOM 中正确地进行测试,但需要在需要我想在我的 .spec.js 文件中测试的函数之前让该代码出现。
问题已解决。