Jest: TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

[shaneog]

When testing using Jest, I receive the following error when running babel.transform. I am using the test code defined in the README of this plugin.

import myImportedQuery from "./queries/productsQuery.graphql";

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

      at defaultResolve (node_modules/babel-plugin-import-graphql/build/requireGql.js:33:50)
      at PluginPass.exit (node_modules/babel-plugin-import-graphql/build/index.js:73:27)
      at newFn (node_modules/@babel/traverse/lib/visitors.js:177:21)
      at NodePath._call (node_modules/@babel/traverse/lib/path/context.js:53:20)
      at NodePath.call (node_modules/@babel/traverse/lib/path/context.js:40:17)
      at NodePath.visit (node_modules/@babel/traverse/lib/path/context.js:99:8)
      at TraversalContext.visitQueue (node_modules/@babel/traverse/lib/context.js:103:16)

I have put together the simplest possible reproduction of this here: https://github.com/shaneog/babel-transform-graphql-example

$ node --version
v14.18.1
$ npm --version
6.14.15

When Babel is run manually (npx babel test/fixtures --out-dir dist) the code is transpiled correctly (formatted for ease of viewing):

Click to see the formatted, transpiled JS

var myImportedQuery = {
  kind: "Document",
  definitions: [
    {
      kind: "OperationDefinition",
      operation: "query",
      name: { kind: "Name", value: "products" },
      variableDefinitions: [],
      directives: [],
      selectionSet: {
        kind: "SelectionSet",
        selections: [
          {
            kind: "Field",
            name: { kind: "Name", value: "products" },
            arguments: [],
            directives: [],
            selectionSet: {
              kind: "SelectionSet",
              selections: [
                {
                  kind: "Field",
                  name: { kind: "Name", value: "productId" },
                  arguments: [],
                  directives: [],
                },
                {
                  kind: "FragmentSpread",
                  name: { kind: "Name", value: "productFragment" },
                  directives: [],
                },
              ],
            },
          },
        ],
      },
    },
    {
      kind: "FragmentDefinition",
      name: { kind: "Name", value: "productFragment" },
      typeCondition: {
        kind: "NamedType",
        name: { kind: "Name", value: "Product" },
      },
      directives: [],
      selectionSet: {
        kind: "SelectionSet",
        selections: [
          {
            kind: "Field",
            name: { kind: "Name", value: "name" },
            arguments: [],
            directives: [],
          },
          {
            kind: "Field",
            name: { kind: "Name", value: "description" },
            arguments: [],
            directives: [],
          },
          {
            kind: "Field",
            name: { kind: "Name", value: "weight" },
            arguments: [],
            directives: [],
          },
        ],
      },
    },
  ],
  loc: {
    start: 0,
    end: 109,
    source: {
      body: '#import "./productFragment.graphql"\nquery products {\n  products {\n    productId\n    ...productFragment\n  }\n}\n',
      name: "GraphQL request",
      locationOffset: { line: 1, column: 1 },
    },
  },
};

This bug seems to be similar to #79.

[shaneog]

A deeper dive has led me to https://github.com/detrohutt/babel-plugin-import-graphql/blob/master/plugin/index.js#L19 which assumes that the plugin is acting on a file, and not the contents of a file. I've fixed my issue by using babel.transformFileSync and passing in the filename, rather than using babel.transform and passing in the file contents.

I'll leave this issue open for your attention.

[punksta]

I am getting similar issue after upgrading react-native to 0.69.5 and babel "^7.18.6",