2017-02-13 55 views
2

Jest,通过JSDom我想,没有document.createRange定义。我如何覆盖或提供这种行为?Mocking document.createRange for jest

我们为我们的定制JSDom +摩卡设置写的版本(所有测试跑前)看起来是这样的:

global.Range = function Range() {}; 

const createContextualFragment = (html) => { 
    const div = document.createElement('div'); 
    div.innerHTML = html; 
    return div.children[0]; // so hokey it's not even funny 
}; 

Range.prototype.createContextualFragment = (html) => createContextualFragment(html); 

// HACK: Polyfil that allows codemirror to render in a JSDOM env. 
global.window.document.createRange = function createRange() { 
    return { 
    setEnd:() => {}, 
    setStart:() => {}, 
    getBoundingClientRect:() => { 
     return { right: 0 }; 
    }, 
    getClientRects:() => [], 
    createContextualFragment, 
    }; 
}; 

有没有提供这开玩笑的方式?

回答

2

创建一个脚本来设置你想要的polyfill--在这个例子中我们称之为“mockument.js”。在你的package.json设置setupFiles的玩笑配置指向这个脚本:

"jest": { 
    "setupFiles": ["raf/polyfill", "./scripts/mockument"] 
} 

如上图所示,你也可以用模块名称(例如raf/polyfill)。

一个件事,这是你可以创建自己的共同初始设置模块的测试和跨需要的功能的几个组件库中使用它们。

"jest": { 
    "setupFiles": ["@nteract/mockument"] 
}, 
+0

效果很好,谢谢! – scniro