@khanacademy/graphql-flow 0.0.1 → 0.0.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @khanacademy/graphql-flow
 
+## 0.0.2
+
+### Patch Changes
+
+-   9810bfe: Allow customization of the "regenerate command" that's in the file docstrings
+-   7d27337: Support custom scalars as variables in an operation
+
 ## 0.0.1
 
 ### Patch Changes

package/Readme.md

@@ -94,10 +94,11 @@ Then you'll want to make a pseudo-'test' that makes sure to 'require' all of the
 jest will process them and our mock will see them. 
 ```js
 // generate-types.test.js
-import {findFilesWithQueries} from '../tools/graphql-flow/find-files-with-gql';
+import {findGraphqlTagReferences} from '../tools/graphql-flow/find-files-with-gql';
+import path from 'path';
 
 if (process.env.GRAPHQL_FLOW) {
-    findFilesWithQueries(path.join(__dirname, '..')).forEach(name => {
+    findGraphqlTagReferences(path.join(__dirname, '..')).forEach(name => {
         require(name);
     });
 

package/dist/generateVariablesType.js

@@ -104,6 +104,12 @@ const _variableToFlow = (config, type) => {
       return (0, _enums.enumTypeToFlow)(config, type.name.value);
     }
 
+    const customScalarType = config.scalars[type.name.value];
+
+    if (customScalarType) {
+      return babelTypes.genericTypeAnnotation(babelTypes.identifier(customScalarType));
+    }
+
     return inputObjectToFlow(config, type.name.value);
   }
 

package/dist/generateVariablesType.js.flow

@@ -117,6 +117,12 @@ const _variableToFlow = (config: Config, type: TypeNode) => {
         if (config.schema.enumsByName[type.name.value]) {
             return enumTypeToFlow(config, type.name.value);
         }
+        const customScalarType = config.scalars[type.name.value];
+        if (customScalarType) {
+            return babelTypes.genericTypeAnnotation(
+                babelTypes.identifier(customScalarType),
+            );
+        }
         return inputObjectToFlow(config, type.name.value);
     }
     if (type.kind === 'ListType') {

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

@@ -12,11 +12,12 @@ var _schemaFromIntrospectionData = require("./schemaFromIntrospectionData");
 
 // Import this in your jest setup, to mock out graphql-tag!
 // eslint-disable-line flowtype-errors/uncovered
-const indexPrelude = `// @flow
+const indexPrelude = regenerateCommand => `// @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 : ''}
 //
 
 `;
@@ -41,7 +42,7 @@ const generateTypeFiles = (schema, document, options) => {
         recursive: true
       }); // Now write an index.js for each __generated__ dir.
 
-      fs.writeFileSync(indexFile(generatedDir), indexPrelude);
+      fs.writeFileSync(indexFile(generatedDir), indexPrelude(options.regenerateCommand));
     }
   }; /// Write export for __generated__/index.js if it doesn't exist
 
@@ -87,31 +88,33 @@ const generateTypeFiles = (schema, document, options) => {
     // );
 
     const fileContents = format({
-      text: '// @' + `flow\n// AUTOGENERATED -- DO NOT EDIT\n` + `// Generated for operation '${name}' in file '../${path.basename(fileName)}'\n` + `// To regenerate, run 'yarn test queries'.\n` + code
+      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);
   });
 };
 
-// This function is expected to be called like so:
-//
-// jest.mock('graphql-tag', () => {
-//     const introspectionData = jest.requireActual(
-//         './our-introspection-query.json',
-//     );
-//     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
-//         'graphql-flow/jest-mock-graphql-tag.js');
-//
-//     return spyOnGraphqlTagToCollectQueries(
-//         jest.requireActual('graphql-tag'),
-//         introspectionData,
-//     );
-// });
-//
-// 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.
+/**
+ * This function is expected to be called like so:
+ *
+ * jest.mock('graphql-tag', () => {
+ *     const introspectionData = jest.requireActual(
+ *         './server-introspection-response.json',
+ *     );
+ *     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
+ *         'graphql-flow/jest-mock-graphql-tag.js');
+ *
+ *     return spyOnGraphqlTagToCollectQueries(
+ *         jest.requireActual('graphql-tag'),
+ *         introspectionData,
+ *     );
+ * });
+ *
+ * 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.
+ */
 const spyOnGraphqlTagToCollectQueries = (realGraphqlTag, introspectionData, options = {}) => {
   const collection = [];
   const clientSchema = (0, _graphql.buildClientSchema)(introspectionData);
@@ -154,6 +157,7 @@ const processPragmas = (options, rawSource) => {
 
   if (autogen || autogenStrict || noPragmas) {
     return {
+      regenerateCommand: options.regenerateCommand,
       strictNullability: noPragmas ? options.strictNullability : autogenStrict || !autogen,
       readOnlyArray: options.readOnlyArray,
       scalars: options.scalars

package/dist/jest-mock-graphql-tag.js.flow

@@ -8,11 +8,12 @@ import {print} from 'graphql/language/printer';
 import {addTypenameToDocument} from 'apollo-utilities'; // eslint-disable-line flowtype-errors/uncovered
 import {schemaFromIntrospectionData} from './schemaFromIntrospectionData';
 
-const indexPrelude = `// @flow
+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 : ''}
 //
 
 `;
@@ -34,7 +35,10 @@ const generateTypeFiles = (
             fs.mkdirSync(generatedDir, {recursive: true});
 
             // Now write an index.js for each __generated__ dir.
-            fs.writeFileSync(indexFile(generatedDir), indexPrelude);
+            fs.writeFileSync(
+                indexFile(generatedDir),
+                indexPrelude(options.regenerateCommand),
+            );
         }
     };
 
@@ -85,7 +89,9 @@ const generateTypeFiles = (
                 `// Generated for operation '${name}' in file '../${path.basename(
                     fileName,
                 )}'\n` +
-                `// To regenerate, run 'yarn test queries'.\n` +
+                (options.regenerateCommand
+                    ? `// To regenerate, run '${options.regenerateCommand}'.\n`
+                    : '') +
                 code,
         });
         fs.writeFileSync(targetPath, fileContents);
@@ -101,27 +107,33 @@ type SpyOptions = {
     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:
-//
-// jest.mock('graphql-tag', () => {
-//     const introspectionData = jest.requireActual(
-//         './our-introspection-query.json',
-//     );
-//     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
-//         'graphql-flow/jest-mock-graphql-tag.js');
-//
-//     return spyOnGraphqlTagToCollectQueries(
-//         jest.requireActual('graphql-tag'),
-//         introspectionData,
-//     );
-// });
-//
-// 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.
+/**
+ * This function is expected to be called like so:
+ *
+ * jest.mock('graphql-tag', () => {
+ *     const introspectionData = jest.requireActual(
+ *         './server-introspection-response.json',
+ *     );
+ *     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
+ *         'graphql-flow/jest-mock-graphql-tag.js');
+ *
+ *     return spyOnGraphqlTagToCollectQueries(
+ *         jest.requireActual('graphql-tag'),
+ *         introspectionData,
+ *     );
+ * });
+ *
+ * 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.
+ */
 const spyOnGraphqlTagToCollectQueries = (
     realGraphqlTag: GraphqlTagFn,
     introspectionData: IntrospectionQuery,
@@ -174,6 +186,7 @@ const processPragmas = (
 
     if (autogen || autogenStrict || noPragmas) {
         return {
+            regenerateCommand: options.regenerateCommand,
             strictNullability: noPragmas
                 ? options.strictNullability
                 : autogenStrict || !autogen,

package/dist/types.js.flow

@@ -14,6 +14,7 @@ import type {
 export type Selections = $ReadOnlyArray<SelectionNode>;
 
 export type Options = {|
+    regenerateCommand?: string,
     strictNullability?: boolean, // default true
     readOnlyArray?: boolean, // default true
     scalars?: Scalars,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@khanacademy/graphql-flow",
-    "version": "0.0.1",
+    "version": "0.0.2",
     "scripts": {
         "test": "jest",
         "publish:ci": "yarn run build && yarn run copy-flow && changeset publish",
@@ -11,30 +11,30 @@
     "devDependencies": {
         "@babel/cli": "^7.17.6",
         "@babel/eslint-parser": "^7.17.0",
+        "@babel/polyfill": "^7.0.0",
+        "@babel/preset-env": "^7.16.11",
+        "@babel/preset-flow": "^7.16.7",
+        "babel-jest": "23.4.2",
         "@changesets/cli": "^2.21.1",
         "@khanacademy/eslint-config": "^0.1.0",
         "eslint": "8.7.0",
         "eslint-config-prettier": "7.0.0",
+        "eslint-plugin-flowtype": "^8.0.3",
         "eslint-plugin-flowtype-errors": "^4.5.0",
         "eslint-plugin-jsx-a11y": "^6.5.1",
         "eslint-plugin-prettier": "^4.0.0",
         "eslint-plugin-react": "^7.29.2",
         "eslint-plugin-react-hooks": "^4.3.0",
+        "graphql-tag": "2.10.1",
         "flow-bin": "^0.172.0",
         "jest": "^27.5.1"
     },
     "dependencies": {
         "@babel/core": "^7.6.2",
         "@babel/generator": "^7.17.3",
-        "@babel/polyfill": "^7.0.0",
-        "@babel/preset-env": "^7.16.11",
-        "@babel/preset-flow": "^7.16.7",
         "@babel/types": "^7.17.0",
         "apollo-utilities": "^1.3.4",
-        "babel-jest": "23.4.2",
-        "eslint-plugin-flowtype": "^8.0.3",
         "graphql": "14.2.1",
-        "graphql-tag": "2.10.1",
         "prettier": "^2.5.1",
         "prettier-eslint": "^13.0.0"
     }

package/src/__test__/example-schema.graphql

@@ -49,6 +49,7 @@ type Query {
   human(id: String!): Human
   droid(id: String!): Droid
   friend(id: String!): Friendable
+  candies(number: PositiveNumber!): String
 }
 
 """A character to add"""
@@ -58,6 +59,7 @@ input CharacterInput {
   """The character's friends"""
   friends: [ID!]
   appearsIn: [Episode!]
+  candies: PositiveNumber!
 }
 
 type Mutation {

package/src/__test__/graphql-flow.test.js

@@ -52,6 +52,25 @@ const rawQueryToFlowTypes = (query: string, options?: Options): string => {
 };
 
 describe('graphql-flow generation', () => {
+    it('should allow custom scalars as input', () => {
+        const result = rawQueryToFlowTypes(`
+            query SomeQuery($candies: PositiveNumber!) {
+                candies(number: $candies)
+            }
+        `);
+
+        expect(result).toMatchInlineSnapshot(`
+            export type SomeQueryType = {|
+                variables: {|
+              candies: number
+            |},
+                response: {|
+              candies: ?string
+            |}
+            |};
+        `);
+    });
+
     it('should work with a basic query', () => {
         const result = rawQueryToFlowTypes(`
             query SomeQuery {
@@ -350,6 +369,7 @@ describe('graphql-flow generation', () => {
                     - EMPIRE
                     - JEDI*/
                     "NEW_HOPE" | "EMPIRE" | "JEDI">,
+                    candies: number,
                   |}
                 |},
                     response: {|

package/src/generateVariablesType.js

@@ -117,6 +117,12 @@ const _variableToFlow = (config: Config, type: TypeNode) => {
         if (config.schema.enumsByName[type.name.value]) {
             return enumTypeToFlow(config, type.name.value);
         }
+        const customScalarType = config.scalars[type.name.value];
+        if (customScalarType) {
+            return babelTypes.genericTypeAnnotation(
+                babelTypes.identifier(customScalarType),
+            );
+        }
         return inputObjectToFlow(config, type.name.value);
     }
     if (type.kind === 'ListType') {

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

@@ -8,11 +8,12 @@ import {print} from 'graphql/language/printer';
 import {addTypenameToDocument} from 'apollo-utilities'; // eslint-disable-line flowtype-errors/uncovered
 import {schemaFromIntrospectionData} from './schemaFromIntrospectionData';
 
-const indexPrelude = `// @flow
+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 : ''}
 //
 
 `;
@@ -34,7 +35,10 @@ const generateTypeFiles = (
             fs.mkdirSync(generatedDir, {recursive: true});
 
             // Now write an index.js for each __generated__ dir.
-            fs.writeFileSync(indexFile(generatedDir), indexPrelude);
+            fs.writeFileSync(
+                indexFile(generatedDir),
+                indexPrelude(options.regenerateCommand),
+            );
         }
     };
 
@@ -85,7 +89,9 @@ const generateTypeFiles = (
                 `// Generated for operation '${name}' in file '../${path.basename(
                     fileName,
                 )}'\n` +
-                `// To regenerate, run 'yarn test queries'.\n` +
+                (options.regenerateCommand
+                    ? `// To regenerate, run '${options.regenerateCommand}'.\n`
+                    : '') +
                 code,
         });
         fs.writeFileSync(targetPath, fileContents);
@@ -101,27 +107,33 @@ type SpyOptions = {
     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:
-//
-// jest.mock('graphql-tag', () => {
-//     const introspectionData = jest.requireActual(
-//         './our-introspection-query.json',
-//     );
-//     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
-//         'graphql-flow/jest-mock-graphql-tag.js');
-//
-//     return spyOnGraphqlTagToCollectQueries(
-//         jest.requireActual('graphql-tag'),
-//         introspectionData,
-//     );
-// });
-//
-// 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.
+/**
+ * This function is expected to be called like so:
+ *
+ * jest.mock('graphql-tag', () => {
+ *     const introspectionData = jest.requireActual(
+ *         './server-introspection-response.json',
+ *     );
+ *     const {spyOnGraphqlTagToCollectQueries} = jest.requireActual(
+ *         'graphql-flow/jest-mock-graphql-tag.js');
+ *
+ *     return spyOnGraphqlTagToCollectQueries(
+ *         jest.requireActual('graphql-tag'),
+ *         introspectionData,
+ *     );
+ * });
+ *
+ * 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.
+ */
 const spyOnGraphqlTagToCollectQueries = (
     realGraphqlTag: GraphqlTagFn,
     introspectionData: IntrospectionQuery,
@@ -174,6 +186,7 @@ const processPragmas = (
 
     if (autogen || autogenStrict || noPragmas) {
         return {
+            regenerateCommand: options.regenerateCommand,
             strictNullability: noPragmas
                 ? options.strictNullability
                 : autogenStrict || !autogen,

package/src/types.js

@@ -14,6 +14,7 @@ import type {
 export type Selections = $ReadOnlyArray<SelectionNode>;
 
 export type Options = {|
+    regenerateCommand?: string,
     strictNullability?: boolean, // default true
     readOnlyArray?: boolean, // default true
     scalars?: Scalars,