Jest 单元测试中的全局变量答案

【问题标题】：Global variable in Jest Unit TestJest 单元测试中的全局变量
【发布时间】：2016-05-28 19:29:39
【问题描述】：

我是 Jest 的新手，正在尝试为我现有的 React 应用程序编写一些单元测试。我有一个全局变量window.CONFIG，它存储了一些在应用程序的不同位置使用的配置。该变量在登陆 HTML 页面的脚本标签中初始化

现在我正在尝试编写一个依赖于 window.CONFIG 的辅助函数的测试，并且在访问时它总是未定义

代码如下：

config.js

export default window.CONFIG;

app/helper.js

import config from "../config";

export default  {
  getCompanyURL(company) {
    return config.baseUrl + "/companies/" + company.id;
  },
}

_ 测试 _/helpers-test.js

jest.dontMock('../app/helpers.js');

var helper = require('../app/helpers.js').default;

describe('Get company URL', function() {

 it('returns company url with company id appended', function() {
   expect(companies.getCompanyURL({id:     1})).toBe('test_base_url/companies/1');
 });
});

config for Get Company Url 始终未定义。由于未加载浏览器登录页面window.CONFIG 未初始化。如何在 Jest 的单元测试中模拟这个 config 模块？

提前致谢！！

【问题讨论】：

标签： unit-testing global-variables jestjs

【解决方案1】：

我不确定这是否对您有帮助，但您可以将全局变量直接放入您的 package.json

"jest":{
  "globals": {
    "config": {"foo":"bar"}
  }
}

【讨论】：

开箱即用，Create React App 仅支持覆盖这些 Jest 选项： • collectCoverageFrom • coverageReporters • coverageThreshold • coveragePathIgnorePatterns • extraGlobals • globalSetup • globalTeardown • moduleNameMapper • resetMocks • resetModules • snapshotSerializers • transform • transformIgnorePatterns • watchPathIgnorePatterns。 Create React App 目前不支持您的 package.json Jest 配置中的这些选项：，这是我更新 package.json 时得到的，对此有任何想法或是否需要弹出模块

【解决方案2】：

我通过在__mocks__ 目录中创建config.js 的手动模拟来解决这个问题，如下所示：

let configMock = jest.genMockFromModule('../config');
let __mockConfig = {};

__mockConfig.baseUrl = "test_base_url/";

configMock = __mockConfig;

export default configMock;

【讨论】：

你如何访问它 window.config，所以在任何测试用例中如果你把 console.log(window.config.baseUrl) => 将得到“test_base_url/”