@khanacademy/graphql-flow 0.0.2 → 0.2.1

package/src/generateTypeFiles.js

@@ -0,0 +1,167 @@
+// @flow
+// Import this in your jest setup, to mock out graphql-tag!
+import type {DocumentNode} from 'graphql';
+import type {Options, Schema, Scalars} from './types';
+import fs from 'fs';
+import path from 'path';
+import {documentToFlowTypes} from '.';
+
+export type ExternalOptions = {
+    pragma?: string,
+    loosePragma?: string,
+    ignorePragma?: string,
+    scalars?: Scalars,
+    strictNullability?: boolean,
+    /**
+     * The command that users should run to regenerate the types files.
+     */
+    regenerateCommand?: string,
+    readOnlyArray?: boolean,
+    splitTypes?: boolean,
+    generatedDirectory?: string,
+    exportAllObjectTypes?: boolean,
+};
+
+export const indexPrelude = (regenerateCommand?: string): string => `// @flow
+//
+// AUTOGENERATED
+// NOTE: New response types are added to this file automatically.
+//       Outdated response types can be removed manually as they are deprecated.
+//${regenerateCommand ? '      To regenerate, run ' + regenerateCommand : ''}
+//
+
+`;
+
+export const generateTypeFileContents = (
+    fileName: string,
+    schema: Schema,
+    document: DocumentNode,
+    options: Options,
+    generatedDir: string,
+    indexContents: string,
+): {indexContents: string, files: {[key: string]: string}} => {
+    const files = {};
+
+    /// Write export for __generated__/index.js if it doesn't exist
+    const addToIndex = (filePath, typeName) => {
+        const newLine = `export type {${typeName}} from './${path.basename(
+            filePath,
+        )}';`;
+        if (indexContents.indexOf('./' + path.basename(filePath)) === -1) {
+            indexContents += newLine + '\n';
+        } else {
+            const lines = indexContents.split('\n').map((line) => {
+                if (line.includes('./' + path.basename(filePath))) {
+                    return newLine;
+                }
+                return line;
+            });
+            indexContents = lines.join('\n');
+        }
+    };
+
+    const generated = documentToFlowTypes(document, schema, options);
+    generated.forEach(({name, typeName, code, isFragment, extraTypes}) => {
+        // We write all generated files to a `__generated__` subdir to keep
+        // things tidy.
+        const targetFileName = `${name}.js`;
+        const targetPath = path.join(generatedDir, targetFileName);
+
+        let fileContents =
+            '// @' +
+            `flow\n// AUTOGENERATED -- DO NOT EDIT\n` +
+            `// Generated for operation '${name}' in file '../${path.basename(
+                fileName,
+            )}'\n` +
+            (options.regenerateCommand
+                ? `// To regenerate, run '${options.regenerateCommand}'.\n`
+                : '') +
+            code;
+        if (options.splitTypes && !isFragment) {
+            fileContents +=
+                `\nexport type ${name} = ${typeName}['response'];\n` +
+                `export type ${name}Variables = ${typeName}['variables'];\n`;
+        }
+        Object.keys(extraTypes).forEach((name) => {
+            fileContents += `\n\nexport type ${name} = ${extraTypes[name]};`;
+        });
+
+        addToIndex(targetPath, typeName);
+        files[targetPath] =
+            fileContents
+                // Remove whitespace from the ends of lines; babel's generate sometimes
+                // leaves them hanging around.
+                .replace(/\s+$/gm, '') + '\n';
+    });
+
+    return {files, indexContents};
+};
+
+export const generateTypeFiles = (
+    fileName: string,
+    schema: Schema,
+    document: DocumentNode,
+    options: Options,
+) => {
+    const generatedDir = path.join(
+        path.dirname(fileName),
+        options.generatedDirectory ?? '__generated__',
+    );
+    const indexFile = path.join(generatedDir, 'index.js');
+
+    if (!fs.existsSync(generatedDir)) {
+        fs.mkdirSync(generatedDir, {recursive: true});
+    }
+    if (!fs.existsSync(indexFile)) {
+        fs.writeFileSync(indexFile, indexPrelude(options.regenerateCommand));
+    }
+
+    const {indexContents, files} = generateTypeFileContents(
+        fileName,
+        schema,
+        document,
+        options,
+        generatedDir,
+        fs.readFileSync(indexFile, 'utf8'),
+    );
+
+    fs.writeFileSync(indexFile, indexContents);
+    Object.keys(files).forEach((key) => {
+        fs.writeFileSync(key, files[key]);
+    });
+
+    fs.writeFileSync(indexFile, indexContents);
+};
+
+export const processPragmas = (
+    options: ExternalOptions,
+    rawSource: string,
+): null | Options => {
+    if (options.ignorePragma && rawSource.includes(options.ignorePragma)) {
+        return null;
+    }
+
+    const autogen = options.loosePragma
+        ? rawSource.includes(options.loosePragma)
+        : false;
+    const autogenStrict = options.pragma
+        ? rawSource.includes(options.pragma)
+        : false;
+    const noPragmas = !options.loosePragma && !options.pragma;
+
+    if (autogen || autogenStrict || noPragmas) {
+        return {
+            regenerateCommand: options.regenerateCommand,
+            strictNullability: noPragmas
+                ? options.strictNullability
+                : autogenStrict || !autogen,
+            readOnlyArray: options.readOnlyArray,
+            scalars: options.scalars,
+            splitTypes: options.splitTypes,
+            generatedDirectory: options.generatedDirectory,
+            exportAllObjectTypes: options.exportAllObjectTypes,
+        };
+    } else {
+        return null;
+    }
+};

package/src/index.js

@@ -9,7 +9,11 @@
  */
 import type {DefinitionNode, DocumentNode} from 'graphql';
 
-import {generateResponseType} from './generateResponseType';
+import generate from '@babel/generator'; // eslint-disable-line flowtype-errors/uncovered
+import {
+    generateFragmentType,
+    generateResponseType,
+} from './generateResponseType';
 import {generateVariablesType} from './generateVariablesType';
 export {spyOnGraphqlTagToCollectQueries} from './jest-mock-graphql-tag';
 
@@ -36,6 +40,8 @@ const optionsToConfig = (
         fragments,
         schema,
         errors,
+        allObjectTypes: null,
+        path: [],
         ...internalOptions,
     };
 
@@ -58,6 +64,8 @@ export const documentToFlowTypes = (
     name: string,
     typeName: string,
     code: string,
+    isFragment?: boolean,
+    extraTypes: {[key: string]: string},
 }> => {
     const errors: Array<string> = [];
     const config = optionsToConfig(
@@ -68,21 +76,63 @@ export const documentToFlowTypes = (
     );
     const result = document.definitions
         .map((item) => {
+            if (item.kind === 'FragmentDefinition') {
+                const name = item.name.value;
+                const types = {};
+                const code = `export type ${name} = ${generateFragmentType(
+                    schema,
+                    item,
+                    {
+                        ...config,
+                        path: [name],
+                        allObjectTypes: options?.exportAllObjectTypes
+                            ? types
+                            : null,
+                    },
+                )};`;
+                const extraTypes: {[key: string]: string} = {};
+                Object.keys(types).forEach((k) => {
+                    // eslint-disable-next-line flowtype-errors/uncovered
+                    extraTypes[k] = generate(types[k]).code;
+                });
+                return {
+                    name,
+                    typeName: name,
+                    code,
+                    isFragment: true,
+                    extraTypes,
+                };
+            }
             if (
                 item.kind === 'OperationDefinition' &&
                 (item.operation === 'query' || item.operation === 'mutation') &&
                 item.name
             ) {
+                const types = {};
                 const name = item.name.value;
-                const response = generateResponseType(schema, item, config);
-                const variables = generateVariablesType(schema, item, config);
+                const response = generateResponseType(schema, item, {
+                    ...config,
+                    path: [name],
+                    allObjectTypes: options?.exportAllObjectTypes
+                        ? types
+                        : null,
+                });
+                const variables = generateVariablesType(schema, item, {
+                    ...config,
+                    path: [name],
+                });
 
                 const typeName = `${name}Type`;
                 // TODO(jared): Maybe make this template configurable?
                 // We'll see what's required to get webapp on board.
                 const code = `export type ${typeName} = {|\n    variables: ${variables},\n    response: ${response}\n|};`;
 
-                return {name, typeName, code};
+                const extraTypes: {[key: string]: string} = {};
+                Object.keys(types).forEach((k) => {
+                    // eslint-disable-next-line flowtype-errors/uncovered
+                    extraTypes[k] = generate(types[k]).code;
+                });
+                return {name, typeName, code, extraTypes};
             }
         })
         .filter(Boolean);

package/src/jest-mock-graphql-tag.js

@@ -1,119 +1,16 @@
 // @flow
 // Import this in your jest setup, to mock out graphql-tag!
 import type {DocumentNode, IntrospectionQuery} from 'graphql';
-import type {Schema, Options, Scalars} from './types';
 import {validate} from 'graphql/validation';
 import {buildClientSchema} from 'graphql';
 import {print} from 'graphql/language/printer';
 import {addTypenameToDocument} from 'apollo-utilities'; // eslint-disable-line flowtype-errors/uncovered
 import {schemaFromIntrospectionData} from './schemaFromIntrospectionData';
-
-const indexPrelude = (regenerateCommand?: string) => `// @flow
-//
-// AUTOGENERATED
-// NOTE: New response types are added to this file automatically.
-//       Outdated response types can be removed manually as they are deprecated.
-//${regenerateCommand ? '      To regenerate, run ' + regenerateCommand : ''}
-//
-
-`;
-
-const generateTypeFiles = (
-    schema: Schema,
-    document: DocumentNode,
-    options: Options,
-) => {
-    const {documentToFlowTypes} = require('.');
-    const path = require('path');
-    const fs = require('fs');
-    const format: ({text: string}) => string = require('prettier-eslint'); // eslint-disable-line flowtype-errors/uncovered
-
-    const indexFile = (generatedDir) => path.join(generatedDir, 'index.js');
-
-    const maybeCreateGeneratedDir = (generatedDir) => {
-        if (!fs.existsSync(generatedDir)) {
-            fs.mkdirSync(generatedDir, {recursive: true});
-
-            // Now write an index.js for each __generated__ dir.
-            fs.writeFileSync(
-                indexFile(generatedDir),
-                indexPrelude(options.regenerateCommand),
-            );
-        }
-    };
-
-    /// Write export for __generated__/index.js if it doesn't exist
-    const writeToIndex = (filePath, typeName) => {
-        const index = indexFile(path.dirname(filePath));
-        const indexContents = fs.readFileSync(index, 'utf8');
-        const newLine = `export type {${typeName}} from './${path.basename(
-            filePath,
-        )}';`;
-        if (indexContents.indexOf(path.basename(filePath)) === -1) {
-            fs.appendFileSync(index, newLine + '\n');
-        } else {
-            const lines = indexContents.split('\n').map((line) => {
-                if (line.includes(path.basename(filePath))) {
-                    return newLine;
-                }
-                return line;
-            });
-            fs.writeFileSync(index, lines.join('\n'));
-        }
-    };
-
-    // Get the name of the file that `gql` was called from
-    const errorLines = new Error().stack.split('\n');
-    const fileName = errorLines[3].split('(').slice(-1)[0].split(':')[0];
-
-    const generated = documentToFlowTypes(document, schema, options);
-    generated.forEach(({name, typeName, code}) => {
-        // We write all generated files to a `__generated__` subdir to keep
-        // things tidy.
-        const targetFileName = `${typeName}.js`;
-        const generatedDir = path.join(path.dirname(fileName), '__generated__');
-        const targetPath = path.join(generatedDir, targetFileName);
-
-        maybeCreateGeneratedDir(generatedDir);
-
-        // NOTE: Uncomment this to write the query definitions to disk if
-        // you need to add new features to the flow type generation
-        // fs.writeFileSync(
-        //     targetFileName + '.query',
-        //     JSON.stringify(definitions, null, 2),
-        // );
-        const fileContents = format({
-            text:
-                '// @' +
-                `flow\n// AUTOGENERATED -- DO NOT EDIT\n` +
-                `// Generated for operation '${name}' in file '../${path.basename(
-                    fileName,
-                )}'\n` +
-                (options.regenerateCommand
-                    ? `// To regenerate, run '${options.regenerateCommand}'.\n`
-                    : '') +
-                code,
-        });
-        fs.writeFileSync(targetPath, fileContents);
-
-        writeToIndex(targetPath, typeName);
-    });
-};
+import type {ExternalOptions} from './generateTypeFiles';
+import {generateTypeFiles, processPragmas} from './generateTypeFiles';
 
 type GraphqlTagFn = (raw: string, ...args: Array<any>) => DocumentNode;
 
-type SpyOptions = {
-    pragma?: string,
-    loosePragma?: string,
-    scalars?: Scalars,
-    strictNullability?: boolean,
-    /**
-     * The command that users should run to regenerate the types files.
-     */
-    regenerateCommand?: string,
-    readOnlyArray?: boolean,
-};
-
 /**
  * This function is expected to be called like so:
  *
@@ -133,11 +30,14 @@ type SpyOptions = {
  * If both pragma and loosePragma are empty, then all graphql
  * documents will be processed. Otherwise, only documents
  * with one of the pragmas will be processed.
+ * Any operations containing `ignorePragma` (if provided)
+ * will be skipped, regardless of whether they contain
+ * another specified pragma.
  */
 const spyOnGraphqlTagToCollectQueries = (
     realGraphqlTag: GraphqlTagFn,
     introspectionData: IntrospectionQuery,
-    options: SpyOptions = {},
+    options: ExternalOptions = {},
 ): GraphqlTagFn => {
     const collection: Array<{
         raw: string,
@@ -148,23 +48,42 @@ const spyOnGraphqlTagToCollectQueries = (
     const schema = schemaFromIntrospectionData(introspectionData);
 
     const wrapper = function gql() {
+        // Get the name of the file that `gql` was called from
+        const errorLines = new Error().stack.split('\n');
+        const fileName = errorLines[2].split('(').slice(-1)[0].split(':')[0];
+
         const document: DocumentNode = realGraphqlTag.apply(this, arguments); // eslint-disable-line flowtype-errors/uncovered
         const hasNonFragments = document.definitions.some(
             ({kind}) => kind !== 'FragmentDefinition',
         );
+
+        if (
+            fileName.includes('course-editor') ||
+            fileName.endsWith('_test.js') ||
+            fileName.endsWith('.fixture.js')
+        ) {
+            return document;
+        }
+
         if (hasNonFragments) {
             // eslint-disable-next-line flowtype-errors/uncovered
             const withTypeNames: DocumentNode = addTypenameToDocument(document);
-            collection.push({
-                raw: print(withTypeNames),
-                errors: validate(clientSchema, document),
-            });
 
             const rawSource: string = arguments[0].raw[0]; // eslint-disable-line flowtype-errors/uncovered
             const processedOptions = processPragmas(options, rawSource);
             if (processedOptions) {
-                generateTypeFiles(schema, withTypeNames, processedOptions);
+                generateTypeFiles(
+                    fileName,
+                    schema,
+                    withTypeNames,
+                    processedOptions,
+                );
             }
+            collection.push({
+                raw: print(withTypeNames),
+                errors: validate(clientSchema, document),
+                processed: !!processedOptions,
+            });
         }
         return document;
     };
@@ -172,33 +91,6 @@ const spyOnGraphqlTagToCollectQueries = (
     return wrapper;
 };
 
-const processPragmas = (
-    options: SpyOptions,
-    rawSource: string,
-): null | Options => {
-    const autogen = options.loosePragma
-        ? rawSource.includes(options.loosePragma)
-        : false;
-    const autogenStrict = options.pragma
-        ? rawSource.includes(options.pragma)
-        : false;
-    const noPragmas = !options.loosePragma && !options.pragma;
-
-    if (autogen || autogenStrict || noPragmas) {
-        return {
-            regenerateCommand: options.regenerateCommand,
-            strictNullability: noPragmas
-                ? options.strictNullability
-                : autogenStrict || !autogen,
-            readOnlyArray: options.readOnlyArray,
-            scalars: options.scalars,
-        };
-    } else {
-        return null;
-    }
-};
-
 module.exports = {
-    processPragmas,
     spyOnGraphqlTagToCollectQueries,
 };