fix(gatsby): fix subplugin validation

packages/gatsby-plugin-utils/src/types.ts

@@ -6,10 +6,14 @@
  * See gatsbyjs/gatsby#27578 and ping @laurieontech or @mxstbr if you have any questions
  */
 
-export interface ISiteConfig {
+export interface IRawSiteConfig {
   plugins?: Array<PluginRef>
 }
 
+export interface ISiteConfig extends IRawSiteConfig {
+  plugins?: Array<IPluginRefObject>
+}
+
 // There are two top-level "Plugin" concepts:
 // 1. IPluginInfo, for processed plugins, and
 // 2. PluginRef, for plugin configs

packages/gatsby/src/bootstrap/load-plugins/index.ts

@@ -13,7 +13,13 @@ import {
   ICurrentAPIs,
   validatePluginOptions,
 } from "./validate"
-import { IPluginInfo, IFlattenedPlugin, ISiteConfig } from "./types"
+import {
+  IPluginInfo,
+  IFlattenedPlugin,
+  ISiteConfig,
+  IRawSiteConfig,
+} from "./types"
+import { IPluginRefObject } from "gatsby-plugin-utils/dist/types"
 
 const getAPI = (
   api: { [exportType in ExportType]: { [api: string]: boolean } }
@@ -45,10 +51,35 @@ const flattenPlugins = (plugins: Array<IPluginInfo>): Array<IPluginInfo> => {
   return flattened
 }
 
+const normalizePlugins = (config: IRawSiteConfig = {}): ISiteConfig => {
+  return {
+    ...config,
+    plugins: (config.plugins || []).map(
+      (plugin): IPluginRefObject => {
+        if (typeof plugin === `string`)
+          return {
+            resolve: plugin,
+            options: {},
+          }
+
+        return plugin
+      }
+    ),
+  }
+}
+
 export async function loadPlugins(
-  config: ISiteConfig = {},
+  rawConfig: IRawSiteConfig = {},
   rootDir: string | null = null
 ): Promise<Array<IFlattenedPlugin>> {
+  // Turn all strings in plugins: [`...`] into the { resolve: ``, options: {} } form
+  const config = normalizePlugins(rawConfig)
+
+  // Show errors for invalid plugin configuration
+  if (process.env.GATSBY_EXPERIMENTAL_PLUGIN_OPTION_VALIDATION) {
+    await validatePluginOptions(config)
+  }
+
   const currentAPIs = getAPI({
     browser: browserAPIs,
     node: nodeAPIs,
@@ -72,11 +103,6 @@ export async function loadPlugins(
   // Show errors for any non-Gatsby APIs exported from plugins
   await handleBadExports({ currentAPIs, badExports })
 
-  // Show errors for invalid plugin configuration
-  if (process.env.GATSBY_EXPERIMENTAL_PLUGIN_OPTION_VALIDATION) {
-    await validatePluginOptions({ flattenedPlugins })
-  }
-
   // Show errors when ReplaceRenderer has been implemented multiple times
   flattenedPlugins = handleMultipleReplaceRenderers({
     flattenedPlugins,

packages/gatsby/src/bootstrap/load-plugins/load.ts

@@ -233,15 +233,20 @@ export function loadPlugins(
 
   // TypeScript support by default! use the user-provided one if it exists
   const typescriptPlugin = (config.plugins || []).find(
-    plugin =>
-      (plugin as IPluginRefObject).resolve === `gatsby-plugin-typescript` ||
-      plugin === `gatsby-plugin-typescript`
+    plugin => plugin.resolve === `gatsby-plugin-typescript`
   )
 
   if (typescriptPlugin === undefined) {
     plugins.push(
       processPlugin({
         resolve: require.resolve(`gatsby-plugin-typescript`),
+        options: {
+          // TODO(@mxstbr): Do not hard-code these defaults but infer them from the
+          // pluginOptionsSchema of gatsby-plugin-typescript
+          allExtensions: false,
+          isTSX: false,
+          jsxPragma: `React`,
+        },
       })
     )
   }

packages/gatsby/src/bootstrap/load-plugins/types.ts

@@ -1,7 +1,11 @@
-export interface ISiteConfig {
+export interface IRawSiteConfig {
   plugins?: Array<PluginRef>
 }
 
+export interface ISiteConfig extends IRawSiteConfig {
+  plugins?: Array<IPluginRefObject>
+}
+
 // There are two top-level "Plugin" concepts:
 // 1. IPluginInfo, for processed plugins, and
 // 2. PluginRef, for plugin configs

packages/gatsby/src/bootstrap/load-plugins/validate.ts

@@ -7,7 +7,12 @@ import { validateOptionsSchema, Joi } from "gatsby-plugin-utils"
 import { resolveModuleExports } from "../resolve-module-exports"
 import { getLatestAPIs } from "../../utils/get-latest-apis"
 import { GatsbyNode } from "../../../"
-import { IPluginInfo, IFlattenedPlugin } from "./types"
+import {
+  IPluginInfo,
+  IFlattenedPlugin,
+  IPluginInfoOptions,
+  ISiteConfig,
+} from "./types"
 
 interface IApi {
   version?: string
@@ -167,77 +172,76 @@ export async function handleBadExports({
   }
 }
 
-export async function validatePluginOptions({
-  flattenedPlugins,
-}: {
-  flattenedPlugins: Array<IPluginInfo & Partial<IFlattenedPlugin>>
-}): Promise<void> {
-  const errors = (
-    await Promise.all(
-      flattenedPlugins.map(
-        async (plugin): Promise<boolean | null> => {
-          if (plugin.nodeAPIs?.indexOf(`pluginOptionsSchema`) === -1)
-            return null
-
-          const gatsbyNode = require(`${plugin.resolve}/gatsby-node`)
-          if (!gatsbyNode.pluginOptionsSchema) return null
-
-          let optionsSchema = (gatsbyNode.pluginOptionsSchema as Exclude<
-            GatsbyNode["pluginOptionsSchema"],
-            undefined
-          >)({
-            Joi,
+export async function validatePluginOptions(
+  config: ISiteConfig = {}
+): Promise<void> {
+  if (!config.plugins) return
+
+  let errors = 0
+
+  config.plugins = await Promise.all(
+    config.plugins.map(async plugin => {
+      let gatsbyNode
+
+      try {
+        gatsbyNode = require(`${plugin.resolve}/gatsby-node`)
+      } catch (err) {
+        gatsbyNode = {}
+      }
+
+      if (!gatsbyNode.pluginOptionsSchema) return plugin
+
+      let optionsSchema = (gatsbyNode.pluginOptionsSchema as Exclude<
+        GatsbyNode["pluginOptionsSchema"],
+        undefined
+      >)({
+        Joi,
+      })
+
+      // Validate correct usage of pluginOptionsSchema
+      if (!Joi.isSchema(optionsSchema) || optionsSchema.type !== `object`) {
+        reporter.warn(
+          `Plugin "${plugin.resolve}" has an invalid options schema so we cannot verify your configuration for it.`
+        )
+        return plugin
+      }
+
+      try {
+        if (!optionsSchema.describe().keys.plugins) {
+          // All plugins have "plugins: []"" added to their options in load.ts, even if they
+          // do not have subplugins. We add plugins to the schema if it does not exist already
+          // to make sure they pass validation.
+          optionsSchema = optionsSchema.append({
+            plugins: Joi.array().length(0),
+          })
+        }
+
+        plugin.options = await validateOptionsSchema(
+          optionsSchema,
+          (plugin.options as IPluginInfoOptions) || {}
+        )
+      } catch (error) {
+        if (error instanceof Joi.ValidationError) {
+          reporter.error({
+            id: `11331`,
+            context: {
+              validationErrors: error.details,
+              pluginName: plugin.resolve,
+            },
           })
+          errors++
 
-          // Validate correct usage of pluginOptionsSchema
-          if (!Joi.isSchema(optionsSchema) || optionsSchema.type !== `object`) {
-            reporter.warn(
-              `Plugin "${plugin.name}" has an invalid options schema so we cannot verify your configuration for it.`
-            )
-            return null
-          }
-
-          try {
-            if (typeof plugin.pluginOptions === `undefined`) {
-              return null
-            }
-
-            if (!optionsSchema.describe().keys.plugins) {
-              // All plugins have "plugins: []"" added to their options in load.ts, even if they
-              // do not have subplugins. We add plugins to the schema if it does not exist already
-              // to make sure they pass validation.
-              optionsSchema = optionsSchema.append({
-                plugins: Joi.array().length(0),
-              })
-            }
-
-            plugin.pluginOptions = await validateOptionsSchema(
-              optionsSchema,
-              plugin.pluginOptions
-            )
-          } catch (error) {
-            if (error instanceof Joi.ValidationError) {
-              reporter.error({
-                id: `11331`,
-                context: {
-                  validationErrors: error.details,
-                  pluginName: plugin.name,
-                },
-              })
-
-              return true
-            }
-
-            throw error
-          }
-
-          return null
+          return plugin
         }
-      )
-    )
-  ).filter(Boolean)
 
-  if (errors.length > 0) {
+        throw error
+      }
+
+      return plugin
+    })
+  )
+
+  if (errors > 0) {
     process.exit(1)
   }
 }