Unit testing 为什么我的jest异步操作创建者测试不起作用？

我对单元测试非常陌生，正在尝试通过我的react-redux项目编写一些测试

为什么这个测试不起作用，我怎样才能通过

这是测试。我想测试我的回帖操作创建者。这是一个小型博客应用程序：

import configureStore from 'redux-mock-store'; // ES6 modules
import { findSinglePost, sendEdit, changeRedirect, checkBoxChange } from '../client/redux/actions/postActions';
import thunk from 'redux-thunk';
import axios from 'axios';

const middlewares = [thunk];
const mockStore = configureStore(middlewares);
describe('asynchronous action creators', () => {

  it('should fetch posts', () => {
    let store = mockStore({})

    //my async action creator. It uses mock data that's in the same folder.
    const fetchPosts = () => function(dispatch) {
      dispatch({type: 'FETCH_POSTS'});

      return axios.get('./MOCK.json').then((response) => {
        dispatch({type: 'FETCH_POSTS_FUFILLED', payload: response.data});
      }).catch((err) => {
        dispatch({type: 'FETCH_POSTS_REJECTED', payload: err});
      });
    };
    //this doesn't equal FETCH_POSTS_FUFILLED, it ends up equaling just "FETCH_POSTS"
    return store.dispatch(fetchPosts()).then(() => {
      const actions = store.getActions();
      expect(actions[0]).toEqual({type: 'FETCH_POSTS_FUFILLED'});
    })
  })
});

这是杰斯特的反馈。我希望它等于'FETCH_POSTS'FUFILLED'，但它返回'FETCH_POSTS'

 FAIL  _test_\actions.test.js
  ● asynchronous action creators › should fetch posts

    expect(received).toEqual(expected)

    Expected value to equal:
      {"type": "FETCH_POSTS_FUFILLED"}
    Received:
      {"type": "FETCH_POSTS"}

    Difference:

    - Expected
    + Received

      Object {
    -   "type": "FETCH_POSTS_FUFILLED",
    +   "type": "FETCH_POSTS",
      }

      88 |     return store.dispatch(fetchPosts()).then(() => {
      89 |       const actions = store.getActions();
    > 90 |       expect(actions[0]).toEqual({type: 'FETCH_POSTS_FUFILLED'});
      91 |     })
      92 |   })
      93 | });

      at _test_/actions.test.js:90:26

 PASS  client\views\LoginPage\LoginPage.test.jsx

Test Suites: 1 failed, 1 passed, 2 total
Tests:       1 failed, 5 passed, 6 total
Snapshots:   0 total
Time:        1.49s
Ran all test suites related to changed files.

此外，如果您想尝试运行该项目，这里是该项目的github

此外，如果业内有一种更为人所知的标准方法，我很乐意接受这些建议

编辑：

当我将操作[0]更改为操作[1]时，出现以下错误：

Expected value to equal:
  {"type": "FETCH_POSTS_FUFILLED"}
Received:
  {"payload": {Symbol(impl): {"message": "The string did not match the expected pattern.", "name": "SyntaxError", Symbol(wrapper): [Circular]}}, "type": "FETCH_POSTS_REJECTED"}

Difference:

- Expected
+ Received

  Object {
-   "type": "FETCH_POSTS_FUFILLED",
+   "payload": DOMException {
+     Symbol(impl): DOMExceptionImpl {
+       "message": "The string did not match the expected pattern.",
+       "name": "SyntaxError",
+       Symbol(wrapper): [Circular],
+     },
+   },
+   "type": "FETCH_POSTS_REJECTED",

以下是jest反馈的图片形式：

---

您正在使用的模拟存储区将存储对其发出的所有已调度呼叫。在您的情况下，应该发出两个调度调用，第一个是

FETCH\u POST

，第二个是

FETCH\u POST\u completed

或

FETCH\u POST\u REJECTED

---

因此，当您从模拟存储中检索调度的操作时，第一个条目（您在

expect

中使用的条目）将是

FETCH\u POSTS

。您应该检查数组中的第二个值，即

FETCH\u POSTS\u completed

或

FETCH\u POSTS\u REJECTED

，这取决于您正在测试的函数中承诺的解析方式。

您正在使用的模拟存储区将存储对其进行的所有已调度调用。在您的情况下，应该发出两个调度调用，第一个是

FETCH\u POST

，第二个是

FETCH\u POST\u completed

或

FETCH\u POST\u REJECTED

---

因此，当您从模拟存储中检索调度的操作时，第一个条目（您在

expect

中使用的条目）将是

FETCH\u POSTS

。您应该检查数组中的第二个值，它可能是

FETCH\u POSTS\u completed

或

FETCH\u POSTS\u REJECTED

，这取决于您正在测试的函数中如何解析承诺。

我已将其更改为操作[1]。并得到上面的错误。这个错误是否意味着我的承诺基本上是在获取数据方面有问题？是的，或者看起来是这样。您在这里看到的错误是测试的“正确”失败，即，您的操作创建者成功完成并用执行的操作填充模拟存储。但是，在您希望您的承诺得到解决的地方，它被拒绝，并在有效负载中显示错误。我已将其更改为操作[1]。并得到上面的错误。这个错误是否意味着我的承诺基本上是在获取数据方面有问题？是的，或者看起来是这样。您在这里看到的错误是测试的“正确”失败，即，您的操作创建者成功完成并用执行的操作填充模拟存储。然而，在您希望您的承诺得到解决的地方，它被拒绝，并在有效负载中显示错误。