# Using MockedProvider with addTypename=false ignores fragments

**URL:** <https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405>\
**Category:** Client SDKs\
**Tags:** react\
**Created:** [February 7, 2025, 11:38am UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405 "2025-02-07T11:38:09Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![pgandhi](https://avatars.discourse-cdn.com/v4/letter/p/c2a13f/32.png) [@pgandhi](https://community.apollographql.com/u/pgandhi)\
**Post date:** [February 7, 2025, 11:38am UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/1 "2025-02-07T11:38:09Z")

</div>

So we’ve been using MockedProvider for testing for some time now and recently found the [docs](https://www.apollographql.com/docs/react/development-testing/testing#setting-addtypename) 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

```auto
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

```auto
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.

---

<div class="post-metadata">

**Author:** ![lenz](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/lenz/32/4007_2.png) [@lenz](https://community.apollographql.com/u/lenz)\
**Post date:** [February 7, 2025, 11:47am UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/2 "2025-02-07T11:47:59Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![pgandhi](https://avatars.discourse-cdn.com/v4/letter/p/c2a13f/32.png) [@pgandhi](https://community.apollographql.com/u/pgandhi)\
**Post date:** [February 7, 2025, 11:50am UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/3 "2025-02-07T11:50:41Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)\
**Post date:** [February 7, 2025, 4:47pm UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/4 "2025-02-07T16:47:49Z")

</div>

I just put up a [pull request](https://github.com/apollographql/apollo-client/pull/12353) 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 🙂

---

<div class="post-metadata">

**Author:** ![pgandhi](https://avatars.discourse-cdn.com/v4/letter/p/c2a13f/32.png) [@pgandhi](https://community.apollographql.com/u/pgandhi)\
**Post date:** [February 7, 2025, 5:23pm UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/5 "2025-02-07T17:23:10Z")

</div>

Thank you for the PR!  
I still see `addTypename` in [this section](https://www.apollographql.com/docs/react/development-testing/testing#testing-local-state). Has it been left there on purpose?

---

<div class="post-metadata">

**Author:** ![jerelmiller](https://sea1.discourse-cdn.com/flex019/user_avatar/community.apollographql.com/jerelmiller/32/3314_2.png) [@jerelmiller](https://community.apollographql.com/u/jerelmiller)\
**Post date:** [February 7, 2025, 5:25pm UTC](https://community.apollographql.com/t/using-mockedprovider-with-addtypename-false-ignores-fragments/8405/6 "2025-02-07T17:25:44Z")

</div>

Yes since that section is showing the [internals of `MockedProvider`](https://github.com/apollographql/apollo-client/blob/d79aec054ef8632e03d61024f529a27692d0d55a/src/testing/react/MockedProvider.tsx#L45-L61) (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.
