gatsby-source-graphql no longer working with context variables

[mutewinter]

Description

After upgrading to [email protected], I'm seeing this error with a GraphQL source that uses a variable:

ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

unexpected variables in variableValues: id

This must be related to #20042. I've tested with the previous version, [email protected], and I get no errors.

Here's a rough sample of my code:

// gastby-node.js
export const createPages = async ({ graphql, actions }) => {
  const { createPage } = actions;
  const postTemplate = path.resolve(`src/templates/Post.tsx`);

  posts.forEach((post) => {
    createPage({
      path: `/posts/${post.slug}`,
      component: postTemplate,
      context: {
        id: post.id,
      },
    });
  });
}

// src/templates/Post.tsx
export const query = graphql`
  query PostQuery($id: String!) {
    blogApi {
      post(id: $id) {
        name
      }
    }
  }
`;

interface Props {
  data: PostQuery;
}

const Post: React.FC<Props> = ({
  data: {
    blogApi: { post },
  },
}) => {

  return (
    <MainLayout>
      <PageMeta title={post.name} />
      <h1>{post.name}</h1>
    </MainLayout>
  );
};

export default Post;

Expected result

Context variables should work with GraphQL queries.

Actual result

I receive the error above.

Environment

  System:
    OS: macOS Mojave 10.14
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 12.13.1
    Yarn: 1.19.2
    npm: 6.12.1
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 79.0.3945.88
  npmPackages:
    gatsby: 2.18.17 => 2.18.17 
    gatsby-image: ^2.2.34 => 2.2.37 
    gatsby-plugin-codegen: ^1.0.9 => 1.0.10 
    gatsby-plugin-create-client-paths: ^2.1.20 => 2.1.20 
    gatsby-plugin-eslint: ^2.0.8 => 2.0.8 
    gatsby-plugin-manifest: ^2.2.30 => 2.2.34 
    gatsby-plugin-offline: ^3.0.24 => 3.0.30 
    gatsby-plugin-sharp: ^2.3.4 => 2.3.10 
    gatsby-plugin-typescript: ^2.1.20 => 2.1.23 
    gatsby-source-filesystem: ^2.1.39 => 2.1.43 
    gatsby-source-graphql: 2.1.29 => 2.1.29
    gatsby-transformer-sharp: ^2.3.6 => 2.3.9 

[vladar]

CC @yaacovCR

[yaacovCR]

Likely related to yaacovCR/graphql-tools-fork@a8f2785

Even vanilla schema stitching uses new generated variables to support serializing custom scalars.

I don't believe upstream graphql-tools or the fork ever filters the variables so the unused variable is still sent. This has not caused errors in my testing, but does waste bandwidth.

Curious if anyone knows details of whether this error is from the external GraphQL service and which one it is, surprised more people not getting this.

[yaacovCR]

Should be able to turn out fix by tomorrow.

[fourjuaneight]

@vladar This seems like it's resolved with the latest graphql-tools-fork. Could it get a version update so fix can published?

[goynang]

I'm seeing this error as well. Using Hasura to provide a GraphQL data source from a Postgres Database. Using the example code from the Gatsby docs I get the same error "unexpected variables in variableValues" when trying to load content into my template for CreatePage.

I'm also using 2.1.29 of gatsby-source-graphql.

Much thanks for a fix release.

[vladar]

Please try [email protected]. Feel free to re-open if it is still not fixed (or mention me to re-open with more details).

[fourjuaneight]

@vladar Working great. Thanks!