React `act` warning on DidMount and Promise

Okay so I have this bunch of code that’s is thrown on useEffect(() => {...}, []) a.k.a componentDidMount.

// utils/apiCalls.ts

export const loadData = async <T>(
  url: string,
  errorMsg = "Couldn't retrieve data.",
): Promise<T> => {
  const res = await fetch(url, { mode: 'cors', credentials: 'include' });
  if (res.ok) return await res.json();
  throw new Error(errorMsg);
};

export const loadChat = (id: number): Promise<IChat> => {
  return loadData<IChat>(
    `${CHAT_API}/${id}/nested/`,
    "We couldn't get the chat.",
  );
};

// components/MessageContainer.tsx

const MessageContainer = (/* props */) => {
  /*
   * Some coding...
   */

  useEffect(() => {
  if (session === null) return;
  if (chat === null) {
    loadChat(session.chat).then(setChat).catch(alert);
    return;
  }
  // More coding...
}, [session, chat]);
};

The problem comes when I try to test it with @testing-library/react since it gives me this warning Warning: An update to MessagesContainer inside a test was not wrapped in act(...).

How can I make a correct test for this?
Here’s the test I have right now.

// tests/MessagesContainer.spec.tsx

describe('MessagesContainer suite', () => {
  it('loads messages on mount', () => {
    fetchMock.mockResponseOnce(JSON.stringify(ChatMock));
    render(
      <SessionContext.Provider value={SessionMock}>
        <MessagesContainer {...MessagesContainerMockedProps} />
      </SessionContext.Provider>,
    );

    expect(fetchMock.mock.calls.length).toEqual(1);
  });
});

NOTE: Wrapping render on act did not work.