如何在单元测试环境中模拟browserHistory？

Question

我正在尝试使用react-router的browserHistory来测试React组件。为了确保获得browserHistory我使用createMemoryHistory（反应路由器）模块是这样的：

let createMemoryHistory = require('react-router/lib/createMemoryHistory'); 

在测试ENV我正在JSDOM库的优势。

然后我试图创造了历史对象分配给DOM：

let history = createMemoryHistory(); 
global.history = history; 

虽然在测试环境中呈现组件，我收到以下错误：

Invariant Violation: Browser history needs a DOM

任何想法如何克服它？

Answer 1

您需要模拟browserHistory对象。您可以使用sinon来创建间谍或存根，以帮助您测试此功能。

例如：

随着spy

const { createBrowserHistory } = require('history'); 

const history = createBrowserHistory(/* ... */); 

sinon.spy(history, "push"); 

// now you should be able to run assertions on history.push 

assert(history.push.calledOnce) 

更多关于spy和stub

http://sinonjs.org/releases/v4.1.6/spies/

http://sinonjs.org/releases/v4.1.6/stubs/