Dynamic headers in queries are not possible

[electrovir]

Intended outcome:

I am able to make multiple queries with the same client, with the same GraphQL query, but with different custom headers.

Actual outcome:

The first set custom header is used for all following queries.

How to reproduce the issue:

edit: moved the client definition outside of the fetch function.

const client = new ApolloClient({
    uri: 'http://localhost:4000/graphql',
    cache: new InMemoryCache(),
});

export async function fetchUsers(role: string) {

    await client.query<any>({
        query: gql`
            {
                users {
                    id
                }
            }
        `,
        context: {
            headers: {
                role,
            },
        },
    });

    return data.data.users;
}

Workaround:

Using a fetchPolity of no-cache makes no difference. The only workaround I've figured out so far is to create a new client for every request:

function getClient() {
    const client = new ApolloClient({
        uri: 'http://localhost:4000/graphql',
        cache: new InMemoryCache(),
    });
    return client;
}

export async function fetchUsers(role: string) {
    await getClient().query<any>({
        query: gql`
            {
                users {
                    id
                }
            }
        `,
        context: {
            headers: {
                role,
            },
        },
    });

    return data.data.users;
}

Versions

  System:
    OS: macOS 12.6
  Binaries:
    Node: 16.17.0 - ~/.nvm/versions/node/v16.17.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.17.0/bin/yarn
    npm: 8.15.0 - ~/.nvm/versions/node/v16.17.0/bin/npm
  Browsers:
    Chrome: 104.0.5112.101
    Firefox: 104.0.2
    Safari: 16.0

[bignimbus]

Tagging @MrDoomBringer since his open PR should address this issue - thanks @MrDoomBringer! And thanks @electrovir for opening this issue!

[electrovir]

Oops, I just realized my "How to reproduce the issue" and "Workaround" code were actually the same. I modified the "How to reproduce the issue" example to remedy that. The issue occurs when using a single instance of a client, which I assume is preferred?