From d7d1b97e69cc5fa8030722a792a56e6d30937d2d Mon Sep 17 00:00:00 2001
From: Max Stoiber <contact@mxstbr.com>
Date: Mon, 2 Nov 2020 08:29:04 +0100
Subject: [PATCH] fix(gatsby): show theme that has faulty config (#27708)

---
 .../src/structured-errors/error-map.ts        |  4 +++-
 .../load-plugins/__tests__/load-plugins.ts    |  3 +++
 .../src/bootstrap/load-plugins/index.ts       |  2 +-
 .../src/bootstrap/load-plugins/validate.ts    | 23 +++++++++++++++----
 4 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/packages/gatsby-cli/src/structured-errors/error-map.ts b/packages/gatsby-cli/src/structured-errors/error-map.ts
index 2632acb24b882..3648ebfe87714 100644
--- a/packages/gatsby-cli/src/structured-errors/error-map.ts
+++ b/packages/gatsby-cli/src/structured-errors/error-map.ts
@@ -468,7 +468,9 @@ const errors = {
     text: (context): string =>
       [
         stripIndent(`
-          Invalid plugin options for "${context.pluginName}":
+          Invalid plugin options for "${context.pluginName}"${
+          context.configDir ? `, configured by ${context.configDir}` : ``
+        }:
         `),
       ]
         .concat([``])
diff --git a/packages/gatsby/src/bootstrap/load-plugins/__tests__/load-plugins.ts b/packages/gatsby/src/bootstrap/load-plugins/__tests__/load-plugins.ts
index 9eab52afe0dc6..c8d98d76e1d31 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/__tests__/load-plugins.ts
+++ b/packages/gatsby/src/bootstrap/load-plugins/__tests__/load-plugins.ts
@@ -225,6 +225,7 @@ describe(`Load plugins`, () => {
         Array [
           Object {
             "context": Object {
+              "configDir": null,
               "pluginName": "gatsby-plugin-google-analytics",
               "validationErrors": Array [
                 Object {
@@ -262,6 +263,7 @@ describe(`Load plugins`, () => {
         Array [
           Object {
             "context": Object {
+              "configDir": null,
               "pluginName": "gatsby-plugin-google-analytics",
               "validationErrors": Array [
                 Object {
@@ -339,6 +341,7 @@ describe(`Load plugins`, () => {
         Array [
           Object {
             "context": Object {
+              "configDir": null,
               "pluginName": "gatsby-remark-autolink-headers",
               "validationErrors": Array [
                 Object {
diff --git a/packages/gatsby/src/bootstrap/load-plugins/index.ts b/packages/gatsby/src/bootstrap/load-plugins/index.ts
index e61898aa95f5e..296f1e9eeb708 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/index.ts
+++ b/packages/gatsby/src/bootstrap/load-plugins/index.ts
@@ -89,7 +89,7 @@ export async function loadPlugins(
 
   // Show errors for invalid plugin configuration
   if (process.env.GATSBY_EXPERIMENTAL_PLUGIN_OPTION_VALIDATION) {
-    await validateConfigPluginsOptions(config)
+    await validateConfigPluginsOptions(config, rootDir)
   }
 
   const currentAPIs = getAPI({
diff --git a/packages/gatsby/src/bootstrap/load-plugins/validate.ts b/packages/gatsby/src/bootstrap/load-plugins/validate.ts
index c4628dd83b145..b29107379e2e2 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/validate.ts
+++ b/packages/gatsby/src/bootstrap/load-plugins/validate.ts
@@ -1,4 +1,5 @@
 import _ from "lodash"
+import path from "path"
 import * as semver from "semver"
 import * as stringSimilarity from "string-similarity"
 import { version as gatsbyVersion } from "gatsby/package.json"
@@ -174,7 +175,8 @@ export async function handleBadExports({
 }
 
 async function validatePluginsOptions(
-  plugins: Array<IPluginRefObject>
+  plugins: Array<IPluginRefObject>,
+  rootDir: string | null
 ): Promise<{
   errors: number
   plugins: Array<IPluginRefObject>
@@ -227,16 +229,25 @@ async function validatePluginsOptions(
             errors: subErrors,
             plugins: subPlugins,
           } = await validatePluginsOptions(
-            plugin.options.plugins as Array<IPluginRefObject>
+            plugin.options.plugins as Array<IPluginRefObject>,
+            rootDir
           )
           plugin.options.plugins = subPlugins
           errors += subErrors
         }
       } catch (error) {
         if (error instanceof Joi.ValidationError) {
+          // If rootDir and plugin.parentDir are the same, i.e. if this is a plugin a user configured in their gatsby-config.js (and not a sub-theme that added it), this will be ""
+          // Otherwise, this will contain (and show) the relative path
+          const configDir =
+            (plugin.parentDir &&
+              rootDir &&
+              path.relative(rootDir, plugin.parentDir)) ||
+            null
           reporter.error({
             id: `11331`,
             context: {
+              configDir,
               validationErrors: error.details,
               pluginName: plugin.resolve,
             },
@@ -256,11 +267,15 @@ async function validatePluginsOptions(
 }
 
 export async function validateConfigPluginsOptions(
-  config: ISiteConfig = {}
+  config: ISiteConfig = {},
+  rootDir: string | null
 ): Promise<void> {
   if (!config.plugins) return
 
-  const { errors, plugins } = await validatePluginsOptions(config.plugins)
+  const { errors, plugins } = await validatePluginsOptions(
+    config.plugins,
+    rootDir
+  )
 
   config.plugins = plugins