An unofficial tRPC devtools extension to inspect your queries, mutations and subscriptions
tRPC Client Devtools Extension
In order to use it, you need to do the following steps:
1. Install the trpc-client-devtools-link npm package and add it to your tRPC client config (if you're using tRPC v10, install the @next version)
2. Download and install the tRPC Client Devtools Extension
3. Open the Devtools, navigate to the tRPC panel and inspect away!
The tRPC Client Devtools appear as a \"tRPC\" tab in your web browser inspector when tRPC is detected, alongside other tabs like \"Elements\" and \"Console\". The devtools currently have 3 main features:
- Query inspector: View the input, result and elapsed time of the fired queries.
- Mutation inspector: View the input, result and elapsed time of the fired mutations.
- Subscription inspector: View the input, multiple results and their elapsed time of the subscriptions.
Code for this extension can be found at: https://github.com/rhenriquez28/trpc-client-devtools
If you want to learn more about tRPC, check out: https://trpc.io/
Source Manifest.json
Similar Extensions
Refined GitHub 657 213 ★ 572KiB
GraphQL developer tools 657 24 ★ 98.19KiB
Gimli Tailwind 657 33 ★ 151KiB
Drizzle Studio 657 17 ★ 3.04MiB
LocatorJS 657 64 ★ 190KiB
Vercel 657 24 ★ 34.3KiB
Web Vitals 657 43 ★ 398KiB
OctoLinker 657 110 ★ 184KiB
RSC Devtools 657 9 ★ 175KiB
Apollo Client Devtools 657 266 ★ 490KiB
React Context DevTool 657 21 ★ 2.35MiB
GraphQL Network Inspector 657 123 ★ 8.34MiB
MobX Developer Tools 657 51 ★ 682KiB
Hoppscotch Browser Extension 657 35 ★ 453KiB
Altair GraphQL Client 657 68 ★ 6.78MiB
Zukeeper: Devtools for Zustand 657 6 ★ 939KiB
Solid Devtools 657 7 ★ 123KiB
daily.dev | The homepage developers deserve 657 2460 ★ 2.28MiB
Testing Playground 657 60 ★ 646KiB
Reactime 657 33 ★ 803KiB
Graphite 657 7 ★ 10.28KiB
GitHub Repository Size 657 80 ★ 12.9KiB
Tailwind CSS Devtools 657 7 ★ 857KiB
File Icons for GitHub and GitLab 657 48 ★ 460KiB