Question for unit testing Zustand stores with imported utility functions in async methods

[Tubring25]

Background

I'm writing unit tests for a Zustand store using Jest. The store contains an asynchronous method fetchCartItems that calls an API and then uses an imported utility function to process the data before updating the store.

export const useCartStore = create<CartState>((set) => ({
  loading: true,
  error: false,
  totalAmount: 0,
  items: [],

  fetchCartItems: async () => {
    try {
      set({ loading: true, error: false })
      const data = await CartApi.getCart()
      const updatedData = getCartDetails(data) // imported from lib file
      set((state) => ({
        ...state,
        ...updatedData
      }))
    } catch (error) {
      set({ error: true })
    } finally {
      set({ loading: false })
    }
  },
}))

Current Behavior

  it('should fetch cart items', async () => {
    const { result, waitForNextUpdate } = renderHook(() => useCartStore());

    (CartApi.getCart as jest.Mock).mockResolvedValue(mockCartDTO);
    // ; (getCartDetails as jest.Mock).mockReturnValue(mockUpdatedCartData) // if uncommit this line, the test will be work.

    act(() => {
      result.current.fetchCartItems();
    });

    await waitForNextUpdate();

    expect(result.current.loading).toBeFalsy();
    expect(result.current.error).toBeFalsy();
    expect(result.current.totalAmount).toBe(2);
  });

The test will fail. But in some ways below it works.

1. If I don't mock the imported utility function (getCartDetails), I can't get the latest values in result.current.
2. If I move the utility function's implementation inside the store method, the test passes.

Question

When unit testing Zustand stores that use imported utility functions (like getCartDetails), is it always necessary to mock these functions?

[dbritto-dev]

@Tubring25 don't mock functions use Mock Service Worker to intercept http requests and return mock data