如何从CDN注入外部JS到Jest单元测试

Question

我有一个react应用，使用npm和webpack。我正在尝试添加单元测试。

我使用jQuery从CDN包含在我的index.html，而不是使用节点模块。

我在组件Test1中使用jQuery，我添加了单元测试用例。

现在，当我执行测试用例时，我得到错误说 ReferenceError: $ is not defined 我明白，Jest是无法解决它，因为我没有导入jQuery导入组件。

问题是，如何让Jest知道外部JS?

Answer 1

我们可以使用"setupFiles"配置来允许Jest在开始执行测试之前执行所需的所有脚本/库/模块。

创建并添加一个文件到"setupFiles": ["path/to/setup.js"]，并包含你的库。

例如,

global.jQuery = global.$ = require('path/to/jQuery')

请在Jest github repo上找到我的查询。

Answer 2

有几种方法可以实现这一点。我更喜欢使用Require.js，尽管您可能已经在使用另一个打包器，如Browserify或webpack，它也应该可以工作。下面是一个快速入门Require.js的示例项目。简而言之，用您的CDN文件设置Require.js，在您的前端引用捆绑的结果，将Require.js钩子到您的测试中，然后require()它们，就像您做其他节点模块一样。