feat(schema): Inference controls and improvements

docs/blog/2019-04-23-improvements-to-schema-customization/index.md

@@ -0,0 +1,98 @@
+---
+title: Improvements to Schema Customization API - Available in Gatsby 2.4.0
+date: 2019-04-23
+author: Mikhail Novikov
+tags:
+  - schema
+  - graphql
+---
+
+Today we are releasing further improvements to the schema customization that [we've released in version 2.2.0](/blog/2019-03-18-releasing-new-schema-customization). You can use them with Gatsby 2.4.0.
+
+It is now possible to indicate to Gatsby, that you want to add a resolver to an explicitly defined fields. Use `addResolver` to add default arguments or/and resolvers to fields. In addition, when `@dontInfer` is set, Gatsby will no longer run inference for marked type, allowing one to improve performance for large data sets.
+
+## Summary
+
+After about a month of testing schema customization both here and in pre-release we determined a couple of issues. We set up to do this because we wanted to remove uncertainty in people's schemas, when the data changes. However, the original design allowed some uncertainties anyway. In addition, we have made inferrence a more heavy process, trading performance for consistency and didn't really provide a way to opt out of it completely. To summarize:
+
+- Resolvers and arguments of fields like Date and File was determined by inferred data
+- There was no easy way to use arguments/resolvers to override the above
+- Inferrence was run even when `@dontInfer` flag was on
+- There was no way to control inference outside of SDL, eg in Type Builders
+
+Therefore we have some changes to the way we do inferrence. In addition, we are deprecating some of the features introduced is 2.2.0 and will remove them in Gatsby 3.
+
+## noDefaultResolvers and inferrence modes
+
+First of all, we are deprecating `noDefaultResolvers`. It was an argument of `infer` and `dontInfer`. We feel it was confusing and in some cases it didn't even actually add resolvers :). We will support `noDefaultResolvers` until version 3, after which `@infer` behaviour (see below) will become a default and `noDefaultResolvers` will be removed.
+
+We didn't want to break things, so we keep old default behaviour, even though we think it's not optimal. Add explicit `@infer` and `@addResolver` to fields to be future proof.
+
+### Default (deprecated, removed in v3)
+
+Applies with no `@infer` and no `@dontInfer` on a type. Equals to `@infer(noDefaultResolvers: false)`.
+
+Type gets all inferred fields added. If type has defined fields of types `Date`, `File` and any other node, and we inferred that they should have resolver options, resolver options will be added to type with a warning.
+
+### Strict inference (future default in v3)
+
+Applies with `@infer` or `@infer(noDefaultResolvers: true)`.
+
+Type gets all inferred fields added. Existing fields won't automatically get resolvers (use `@addResolver` directive).
+
+### No inferrence
+
+Applies with `@dontInfer` or `@dontInfer(noDefaultResolvers: true)`.
+
+Inferrence won't run at all. Existing fields won't automatically get resolvers (use @addResolver directive).
+
+### No new fields with default resolvers (deprecated, removed in v3)
+
+Applies with `@dontInfer(noDefaultResolvers: false)`
+
+Inferrence will run, but fields won't be added. If type has defined fields of types `Date`, `File` and any other node, and we inferred that they should have resolvers/args, resolvers/args will be added to type with a warning.
+
+## `addResolver`
+
+Add resolver and resolver options (such as arguments) to the given field.
+
+```graphql
+type MyType @infer {
+  date: Date @addResolver(type: "dateformat", options: { formatString: "DD MMM", locale: "fi" })
+  image: File @addResolver(type: "fileByRelativePath")
+  authorByEmail: Author @addResolver(type: "link", { by: "email" })
+}
+```
+
+### Type Builders and extensions
+
+You can now apply configuration to type builder types through extension property on them.
+
+```js
+schema.createObjectType({
+  name: MyType,
+  extensions: {
+    infer: true,
+  },
+  fields: {
+    date: {
+      type: "Date",
+      extensions: {
+        addResolver: {
+          type: "dateformat",
+          options: { formatString: "DD MMM", locale: "fi" },
+        },
+      },
+    },
+  },
+})
+```
+
+## Conclusions
+
+With these improvements we hope we'll solve most of the issues that people are having with new schema customization. We are working on further improvements, like allowing users and plugins to define their own extensions (see [PR #13738](https://github.com/gatsbyjs/gatsby/pull/13738)).
+
+Useful links:
+
+- [createTypes Documentation](https://www.gatsbyjs.org/docs/actions/#createTypes)
+- [Umbrella issue for schema customization bug reports](https://github.com/gatsbyjs/gatsby/issues/12272)

packages/gatsby/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gatsby",
   "description": "Blazing fast modern site generator for React",
-  "version": "2.3.25",
+  "version": "2.4.0-alpha.3",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "bin": {
     "gatsby": "./dist/bin/gatsby.js"
@@ -73,7 +73,7 @@
     "glob": "^7.1.1",
     "got": "8.0.0",
     "graphql": "^14.1.1",
-    "graphql-compose": "6.0.3",
+    "graphql-compose": "^6.3.2",
     "graphql-playground-middleware-express": "^1.7.10",
     "hash-mod": "^0.0.5",
     "invariant": "^2.2.4",

packages/gatsby/src/redux/actions.js

@@ -1245,8 +1245,27 @@ import type GatsbyGraphQLType from "../schema/types/type-builders"
  *   with inferred field types, and default field resolvers for `Date` (which
  *   adds formatting options) and `File` (which resolves the field value as
  *   a `relativePath` foreign-key field) are added. This behavior can be
- *   customised with `@infer` and `@dontInfer` directives, and their
- *   `noDefaultResolvers` argument.
+ *   customised with `@infer`, `@dontInfer` and `@addResolvers` directives.
+ *
+ *
+ * Schema customization controls:
+ * * `@infer` - run inference on the type and add fields that don't exist on the
+ * defined type to it.
+ * * `@dontInfer` - don't run any inference on the type
+ * * `@addResolver` - add resolver options to a field. Args are `type` and
+ *   `options`. Type can be `dateformat`, `link` and `fileByRelativePath`.
+ *
+ * Resolver types:
+ * * `dateformat` - add date formatting arguments. Accepts `formatString` and
+ *   `locale` options that sets the defaults for this field
+ * * `link` - connect to a different Node. Arguments `by` and `from`, which
+ *   define which field to compare to on a remote node and which field to use on
+ *   the source node
+ * * `fileByRelativePath` - connect to a File node. Same arguments. The
+ *   difference from link is that this normalizes the relative path to be
+ *   relative from the path where source node is found.
+ *
+ *
  *
  * @example
  * exports.sourceNodes = ({ actions }) => {
@@ -1255,17 +1274,17 @@ import type GatsbyGraphQLType from "../schema/types/type-builders"
  *     """
  *     Markdown Node
  *     """
- *     type MarkdownRemark implements Node {
+ *     type MarkdownRemark implements Node @infer {
  *       frontmatter: Frontmatter!
  *     }
  *
  *     """
  *     Markdown Frontmatter
  *     """
- *     type Frontmatter {
+ *     type Frontmatter @infer {
  *       title: String!
- *       author: AuthorJson!
- *       date: Date!
+ *       author: AuthorJson! @addResolver(type: "link")
+ *       date: Date! @addResolver(type: "dateformat")
  *       published: Boolean!
  *       tags: [String!]!
  *     }
@@ -1274,9 +1293,9 @@ import type GatsbyGraphQLType from "../schema/types/type-builders"
  *     Author information
  *     """
  *     # Does not include automatically inferred fields
- *     type AuthorJson implements Node @dontInfer(noFieldResolvers: true) {
+ *     type AuthorJson implements Node @dontInfer {
  *       name: String!
- *       birthday: Date! # no default resolvers for Date formatting added
+ *       birthday: Date! @addResolver(type: "dateformat")
  *     }
  *   `
  *   createTypes(typeDefs)
@@ -1292,6 +1311,9 @@ import type GatsbyGraphQLType from "../schema/types/type-builders"
  *         frontmatter: 'Frontmatter!'
  *       },
  *       interfaces: ['Node'],
+ *       extensions: {
+ *         infer: true,
+ *       },
  *     }),
  *     schema.buildObjectType({
  *       name: 'Frontmatter',
@@ -1302,12 +1324,44 @@ import type GatsbyGraphQLType from "../schema/types/type-builders"
  *             return parent.title || '(Untitled)'
  *           }
  *         },
- *         author: 'AuthorJson!',
- *         date: 'Date!',
+ *         author: {
+ *           type: 'AuthorJson'
+ *           extensions: {
+ *             addResolver: {
+ *               type: 'link',
+ *             },
+ *           },
+ *         }
+ *         date: {
+ *           type: 'Date!'
+ *           extensions: {
+ *             addResolver: {
+ *               type: 'date',
+ *             },
+ *           },
+ *         },
  *         published: 'Boolean!',
  *         tags: '[String!]!',
  *       }
- *     })
+ *     }),
+ *     schema.buildObjectType({
+ *       name: 'AuthorJson',
+ *       fields: {
+ *         name: 'String!'
+ *         birthday: {
+ *           type: 'Date!'
+ *           extensions: {
+ *             addResolver: {
+ *               type: 'date',
+ *             },
+ *           },
+ *         },
+ *       },
+ *       interfaces: ['Node'],
+ *       extensions: {
+ *         infer: false,
+ *       },
+ *     }),
  *   ]
  *   createTypes(typeDefs)
  * }

packages/gatsby/src/schema/__tests__/__snapshots__/kitchen-sink.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Kichen sink schema test passes kitchen sink query 1`] = `
+exports[`Kitchen sink schema test passes kitchen sink query 1`] = `
 Object {
   "data": Object {
     "addResolvers": Array [
@@ -43,6 +43,7 @@ Object {
             "_3invalidKey": null,
             "code": "BShF_8qhtEv",
             "comment": 0,
+            "defaultTime": "05 huhtikuu",
             "id": "1486495736706552111",
             "idWithDecoration": "decoration-1486495736706552111",
             "image": Object {
@@ -51,6 +52,8 @@ Object {
               },
             },
             "likes": 8,
+            "localeFormat": "05 huhtikuu 2017",
+            "localeString": "05 апреля",
             "time": "05.04.2017",
           },
         },
@@ -59,6 +62,7 @@ Object {
             "_3invalidKey": null,
             "code": "BY6B8z5lR1F",
             "comment": 0,
+            "defaultTime": "11 syyskuu",
             "id": "1601601194425654597",
             "idWithDecoration": "decoration-1601601194425654597",
             "image": Object {
@@ -67,6 +71,8 @@ Object {
               },
             },
             "likes": 9,
+            "localeFormat": "11 syyskuu 2017",
+            "localeString": "11 сентября",
             "time": "11.09.2017",
           },
         },

packages/gatsby/src/schema/__tests__/kitchen-sink.js

@@ -1,7 +1,14 @@
 // @flow
 
 const { SchemaComposer } = require(`graphql-compose`)
-const { graphql } = require(`graphql`)
+const {
+  graphql,
+  GraphQLSchema,
+  GraphQLNonNull,
+  GraphQLList,
+  GraphQLObjectType,
+  getNamedType,
+} = require(`graphql`)
 const { store } = require(`../../redux`)
 const { build } = require(`../index`)
 const fs = require(`fs-extra`)
@@ -14,7 +21,7 @@ jest.mock(`../../utils/api-runner-node`)
 const apiRunnerNode = require(`../../utils/api-runner-node`)
 
 // XXX(freiksenet): Expand
-describe(`Kichen sink schema test`, () => {
+describe(`Kitchen sink schema test`, () => {
   let schema
 
   const runQuery = query =>
@@ -47,17 +54,20 @@ describe(`Kichen sink schema test`, () => {
     store.dispatch({
       type: `CREATE_TYPES`,
       payload: `
-        type PostsJson implements Node {
+        type PostsJson implements Node @infer {
           id: String!
-          time: Date
+          time: Date @addResolver(type: "dateformat", options: { locale: "fi", formatString: "DD MMMM"})
           code: String
+          image: File @addResolver(type: "fileByRelativePath")
         }
       `,
     })
-    store.dispatch({
-      type: `ADD_THIRD_PARTY_SCHEMA`,
-      payload: buildThirdPartySchema(),
-    })
+    buildThirdPartySchemas().forEach(schema =>
+      store.dispatch({
+        type: `ADD_THIRD_PARTY_SCHEMA`,
+        payload: schema,
+      })
+    )
     await build({})
     schema = store.getState().schema
   })
@@ -72,6 +82,9 @@ describe(`Kichen sink schema test`, () => {
                 id
                 idWithDecoration
                 time(formatString: "DD.MM.YYYY")
+                localeString: time(locale: "ru")
+                localeFormat: time(formatString: "DD MMMM YYYY")
+                defaultTime: time
                 code
                 likes
                 comment
@@ -130,9 +143,21 @@ describe(`Kichen sink schema test`, () => {
     `)
     ).toMatchSnapshot()
   })
+
+  it(`correctly resolves nested Query types from third-party types`, () => {
+    const queryFields = schema.getQueryType().getFields()
+    ;[`relay`, `relay2`, `query`, `manyQueries`].forEach(fieldName =>
+      expect(getNamedType(queryFields[fieldName].type)).toBe(
+        schema.getQueryType()
+      )
+    )
+    expect(schema.getType(`Nested`).getFields().query.type).toBe(
+      schema.getQueryType()
+    )
+  })
 })
 
-const buildThirdPartySchema = () => {
+const buildThirdPartySchemas = () => {
   const schemaComposer = new SchemaComposer()
   schemaComposer.addTypeDefs(`
     type ThirdPartyStuff {
@@ -205,7 +230,31 @@ const buildThirdPartySchema = () => {
   schemaComposer.addSchemaMustHaveType(
     schemaComposer.getOTC(`ThirdPartyStuff3`)
   )
-  return schemaComposer.buildSchema()
+
+  // Query type with non-default name
+  const RootQueryType = new GraphQLObjectType({
+    name: `RootQueryType`,
+    fields: () => {
+      return {
+        query: { type: RootQueryType },
+        manyQueries: {
+          type: new GraphQLNonNull(new GraphQLList(RootQueryType)),
+        },
+        nested: { type: Nested },
+      }
+    },
+  })
+  const Nested = new GraphQLObjectType({
+    name: `Nested`,
+    fields: () => {
+      return {
+        query: { type: RootQueryType },
+      }
+    },
+  })
+  const schema = new GraphQLSchema({ query: RootQueryType })
+
+  return [schemaComposer.buildSchema(), schema]
 }
 
 const mockSetFieldsOnGraphQLNodeType = async ({ type: { name } }) => {