设置jQuery测试与jsdom，摩卡，es2016

Question

我想使用sinon的假服务器来模拟一个摩卡测试中的jQuery调用。但测试总是给出一个错误，如jQuery.post不是一个函数或jQuery未定义。我不清楚如何使用es6/es2015语法将jQuery导入到jsdom中。

这是测试/ setup.js的内容（安装一个jquery NPM封装）

import { jsdom } from 'jsdom'; 
import jQuery from 'jquery'; 

var exposedProperties = ['window', 'navigator', 'document']; 

global.document = jsdom(''); 

global.window = document.defaultView 
Object.keys(document.defaultView).forEach((property) => { 
    if (typeof global[property] === 'undefined') { 
    exposedProperties.push(property); 
    global[property] = document.defaultView[property]; 
    } 
}); 

global.jQuery = jQuery; 

global.navigator = { 
    userAgent: 'node.js' 
}; 

我假定安装固定后，我应该只能够在测试中使用jQuery.post()而不改变有。

大部分设置的配置是从http://airbnb.io/enzyme/docs/guides/jsdom.html

Answer 1

未来当你加载了jQuery，它检测到的全球空间是否是一个窗口。如果是，那么它将自身输出到窗口jQuery和$。如果不是，那么它作为模块值导出的内容是安装函数，您可以在未来的窗口对象上安装jQuery。在你原来的代码中，到了时间import jQuery from 'jquery';，jQuery没有窗口可供使用，所以你得到一个安装函数，你必须使用它来在窗口上安装jQuery，一旦你有了它。

下面是可用的代码。我添加或修改的每条线都被评论。

import { jsdom } from 'jsdom'; 
import _jQuery from 'jquery'; // Modify this to add the underscore. 

var exposedProperties = ['window', 'navigator', 'document']; 

global.document = jsdom(''); 

global.window = document.defaultView 

const jQuery = _jQuery(window); // Add this line. 

Object.keys(document.defaultView).forEach((property) => { 
    if (typeof global[property] === 'undefined') { 
    exposedProperties.push(property); 
    global[property] = document.defaultView[property]; 
    } 
}); 

global.jQuery = jQuery; 

global.navigator = { 
    userAgent: 'node.js' 
}; 

// This should output "function". 
console.log(typeof jQuery.post);