如何使用 Jest 和 Sinon 测试 Thunk 动作

Question

我正在创建一个简单的操作来使用 Thunk 从 API 获取一些数据。它看起来像这样：

import fetch from 'isomorphic-fetch';

function json(response) {
  return response.json();
}

/**
 * Fetches books from the server
 */
export function getBooks() {
  return function(dispatch) {
    fetch("http://localhost:1357/book", {mode: "cors"})
    .then(json)
    .then(function(data) {
      dispatch({
        type: "GET_BOOKS",
        devices: data
      });
    });
  }
};

它应该调用一次fetch。我已经验证它可以做到这一点，因为它在 Web 浏览器中调用时成功提取数据。但是，当我写这个测试时：

import fetch from 'isomorphic-fetch';
let spy = sinon.spy(fetch);
import configureMockStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import {getBooks} from '../../actions/getBooks';
import sinon from 'sinon';

const middlewares = [ thunk ];
const mockStore = configureMockStore(middlewares);

describe('async actions', () => {

  it('calls the server', () => {
    const store = mockStore({books: []});
    store.dispatch(getBooks());
      expect(spy.callCount).toEqual(1);
      spy.restore();
  });
});

但是，此测试失败，spy 的调用计数为 0。我怀疑这是由于测试前的操作导入了 fetch，这就是为什么在文件顶部创建 spy .但是，这不起作用。测试 fetch 是否被调用的推荐方法是什么？

Answer 1

从http://arnaudbenard.com/redux-mock-store/ 读取，部分异步操作。

我猜这是因为您没有在测试中使用 Promise。

it('calls the server', (done) => {
    const store = mockStore({books: []});
    store.dispatch(getBooks()).then(() => {
      expect(spy.callCount).toEqual(1);
      spy.restore();
      done();
    });
  });