fix: fix bad global check for graphql tag (gatsbyjs#6075)

gpetrioli · Jun 21, 2018 · c682a86 · c682a86
1 parent 3fb9c28
commit c682a86
Show file tree

Hide file tree

Showing 3 changed files with 70 additions and 5 deletions.
diff --git a/packages/babel-plugin-remove-graphql-queries/src/__tests__/__snapshots__/index.js.snap b/packages/babel-plugin-remove-graphql-queries/src/__tests__/__snapshots__/index.js.snap
@@ -26,6 +26,33 @@ exports[`Transforms queries in page components 1`] = `"export const query = \\"3
 
 exports[`allows the global tag 1`] = `"export const query = \\"3687030656\\";"`;
 
+exports[`distinguishes between the right tags 1`] = `
+"const foo = styled('div')\`
+     {
+       \${foo}
+     }
+  \`;
+const pulse = keyframes\`
+    0% {
+      transform: scale(1);
+      animation-timing-function: ease-in;
+    }
+    25% {
+      animation-timing-function: ease-out;
+      transform: scale(1.05);
+    }
+    50% {
+      transform: scale(1.12);
+      animation-timing-function: ease-in;
+    }
+    to {
+      transform: scale(1);
+      animation-timing-function: ease-out;
+    }
+  \`;
+export const query = \\"3687030656\\";"
+`;
+
 exports[`handles import aliasing 1`] = `"export const query = \\"3687030656\\";"`;
 
 exports[`handles require 1`] = `"export const query = \\"3687030656\\";"`;

diff --git a/packages/babel-plugin-remove-graphql-queries/src/__tests__/index.js b/packages/babel-plugin-remove-graphql-queries/src/__tests__/index.js
@@ -48,6 +48,44 @@ it(`allows the global tag`, () => {
   )
 })
 
+it(`distinguishes between the right tags`, () => {
+  matchesSnapshot(
+    `
+  const foo = styled('div')\`
+     {
+       $\{foo}
+     }
+  \`
+
+  const pulse = keyframes\`
+    0% {
+      transform: scale(1);
+      animation-timing-function: ease-in;
+    }
+    25% {
+      animation-timing-function: ease-out;
+      transform: scale(1.05);
+    }
+    50% {
+      transform: scale(1.12);
+      animation-timing-function: ease-in;
+    }
+    to {
+      transform: scale(1);
+      animation-timing-function: ease-out;
+    }
+  \`;
+
+
+  export const query = graphql\`
+     {
+       site { siteMetadata { title }}
+     }
+  \`
+  `
+  )
+})
+
 it(`handles import aliasing`, () => {
   matchesSnapshot(
     `

diff --git a/packages/babel-plugin-remove-graphql-queries/src/index.js b/packages/babel-plugin-remove-graphql-queries/src/index.js
@@ -3,6 +3,9 @@ const graphql = require(`gatsby/graphql`)
 const murmurhash = require(`./murmur`)
 const nodePath = require(`path`)
 
+const isGlobalIdentifier = tag =>
+  tag.isIdentifier({ name: `graphql` }) && tag.scope.hasGlobal(`graphql`)
+
 function getTagImport(tag) {
   const name = tag.node.name
   const binding = tag.scope.getBinding(name)
@@ -41,10 +44,7 @@ function isGraphqlTag(tag) {
   const identifier = isExpression ? tag.get(`object`) : tag
 
   const importPath = getTagImport(identifier)
-  if (!importPath)
-    return (
-      tag.scope.hasGlobal(`graphql`) && tag.isIdentifier({ name: `graphql` })
-    )
+  if (!importPath) return isGlobalIdentifier(tag)
 
   if (
     isExpression &&
@@ -87,7 +87,7 @@ function removeImport(tag) {
 
 function getGraphQLTag(path) {
   const tag = path.get(`tag`)
-  const isGlobal = tag.scope.hasGlobal(`graphql`)
+  const isGlobal = isGlobalIdentifier(tag)
 
   if (!isGlobal && !isGraphqlTag(tag)) return {}