Since 3.8.0

Remove Typename Link

Automatically remove __typename fields from variables.

Overview

The removeTypenameFromVariables link automatically removes __typename fields from variables in operations. This is useful when reusing data from a query as an argument to another GraphQL operation.

1
import { removeTypenameFromVariables } from '@apollo/client/link/remove-typename';
2

3
const removeTypenameLink = removeTypenameFromVariables();

As an example, let's take the following query. Apollo Client will automatically add __typename fields to the query for each field selection set.

1
const query = gql`
2
  query DashboardQuery($id: ID!) {
3
    dashboard(id: $id) {
4
      id
5
      name
6
    }
7
  }
8
`;
9

10
const { data } = await client.query({ query, variables: { id: 1 }});
11
// {
12
//   "dashboard": {
13
//     "__typename": "Dashboard",
14
//     "id": 1,
15
//     "name": "My Dashboard"
16
//   }
17
// }

Now let's update this dashboard by sending a mutation to our server. We'll use the dashboard as input to our mutation.

1
const mutation = gql`
2
  mutation UpdateDashboardMutation($dashboard: DashboardInput!) {
3
    updateDashboard(dashboard: $dashboard) {
4
      id
5
      name
6
    }
7
  }
8
`;
9

10
await client.mutate({ 
11
  mutation,
12
  variables: { 
13
    dashboard: { ...data.dashboard, name: 'My Updated Dashboard' } 
14
  }
15
});

Without the use of the removeTypenameFromVariables link, the server will return an error because data.dashboard still contains the __typename field.

Keep `__typename` in JSON scalars

While the GraphQL spec disallows input fields that begin with the characters "__" (two underscores), this restriction is not applied when the input field is a JSON scalar (i.e. a scalar type that accepts raw JSON as input). When your server relies on __typename within certain JSON scalars, you can configure the removeTypenameFromVariables link to retain __typename.

Note: the JSON scalar type does not need to be literally named JSON to be considered a JSON scalar.

Provide an except option to map all variable types that should maintain __typename. This is done using the KEEP sentinel. Each key in the except option should correspond to an input type in your GraphQL schema.

Here we tell the removeTypenameFromVariables link to keep all __typename fields for any variable that is declared as a JSON type. Variable types are inferred from the GraphQL query. Let's take the following GraphQL mutation:

1
mutation ConfigureDashboardMutation($dashboardConfig: JSON) {
2
  configureDashboard(config: $dashboardConfig) {
3
    id
4
  }
5
}

1
import { removeTypenameFromVariables, KEEP } from '@apollo/client/link/remove-typename';
2

3
const removeTypenameLink = removeTypenameFromVariables({
4
  except: {
5
    JSON: KEEP
6
  }
7
});

Here we've declared a dashboardConfig variable as type JSON. When the query moves through the removeTypenameFromVariables link, the dashboardConfig variable will be detected as a JSON scalar type and all __typename fields are kept intact.

Nested JSON scalar fields in input variables

Not all top-level variables may map to a JSON scalar type. For more complex input object types, the JSON scalar may be found on a nested field. The except option allows you to configured nested fields within these types to keep __typename intact for these fields.

1
import { removeTypenameFromVariables, KEEP } from '@apollo/client/link/remove-typename';
2

3
const removeTypenameLink = removeTypenameFromVariables({
4
  except: {
5
    DashboardInput: {
6
      config: KEEP
7
    }
8
  }
9
});

Variables declared as type DashboardInput will have any top-level __typename fields removed, but keep __typename for the config field.

This nesting can be as deep as needed and include as many fields as necessary. Use the KEEP sentinel to determine where __typename should be kept.

1
import { removeTypenameFromVariables, KEEP } from '@apollo/client/link/remove-typename';
2

3
const removeTypenameLink = removeTypenameFromVariables({
4
  except: {
5
    // Keep __typename for `bar` and `baz` fields on any variable 
6
    // declared as a `FooInput` type
7
    FooInput: {
8
      bar: KEEP,
9
      baz: KEEP,
10
    },
11

12
    // Keep __typename for the `baz.qux` field on any variable 
13
    // declared as a `BarInput` type
14
    BarInput: {
15
      baz: {
16
        qux: KEEP
17
      }
18
    },
19

20
    // Keep __typename on `bar.baz` and `bar.qux.foo` fields for any 
21
    // variable declared as a `BazInput` type
22
    BazInput: {
23
      bar: {
24
        baz: KEEP, 
25
        qux: {
26
          foo: KEEP
27
        }
28
      }
29
    },
30
  }
31
});

To keep __typename for nested fields in arrays, use the same object notation as if the field were an object type.

1
import { removeTypenameFromVariables, KEEP } from '@apollo/client/link/remove-typename';
2

3
const removeTypenameLink = removeTypenameFromVariables({
4
  except: {
5
    // Keep __typename on the `config` field for each widget 
6
    // in the `widgets` array for variables declared as 
7
    // a `DashboardInput` type
8
    DashboardInput: {
9
      widgets: {
10
        config: KEEP
11
      }
12
    }
13
  }
14
});

Options

Name / Type	Description
`except` `KeepTypenameConfig`	Determines which input types should retain `__typename`. This maps the input type to the config, which is either the `KEEP` sentinel or a nested config of fields.

Persisted Queries

REST

Remove Typename Link

Automatically remove __typename fields from variables.

Keep __typename in JSON scalars

Nested JSON scalar fields in input variables

Options

except

Keep `__typename` in JSON scalars

`except`