‚̧Narcissistic Preening Monarch
    Have ideas to improve npm?Join in the discussion! ¬Ľ

    apollo-client-mock

    0.0.9¬†‚Äʬ†Public¬†‚Äʬ†Published

    Apollo Client Mock

    Easily mock your apollo client for testing. It uses Apollo Link Schema under the surface

    Installation

    $ npm install --save-dev apollo-client-mock

    Setup

    To setup Apollo mock client you need to import your schema in as well as your mock resolvers. Then you can setup your client with these two arguments which will then return a createClient function which you can create a mockedClient for each test. createClient can optionally take a new set of resolvers that can overwrite your defaults

    import typeDefs from '../link/to/schema'
    import setupClient from 'apollo-client-mock'
     
    const defaultMocks = {
      Query: () => ({
        nodes: () => []
        //...other queries
      }),
      Mutation: () => ({
        getDomainState: (_, { name }, context) => {
          return {
            name,
            state: 'Open'
          }
        }
        //...other mutations
      })
    }
     
    const createClient = setupClient(defaultMocks, typeDefs)
     
    export default createClient
    //Test file
     
    import React from 'react'
    import {
      render
    } from 'react-testing-library'
     
    import { ApolloProvider } from 'react-apollo'
    import createClient from '../testing-utils/mockedClient'
     
    import CheckAvailabilityContainer from '../CheckAvailability'
     
    afterEach(cleanup)
     
    test('should call resolver without blowing up', () => {
      const { getByText, container } = render(
        <ApolloProvider client={createClient()}>
          <CheckAvailabilityContainer />
        </ApolloProvider>
      )
     
      //the rest of your test
    }

    The following example shows you can overwrite each resolver per test. This is useful if you want to setup a spy for your resolver function to ensure it has been called. This is particularly useful if your component just makes a mutation but does not actually show the result of the state change in the component.

    test('should call resolver without blowing up', () => {
      const getDomainState = jest.fn()
      const resolverOverwrites = {
        Mutation: () => ({
          getDomainState
        })
      }
      const { getByText, container } = renderIntoDocument(
        <ApolloProvider client={createClient(resolverOverwrites)}>
          <CheckAvailabilityContainer />
        </ApolloProvider>
      )
     
      const submitButton = getByText('Check Availability')
      const form = container.querySelector('form')
      const input = form.querySelector('input')
      input.value = 'vitalik.eth'
      Simulate.change(input)
      submitButton.click()
      expect(getDomainState).toHaveBeenCalledTimes(1)
    })

    Install

    npm i apollo-client-mock

    DownloadsWeekly Downloads

    323

    Version

    0.0.9

    License

    MIT

    Unpacked Size

    10.1 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar