Using MockedProvider with addTypename=false ignores fragments

Client SDKs
1

So we’ve been using MockedProvider for testing for some time now and recently found the docs saying

Unless you explicitly configure your mocks to expect a __typename field, always set addTypename to false in your tests.

We were okay with changing our mocks and thus removed __typename from them. What I noticed is that our tests that check if the correct data was being passed to some component started failing. We use the concept of colocated fragments and thus our code is organized as follows:

Parent.tsx

const Parent = () => {
     const { data: data, loading: loading } = useQuery(Parent.query);
     // lot of stuff here
     <Child data={data} />
}
Parent.query = gql(`
    query sampleQuery() {
         query {
              id
              ...Child_SubData
         }
    }
`)

Child.tsx

const Child = (data: FragmentType<typeof Child_SubDataFragmentDoc>) => {
    // some stuff here
}
Child.fragment = gql(`
    fragment Child_SubData on SubData {
         id
         name
         blah
    }
`)

The test that fails is the one that checks if correct data has been passed to Child component. With addTypename={false}, the received data only has id field and name and blah have disappeared.

Is this a bug, or should we restructure our tests somehow? We also use caching, and our graphql schema on server frequently changes (we keep that synced through graphql-codegen), so are there any downsides to removing __typename from the mocks for these kinds of tests?

Thank you in advance.

2

You really need to keep __typename in there - a fragment on Person can not know it it should apply to an object unless it has __typename: 'Person'.

These options are there only for historical reasons and we will likely soon deprecate and remove them.

Unless you explicitly configure your mocks to expect a __typename field, always set addTypename to false in your tests.

Tbh., this is the first time I’ve seen that quote in the docs. I’ll bring it up with the team and we’ll definitely remove that!

1 Like
3

Thank you so much for the quick reply! That makes sense.

4

I just put up a pull request to stop mentioning this option in the docs. Its been considered a bad practice since it completely changes the runtime behavior between your tests and production (i.e. normalization), but we forgot it was there. Thanks for mentioning this! Hopefully this will help remove confusion in the future :slightly_smiling_face:

1 Like
5

Thank you for the PR!
I still see addTypename in this section. Has it been left there on purpose?

6

Yes since that section is showing the internals of MockedProvider (notice how the code is verbatim).

This will be changed when we release 4.0 since that release will be removing the addTypename option. For now though figured the docs shouldn’t lie about the code itself since anyone can view the source and verify if they are the same.