Question

我使用karma和mocha以及React的TestUtils来测试React应用程序。我测试的其中一个组件使用以下导出导入模块：

export const OPTIONS = window.__OPTIONS__;

在我的测试中，我将组件渲染到业力中的虚拟chrome浏览器中。我通过以下方式做到这一点： let tree = TestUtils.renderIntoDocument(<Component />);

＆＃34;组件＆＃34;的渲染功能引用类似OPTIONS.someOption的内容，当上述测试运行时，它会爆炸并说cannot read property 'someOption' of undefined.

我试过嘲笑＆＃39; __OPTIONS__函数中的before()变量（在测试运行之前设置它的值），但即使在将其记录下来并且看到它实际上已经设置之后，它的值也在我的组件模块仍未定义。因此，似乎webpack在我的任何测试脚本实际运行之前捆绑了模块，因此它总是未定义。

有没有办法让window.__OPTIONS__设置为某个值，就好像它包含在我页面顶部的<script>window.__OPTIONS__ = {};</script>中，因此在我的组件模块中使用值正确导入？

我不想了解为什么我要将变量附加到窗口对象，因为在这种情况下我无法避免这种情况......它＆＃39 ; sa Salesforce的具体原因。如果我可以完全避免使用该变量，我会。

Answer 1

尝试在__OPTIONS__中使用beforeEach向全局添加窗口对象：

beforeEach(function() {
    global.window = {
        __OPTIONS__: {}
    };
});

Answer 2

我尝试了global路线，但无济于事......窗口已经定义，因为业力正在激活Chrome浏览器。在弄乱了不同区域的日志后，我确认操作的顺序是1.模块被捆绑2.测试脚本运行。我在我的组件中的import语句下面直接添加了一个日志，然后在我的测试脚本的第一行添加了一个日志，导入后的日志总是先报告未定义。

考虑到这一点，我备份了一步并查看了tests.webpack.js，它位于我的karma配置文件中的files和preprocessors（webpack）中。我在var context = require.context('./src', true, /-test\.jsx?$/);行和context.keys().forEach(context);行上方添加了变量声明，现在工作正常。

如何在karma / mocha测试套件中模拟窗口对象属性？

2 个答案: