TypeScript Msw

Package name	Weekly Downloads	Version	License	Updated
`@graphql-codegen/typescript-msw` (opens in a new tab)				Jul 22nd, 2023

Installation

pnpm add -D @graphql-codegen/typescript-msw

⚠️

Usage Requirements In order to use this GraphQL Codegen plugin, please make sure that you have GraphQL operations (query / mutation / subscription and fragment) set as documents: … in your codegen.yml.

Without loading your GraphQL operations (query, mutation, subscription and fragment), you won't see any change in the generated output.

💡

Make sure you have typescript plugin and typescript-operations as well in your configuration:

This plugin generates msw (https://github.com/mswjs/msw (opens in a new tab)) mock handlers with TypeScript typings.

Config API Reference

`link`

type: object

GraphQL endpoint to use when working with multiple backends.

Usage Examples

codegen.ts

 import type { CodegenConfig } from '@graphql-codegen/cli';
 
 const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
       // plugins...
       config: {
         link: {
           name: 'stripe',
           endpoint: 'https://api.stripe.com/graphql'
         }
       },
     },
   },
 };
 export default config;

Usage

Input:

query GetUser($id: ID!) {
  getUser(id: $id) {
    name
    id
  }
}

Usage:

import { mockGetUserQuery } from './generated'
 
const worker = setupWorker(
  mockGetUserQuery((req, res, ctx) => {
    const { id } = req.variables
 
    return res(
      ctx.data({
        getUser: { name: 'John Doe', id }
      })
    )
  })
)
 
worker.start()

The generated functions are named mock<OperationName><OperationType>[LinkName]. E.g., mockGetUserQuery, and mockAdminMutationStripe.

mongodb oclif