Mocking tRPC call w/ Playwright (Transform Error)

I have a tRPC call that I would like to mock out for a Playwright E2E test.
I've followed their docs as shown below and used the same

transformer

transformer

(superjson) from our tRPC setup.

When inspected via network tab the Call seems to succeed as expected. (image)
However, the client errors w/

TRPCClientError: Unable to transform response from server
    at transformResult (transformResult-6fb67924.mjs:74:1)
    at eval (httpBatchLink.mjs:188:56)

TRPCClientError: Unable to transform response from server
    at transformResult (transformResult-6fb67924.mjs:74:1)
    at eval (httpBatchLink.mjs:188:56)

https://playwright.dev/docs/mock#mock-api-requests

    import { transformer } from '@/utils/trpc';
    ... 
    await page.route('**/api/trpc/onboarding.verifyPrimaryPractice?batch=1', (route) => {
      route.fulfill({
        status: 200,
        body: transformer.stringify({ success: true }),
        headers: { 'Content-Type': 'application/json' },
      });
    });

    import { transformer } from '@/utils/trpc';
    ... 
    await page.route('**/api/trpc/onboarding.verifyPrimaryPractice?batch=1', (route) => {
      route.fulfill({
        status: 200,
        body: transformer.stringify({ success: true }),
        headers: { 'Content-Type': 'application/json' },
      });
    });

tRPC•3y ago•

17 replies

Matt Thompson

Mocking tRPC call w/ Playwright (Transform Error)

I have a tRPC call that I would like to mock out for a Playwright E2E test.
I've followed their docs as shown below and used the same

transformer

transformer

(superjson) from our tRPC setup.

When inspected via network tab the Call seems to succeed as expected. (image)
However, the client errors w/

TRPCClientError: Unable to transform response from server
    at transformResult (transformResult-6fb67924.mjs:74:1)
    at eval (httpBatchLink.mjs:188:56)

TRPCClientError: Unable to transform response from server
    at transformResult (transformResult-6fb67924.mjs:74:1)
    at eval (httpBatchLink.mjs:188:56)

https://playwright.dev/docs/mock#mock-api-requests

    import { transformer } from '@/utils/trpc';
    ... 
    await page.route('**/api/trpc/onboarding.verifyPrimaryPractice?batch=1', (route) => {
      route.fulfill({
        status: 200,
        body: transformer.stringify({ success: true }),
        headers: { 'Content-Type': 'application/json' },
      });
    });

    import { transformer } from '@/utils/trpc';
    ... 
    await page.route('**/api/trpc/onboarding.verifyPrimaryPractice?batch=1', (route) => {
      route.fulfill({
        status: 200,
        body: transformer.stringify({ success: true }),
        headers: { 'Content-Type': 'application/json' },
      });
    });

Mocking tRPC call w/ Playwright (Transform Error)

Similar Threads

Mocking tRPC call w/ Playwright (Transform Error)

Similar Threads

Similar Threads

Similar Threads