Reactjs 集成测试期间未更新Redux存储

我正在尝试使用Jest和Ezyme对React Redux应用程序进行集成测试。应用程序本身工作正常，并且在组件分派操作后，Redux存储被正确更新。 但是，当我运行集成测试时，在调度操作之后，存储有一个初始值

这是我的测试文件：

import SendMessageSendsay from '../utils/sendMessage'
import {testStore} from '../utils'
import {sendMessage } from '../redux/actions/messageActions'

jest.mock('../utils/sendMessage');

describe('sendMessage action', ()=> {
    const message = {
        subject: 'Message subject',
        toEmail: 'receiver@fakegmail.com'
    }

    test('Send message: Should update store correctly', () => {
        const store = testStore();
        const referenceState = {
            messages: {
              messages: [
                {
                  date: '2019-08-30T11:36:14.813Z',
                  subject: 'Message subject',
                  trackId: '95'
                }
              ],
              isSent: true,
              prevToEmail: 'receiver@fakegmail.com'
            }
          }
        SendMessageSendsay.mockResolvedValue({'track.id' : '95' })       
        store.dispatch(sendMessage(message))
        const newState = store.getState();
        console.log(newState);
        expect(newState).toBe(referenceState);  

    })
});

我得到了这些结果：

● sendMessage action › Send message: Should update store correctly

    expect(received).toBe(expected) // Object.is equality

    - Expected
    + Received

      Object {
        "messages": Object {
    -     "isSent": true,
    -     "messages": Array [
    -       Object {
    -         "date": "2019-08-30T11:36:14.813Z",
    -         "subject": "Message subject",
    -         "trackId": "95",
    -       },
    -     ],
    -     "prevToEmail": "receiver@fakegmail.com",
    +     "isSent": false,
    +     "messages": Array [],
    +     "prevToEmail": "",
        },
      }

其中received是我的reducer中的初始状态。 以下是我的行动：

export const sendMessage = (message) => (dispatch) => {
  sendMessageSendsay(message)
  .then((res) => dispatch(
    {
      type: SEND_MESSAGE,
      message: {
        date: new Date(),
        subject: message.subject,
        trackId: res['track.id']
      },
      prevToEmail: message.toEmail
    }
  ))
}

这是减速器：

export const initialState = {
    messages : [],
    isSent: false,
    prevToEmail: ''
}

export default (state = initialState, action) => {
    switch (action.type) {
        case SEND_MESSAGE: 
        {
            return {
                ...state,
                messages: [
                    ...state.messages,
                    action.message
                ],
                isSent: true,
                prevToEmail: action.prevToEmail
            }; 
        }

---

根据@HMR注释，我将操作修改为：

export const sendMessage = (message) => (dispatch) => {
  return new Promise((resolve) => {
    sendMessageSendsay(message)
    .then((res) => resolve(dispatch(
      {
        type: SEND_MESSAGE,
        message: {
          date: new Date(),
          subject: message.subject,
          trackId: res['track.id']
        },
        prevToEmail: message.toEmail
      }
    )))
  })
}

并将测试文件添加到此：

import SendMessageSendsay from '../utils/sendMessage'
import {testStore} from '../utils'
import {sendMessage } from '../redux/actions/messageActions'

jest.mock('../utils/sendMessage');

describe('sendMessage action', ()=> {
    const message = {
        subject: 'Message subject',
        toEmail: 'receiver@fakegmail.com'
    }

    test('Send message: Should update store correctly', () => {
        const store = testStore();
        const referenceState = {
            messages: {
              messages: [
                {
                  subject: 'Message subject',
                  trackId: '95'
                }
              ],
              isSent: true,
              prevToEmail: 'receiver@fakegmail.com'
            }
          }

        SendMessageSendsay.mockResolvedValue({'track.id' : '95' })       

        return store.dispatch(sendMessage(message))
        .then(() => {
          const newState = store.getState();
          expect(newState).toMatchObject(referenceState); 
        })

    })
});

---

我使用了

toMatchObject（）

istead of

toEqual（）

来解决时间戳问题。

您必须共享您的操作和还原程序！sendMessage是否导致存储异步更新？如果是这样的话，也许你可以在测试中改变state@HMR是的，它使用promise异步请求外部API。我认为如果它不起作用，您可以尝试在thunk action函数中返回承诺。