gatsby-source-graphql no longer working with context variables

Description

After upgrading to gatsby-source-graphql@2.1.29, 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, gatsby-source-graphql@2.1.28, 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 

[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.

[fourjuaneight]

@vladar Working great. Thanks!