Testing for pages/hooks. How to mock Query/Mutation resolver?

[dhythm]

Question

Is there a way to mock Query/Mutation resolver at blitz 0.44.4?

Issue I'm facing

When I used an older version of blitz (v0.36.4), I could write mock for query/mutation resolver like the below and tests work well.

jest.mock("app/rpc/users/queries/getUsers", () => {
  const resolver = jest.fn() as any
  resolver._meta = { apiUrl: "app/rpc/users/queries/getUsers" }
  return resolver
})
const mockGetUsers = mocked(getUsers)

...

  beforeEach(() => {
    mockGetUsers.mockResolvedValue({
      data: [...],
      error: null,
    })
  })

However, the same tests are failed after upgrading to v0.44.4.
The tests for pages that use const [res] = useQuery(getUsers) show an error as TypeError: Cannot read property 'error' of undefined. In this case, res should return data with the type of { data: T, error: null } | { data: null, error: U }.

Same as the above, tests for hooks with renderHooks are failed as well.

    const { result } = renderHook<any, any>(() => useAllUsers(), { router: { asPath: "/" } })
    await waitForLoading()
    expect(result.current[0]).toEqual({ data: ..., error: null })

It returns TypeError: Cannot read property 'current' of undefined.

[beerose]

Hi @dhythm. There were quite many changes between 0.36 and the latest release, e.g. switching to the next.js fork which was a big change. But this looks like a regression. Could you provide a minimal reproduction, e.g. a test file?

FWIW, if not using mock is something that you'd be interested in, you can take a look at this discussion: #2977.

[dhythm]

Hi @beerose! I'm appreciate of your comment.
I create a repo from blitz new and modify only a tiny stuff.
https://github.com/dhythm/blitz-sample

The test of index.test.tsx should fail because the mock of getCurrentUser does not work well.

[dhythm]

Mocking hooks works well,

jest.mock("app/core/hooks/useCurrentUser")
const mockUseCurrentUser = useCurrentUser as jest.MockedFunction<typeof useCurrentUser>

Mocking resolver doesn't work well,

jest.mock("app/users/queries/getCurrentUser")
const mockUseGetUser = getCurrentUser as jest.MockedFunction<typeof getCurrentUser>

Sounds grad if there is a way to mock Query / Mutation resolvers, because there are a lot of useQuery logic in my other repo.

[dhythm]

I've already seen #2977, to be honest.

I think there are some mocking strategy for const [res] = useQuery(getCurrentUser)

1. mocking useQuery
2. mocking getCurrentUser
3. mocking fetch api or db.user.findUnique inside of getCurrentUser
4. or create useCurrentUser to wrap useQuery(getCurrentUser) and mock it. (Similar to 1)

No.1 is not useful because it doesn't work if there are several useQuery.
No.3 is not useful because we have to know the logic inside of getCurrentUser.
So, feel happy if I can mock getCurrentUser directly, otherwise I need to create tons of custom hooks to mock them 🤷‍♂️

[dhythm]

Update:

• Mock db.user.findFirst does NOT work (user returns undefined) 🤯
• Mock app/rpc/user/queries/getCurrentUser does NOT work (test returns Cannot find module error) 🤦‍♂️
• Mock app/core/hooks/useCurrentUser work 🙆‍♂️

[dhythm]

I hoist an issue (https://github.com/blitz-js/blitz/issues/3119) about this regression.

[beerose]

Thank you!