schlabach Posts

schlabach

•Created by schlabach on 8/9/2023 in #❓-help

Examples of Vitest with React Testing Library

Does anyone have examples of how to mock data from tRPC procedure calls? I have client components that are fetching data using tRPC , and I want to run integration tests. I have been attempting to use vi.mock() to mock this data but I haven't gotten it to work correctly. Thanks in advance! https://vitest.dev/guide/mocking.html

1 replies

TtRPC

•Created by schlabach on 6/23/2023 in #❓-help

Prefetch on useContext() is not being picked up by react-query.

I need to prefetch one of my procedures to pre-load data for a page that the user can navigate to. This is all happening within a Client Component in Next 13's app directory Inspecting the Network tab in Chrome's devtools, I can see that the prefetch calls are being made, and I can inspect the data inside the response, which is correct. However, when I look at React Query's devtools, the query is not being picked up, and is therefore not being cached. When the user navigates to the page that should have prefetched data, trpc makes a fresh query and doesn't use the prefetch. I am using code that looks like this:

const utils = trpc.useContext()

utils.router.procedure.prefetch({...parameters})

const utils = trpc.useContext()

utils.router.procedure.prefetch({...parameters})

6 replies