For..of in codegen/core throw errors in programatic usage

[ceopaludetto]

Firstly, thanks for the library, I love graphql + typescript, but I have some issue in programmatic usage. Sorry about my english.

Describe the bug
When I use programmatic usage(creating a webpack plugin), for..of iteration in plugins object inside configuration, throw an error, but if I use like an array, for interation work's(because for..of is used for this purpose), see:

To Reproduce
Pass an object of plugins in config object on codegen, like:

const { codegen } = require("@graphql-codegen/core");

const config = {
  // ...rest of configuration,
  plugins: {
    typescript: { }
  },
  pluginMap: {
    typescript: require("@graphql-codegen/typescript")
  }
}

(async () => {
  try {
    const out = await codegen(config);
  } catch(err){
    throw new Error(err);
  }
})();

causes: options.plugins is not iterable,but if I pass an array:

const { codegen } = require("@graphql-codegen/core");

const config = {
  // ...rest of configuration,
  plugins: ["typescript"],
  pluginMap: {
    typescript: require("@graphql-codegen/typescript")
  }
}

(async () => {
  try {
    const out = await codegen(config);
  } catch(err){
    throw new Error(err);
  }
})();

causes: "Plugin 0 does not export a valid JS object with "plugin" function.\n"

1. My GraphQL schema:

Doesn't matters in this example

2. My GraphQL operations:

Doesn't matters in this example

3. My codegen.yml config file:

overwrite: true
schema: "./schema.gql"
documents: null
generates:
  src/generated/graphql.ts:
    config:
      scalars:
        Date: Date
    plugins:
      - "typescript"
      - "typescript-document-nodes"

Expected behavior
Read the required plugin and generate graphql types.

Environment:

• OS: Ubuntu 19.04 - Linux(5.0.0-20-generic)
• @graphql-codegen/...: 1.4.0
• NodeJS: 12.6

Additional context
I think the problem is localized in line 36 on codegen.ts file, because for..of loops can't be used on objects. Using for..in loops, the expected behavior will be achivied

Change file like them:

for(plugin in options.plugins){ // to use with object behavior, change of by in
    const name = plugin;
    const pluginPackage = options.pluginMap[name];
    const pluginConfig = options.plugins[name];

   // ...rest of snippet
}

ExecutePlugin function throw errors in package not containing plugin function(line 17 - execute-plugin.ts), but this iteration cannot resolve package because Object.keys(plugin)[0] (line 37 - codegen.ts) returns 0 every time.

[dotansimha]

Hi @SorEduard , can you please create a minimal reproduction in a repo or sandbox?
I tested it now and it seems to work, also in: https://github.com/dotansimha/graphql-code-generator/blob/master/website/live-demo/src/generate.ts

[ceopaludetto]

Hi, sorry for waiting, my college was on exams, i've created two repos, one with the plugin(where the error occurs), and another to test the plugin in webpack, just yarn or npm link the webpack plugin into the test.

Plugin: https://github.com/SorEduard/graphql-codegen-plugin
Test Project: https://github.com/SorEduard/graphql-codegen-test-project

Please change the approach from object to array in normalizeCodegenConfig method inside main class to see the two reproduction above. Thank's.

[dotansimha]

Hi @SorEduard
I checked that again.
The plugins input must be an array of object, there is no way around that.
The codegen core expects the type of plugins to be ConfiguredPlugin[] which is an array of objects, with key(plugin name)=>value(config).

This is because we allow to pass configuration per each plugin.
The goal of core package is to be simple as possible, and it expects everything to be provided as valid input.
I recommend you to use TypeScript, it will make it easier to understand, because you'll see the actual errors:

The correct form of the input should be an array with objects:

If you have an array, or object, or string, and you wish to transform it, you can use normalizeConfig.
I moved normalizeConfig and other normalize helpers functions into the @graphql-codegen/plugin-helpers package to make it easier to use it, without a dependency for the CLI package. It will be available in the next release.

[ceopaludetto]

Hi @dotansimha, thanks for the reply, i'll try to use with this approach. i'm not using typescript for this project, for sure i should. Does the webpack plugin package still exist? In readme of this npm package https://www.npmjs.com/package/graphql-codegen-webpack the showed approach isn't equal to the actual version, a webpack plugin increase substantially to the productivity, how about a new implementation?

[dotansimha]

@SorEduard We dropped support for Webpack plugin because we couldn't control the way it watches for file changes, and it was very difficult to sync the watch of Webpack with ours. See: #897 (comment)
We might give it another try in the future.

[dotansimha]

Fixed in 1.6.0