profile
viewpoint
Aladeen zerubeus Paris Eng @lemonde

push eventzerubeus/ze-casper

zerubeus

commit sha e75b0ffcc06baa05171f01588487d09c2e405204

rollback last commit

view details

push time in a month

push eventzerubeus/ze-casper

zerubeus

commit sha 07ca79d11e60595d30fb2946870b0a31ac198803

move disqul to a better place

view details

push time in a month

create barnchzerubeus/ze-casper

branch : master

created branch time in a month

created repositoryzerubeus/ze-casper

created time in a month

issue openedapollographql/react-apollo

0 exemple of testing nested mutations

I have a case where I use nested mutation, but I still don't get how to mock multiples mutations in my test, there're no examples of this anywhere.

const CampaignMutation = ({
  children,
  fileAvailable,
  setFormSuccessful,
  campaignId,
  campaignData,
  fileDeleteState,
}) => (
  <Mutation mutation={uploadFileMutation}>
    {(
      uploadFile,
      { loading: fileLoading, error: fileError, data: fileData },
    ) => (
      <Mutation
        mutation={CreateCampaignMutation}
        onCompleted={uploadFileAfterMutation(
          fileAvailable,
          enhancedFileUpload(uploadFile),
          setFormSuccessful,
        )}
      >
        {(
          createCampaign,
          {
            loading: createCampaignLoading,
            error: createCampaignError,
            data: createCampaignData,
          },
        ) => (
          <Mutation
            mutation={updateCampaignMutation}
            onCompleted={uploadFileAfterMutation(
              fileAvailable,
              enhancedFileUpload(uploadFile),
              setFormSuccessful,
            )}
          >
            {(
              updateCampaign,
              {
                loading: updateCampaignLoading,
                error: updateCampaignError,
                data: updateCampaignData,
              },
            ) =>
              children({
                campaignMutation: campaignEnhancedMutation(
                  campaignId
                    ? {
                        mutation: updateCampaign,
                        optimisticResponse: buildOptimisticResponse(
                          'upldateCampaign',
                        ),
                        id: campaignId,
                        campaignData,
                        fileDeleteState,
                      }
                    : {
                        mutation: createCampaign,
                        optimisticResponse: buildOptimisticResponse(
                          'createCampaign',
                        ),
                      },
                ),
                loading:
                  updateCampaignLoading || createCampaignLoading || fileLoading,
                error: fileError || createCampaignError || updateCampaignError,
                data: {
                  ...updateCampaignData,
                  ...createCampaignData,
                  ...fileData,
                },
              })
            }
          </Mutation>
        )}
      </Mutation>
    )}
  </Mutation>
)

The failing test : (should render correctly with id):

test('should render correctly with id', async () => {
    // this test will pass but fires an error when executing the mutation
    const mutationData = {
      id: 2,
      type: 'type',
      title: 'title',
      description: 'description',
      partnerName: 'partnerName',
      isPremium: true,
      url: 'url',
      path: 'path',
      instagram: 'instagram',
      facebook: 'facebook',
      twitter: 'twitter',
      linkedIn: 'linkedIn',
      displayTwitterFeed: 'displayTwitterFeed',
    }
    const component = renderer.create(
      <MockedProvider
        mocks={[
          {
            request: {
              query: CreateCampaignMutation,
              variables: {
                partnerName: '$partnerName',
                title: '$title',
                description: '$description',
                type: '$type',
                isPremium: false,
                path: '$path',
                url: '$url',
                socialNetwork: null,
              },
            },
            result: {
              data: {
                campaign,
              },
            },
          },
          {
            request: {
              query: CreateCampaignMutation,
              variables: {
                partnerName: '$partnerName',
                title: '$title',
                description: '$description',
                type: '$type',
                isPremium: false,
                path: '$path',
                url: '$url',
                socialNetwork: null,
              },
            },
            result: {
              data: {
                campaign,
              },
            },
          },
          {
            request: {
              query: updateCampaignMutation,
              variables: {
                id: 2,
                partnerName: '$partnerName',
                title: '$title',
                webImageId: '$webImageId',
                mobileImageId: '$mobileImageId',
                description: '$description',
                type: '$type',
                isPremium: false,
                path: '$path',
                url: '$url',
                socialNetwork: null,
              },
            },
            result: {
              data: {
                campaign,
              },
            },
          },
          {
            request: {
              query: updateCampaignMutation,
              variables: {
                id: 2,
                partnerName: '$partnerName',
                title: '$title',
                webImageId: '$webImageId',
                mobileImageId: '$mobileImageId',
                description: '$description',
                type: '$type',
                isPremium: false,
                path: '$path',
                url: '$url',
                socialNetwork: null,
              },
            },
            result: {
              data: {
                campaign,
              },
            },
          },
        ]}
        addTypename={false}
      >
        <CampaignMutation campaignId={3} setFormSuccessful={jest.fn()}>
          {({ campaignMutation, loading, error }) => {
            if (loading) return <p>is loading</p>
            if (error) return <p>is loading</p>
            return (
              <button onClick={() => campaignMutation(mutationData)}>
                Fired Mutation
              </button>
            )
          }}
        </CampaignMutation>
      </MockedProvider>,
    )

    const button = component.root.findByType('button')
    button.props.onClick()

    await wait(0)

    const tree = component.toJSON()

    expect(tree).toMatchSnapshot()
  })

created time in 2 months

more