Reactjs 在act回调中包装异步moxios调用

我正在尝试使用钩子测试react功能组件。useEffect钩子调用第三方API，然后在返回时调用setState

我已经完成了测试，但是不断收到一条警告，组件的更新没有包含在act中

我的问题是，期望值在moxios.wait承诺中，因此我无法将其包装在act函数中，然后对其结果进行断言

测试通过了，但我知道如果不在act函数中包装更新状态的代码，可能会导致误报或发现错误。我只是想知道我应该如何测试这个

我尝试在react 16.9.0 alpha版本中使用新的async await act函数，并在许多github问题（如jest setTimers）中找到了许多建议，但似乎没有一个能解决这个问题

组件

const-Benefits=props=>{
const[benefits，setBenefits]=useState（[]）
const[editing，setEditing]=useState（false）
const[editingBenefit，setEditingBenefit]=useState（{id:null，名称：“”，类别：“”）
useffect（（）=>{
axios.get（“#someurl”）
。然后（响应=>{
挫折收益（响应数据）
})
}, [])
}

测试

description（'Benefits'，（）=>{
它（'从api获取收益列表并填充收益表'，（完成）=>{
const{rerender}=render（）
等等（（）=>{
const request=moxios.requests.mostRecent（）
请求，响应({
现状：200，
答复：福利
}).然后（（）=>{
expect（document.queryselectoral（'tbody>tr'）.length）.toBe（2）
完成（）
})
})
})
})

测试通过了，但我得到以下警告

Warning: An update to Benefits inside a test was not wrapped in act(...).

When testing, code that causes React state updates should be wrapped into act(...):

act(() => {
  /* fire events that update state */
});
/* assert on the output */

This ensures that you're testing the behavior the user would see in the browser.
    in Benefits (at benefits.spec.js:28)

从中，您可以使用

async/await

act

您的代码应该如下所示

describe('Benefits', () => {
  it('fetches the list of benefits from an api and populates the benefits table', async() => {
    const { rerender } = render(<Benefits />);

    await moxios.wait(jest.fn);
    await act(async() => {
      const request = moxios.requests.mostRecent()
      await request.respondWith({
        status: 200,
        response: benefits
      });
    });

    expect(document.querySelectorAll('tbody > tr').length).toBe(2)
})

description（'Benefits'，（）=>{
它（'从api获取收益列表并填充收益表'，async（）=>{
const{rerender}=render（）；
等待莫西奥斯。等待（笑话fn）；
等待动作（异步（）=>{
const request=moxios.requests.mostRecent（）
等待请求({
现状：200，
答复：福利
});
});
expect（document.queryselectoral（'tbody>tr'）.length）.toBe（2）
})

---

我在moxios.wait中使用了

jest.fn

，因为它需要回调函数

这是一个已知的问题，请看@jornsharpe链接的问题。暂时可以忽略警告@Gpx。我原以为这个问题应该通过使用async act函数来解决，但这对我来说仍然不起作用。我认为它是安全的可能是moxios.wait的工作方式，也可能是react测试库在react-act方法周围包装了一个act方法，并且仍在将其转发到那里，从而导致警告。我想我现在将等待这一个。感谢大家的帮助。