通过删除操作员测试Redux-Observable Epic



具有以下redux-observable epic:

export const mouseEventEpic = (action$, store) =>
	action$
		::filter(action => action.type === MOUSE_OUT || action.type === MOUSE_OVER)
		::debounceTime(200)
		::map(action => getMappedAction(action, store));
const getMappedAction = (action, store) => {
	switch (action.type) {
      case MOUSE_OVER:
        return {type: "OVER"};
      case MOUSE_OUT:
        return {type: "OUT"};
	}
};

和以下测试

import { expect } from 'chai';
import configureMockStore from 'redux-mock-store';
import { createEpicMiddleware } from 'redux-observable';
import { mouseEventEpic } from '...';
    
const epicMiddleware = createEpicMiddleware(mouseEventEpic );
const mockStore = configureMockStore([epicMiddleware]);
describe('Epic...', () => {
	let store;
	beforeEach(() => {
		store = mockStore({});
	});
	it('test...', () => {    
		store.dispatch({type:'MOUSE_OVER'});    
		expect(store.getActions()).to.deep.equal([]);
	});
});

store.getactions()返回一个带有一个动作的数组 - "鼠标_over"。而在删除调试时,它会返回另一个(和预期的)动作 - "超过"。
我想在测试中暂停/删除调试操作员。试图使用Sinon Stub功能遵循此链接中的想法。
关于如何嘲笑RXJS操作员或特别是访问/油门的一些指南将不胜感激。
使用React,Mocha,Chai,酶...

谢谢

有很多方法,一种是将其固定,但是它必须在开始之前呼叫并固定它不会做任何事情(这可能是您尝试时发生的)。

我相信您需要将中间件/商店创建逻辑移至 beforeEach中,然后将debounceTime固定在其中,

至于如何存根,使用Sinon的一个示例是:

// inside `beforeEach()`
const debounceTime = sinon.stub(
  Observable.prototype, 'debounceTime',
  function () {
    // returning the upstream Observable which
    // means debounceTime is now effectively a
    // a pass through (does nothing)
    return this;
  }
);
// example inside a test
assert(debounceTime.withArgs(200).calledOnce);
// later, probably in `afterEach()`
debounceTime.restore();

我的第二次尝试。看来该存根从未打电话给(如果有的话),以后再召唤。同样,如果删除:: debouncetime(200)行,一切都很好。

let sandbox, debounceTime, epicMiddleware, mockStore, store;
beforeEach(() => {
    sandbox = sinon.sandbox.create();
    debounceTime = sandbox.stub(
        Observable.prototype, 'debounceTime',
        () => {             
            console.log('-----------------inside debounce stub') //never called...
            return this;
        }
    );
    epicMiddleware = createEpicMiddleware(combineEpics(stackedOverTimeMouseEventEpic));
    mockStore = configureMockStore([epicMiddleware]);
    store = mockStore({});
});
afterEach(() => {
    epicMiddleware.replaceEpic(stackedOverTimeMouseEventEpic);
    debounceTime.restore();
    sandbox.restore();
});
it('Epic...', () => {
    const ret = store.dispatch({"type": "MOUSE_OVER"});     
    // expect(debounceTime.withArgs(200).calledOnce).to.be.true;    //returns false
    expect(store.getActions()).to.deep.equal([]);                   //returns [{"type": "MOUSE_OVER"},{"type": "@@redux-observable/EPIC_END"}]
});

最新更新