From 43106ca5efcae5ca3796215235af6f0740635e1c Mon Sep 17 00:00:00 2001 From: mfrachet Date: Mon, 30 Nov 2020 11:39:55 +0100 Subject: [PATCH 1/2] test(create-gatsby): snapshotting plugin-options-form --- .../src/__tests__/plugin-options-form.ts | 140 ++++++++++++++++++ .../create-gatsby/src/plugin-options-form.ts | 65 ++++---- 2 files changed, 175 insertions(+), 30 deletions(-) create mode 100644 packages/create-gatsby/src/__tests__/plugin-options-form.ts diff --git a/packages/create-gatsby/src/__tests__/plugin-options-form.ts b/packages/create-gatsby/src/__tests__/plugin-options-form.ts new file mode 100644 index 0000000000000..97f2aa18496e1 --- /dev/null +++ b/packages/create-gatsby/src/__tests__/plugin-options-form.ts @@ -0,0 +1,140 @@ +import { makePluginConfigQuestions } from "../plugin-options-form" +import pluginSchemas from "../plugin-schemas.json" + +describe(`plugin-options-form`, () => { + it(`returns an empty array when nothing is passed`, () => { + const plugins = [] + expect(makePluginConfigQuestions(plugins)).toEqual([]) + }) + + it(`returns an empty array when the plugin is not available for configu`, () => { + const plugins = [`not-valid-plugin`] + expect(makePluginConfigQuestions(plugins)).toEqual([]) + }) + + it(`returns an arry containing only the wordpress options (choices are included)`, () => { + const plugins = [`gatsby-source-wordpress-experimental`] + expect(makePluginConfigQuestions(plugins)).toEqual([ + { + type: `forminput`, + name: `gatsby-source-wordpress-experimental`, + multiple: true, + message: `Configure the WordPress plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-wordpress-experimental/\u001b[39m for help.`, + choices: [ + { + name: `url`, + message: `url`, + hint: `This should be the full url of your GraphQL endpoint set up by WP GraphQL`, + }, + ], + }, + ]) + }) + + it(`returns an array with all the plugins schemas`, () => { + expect(makePluginConfigQuestions(Object.keys(pluginSchemas))).toEqual([ + { + type: `forminput`, + name: `gatsby-source-wordpress-experimental`, + multiple: true, + message: `Configure the WordPress plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-wordpress-experimental/\u001b[39m for help.`, + choices: [ + { + name: `url`, + message: `url`, + hint: `This should be the full url of your GraphQL endpoint set up by WP GraphQL`, + }, + ], + }, + { + type: `forminput`, + name: `gatsby-source-contentful`, + multiple: true, + message: `Configure the Contentful plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-contentful/\u001b[39m for help.\n\u001b[32mUse arrow keys to move between fields, and enter to finish\u001b[39m`, + choices: [ + { + name: `accessToken`, + message: `accessToken`, + hint: `Contentful delivery api key, when using the Preview API use your Preview API key`, + }, + { name: `spaceId`, message: `spaceId`, hint: `Contentful spaceId` }, + ], + }, + { + type: `forminput`, + name: `gatsby-source-sanity`, + multiple: true, + message: `Configure the Sanity plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-sanity/\u001b[39m for help.\n\u001b[32mUse arrow keys to move between fields, and enter to finish\u001b[39m`, + choices: [ + { + name: `projectId`, + message: `projectId`, + hint: `Your Sanity project's ID`, + }, + { + name: `dataset`, + message: `dataset`, + hint: `The dataset to fetch from`, + }, + ], + }, + { + type: `forminput`, + name: `gatsby-source-shopify`, + multiple: true, + message: `Configure the Shopify plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-shopify/\u001b[39m for help.\n\u001b[32mUse arrow keys to move between fields, and enter to finish\u001b[39m`, + choices: [ + { + name: `shopName`, + message: `shopName`, + hint: `The domain name of your Shopify shop`, + }, + { + name: `accessToken`, + message: `accessToken`, + hint: `An API access token to your Shopify shop`, + }, + ], + }, + { + type: `forminput`, + name: `gatsby-source-datocms`, + multiple: true, + message: `Configure the DatoCMS plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-datocms/\u001b[39m for help.`, + choices: [ + { + name: `apiToken`, + message: `apiToken`, + hint: `Your read-only API token under the Settings > API tokens section of your administrative area in DatoCMS`, + }, + ], + }, + { + type: `forminput`, + name: `gatsby-source-agility`, + multiple: true, + message: `Configure the gatsby-source-agility plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-source-agility/\u001b[39m for help.`, + choices: [ + { + name: `guid`, + message: `guid`, + hint: `your Agility Content Fetch API Guid`, + }, + ], + }, + { + type: `forminput`, + name: `gatsby-plugin-google-analytics`, + multiple: true, + message: `Configure the gatsby-plugin-google-analytics plugin.\nSee \u001b[94mhttps://www.gatsbyjs.com/plugins/gatsby-plugin-google-analytics/\u001b[39m for help.`, + choices: [ + { + name: `trackingId`, + message: `trackingId`, + hint: `The property ID; the tracking code won't be generated without it`, + }, + ], + }, + ]) + }) +}) diff --git a/packages/create-gatsby/src/plugin-options-form.ts b/packages/create-gatsby/src/plugin-options-form.ts index 5081e51ce51a2..9c63a215b8bfc 100644 --- a/packages/create-gatsby/src/plugin-options-form.ts +++ b/packages/create-gatsby/src/plugin-options-form.ts @@ -16,17 +16,22 @@ type Schema = Joi.Description & { type PluginName = keyof typeof pluginSchemas +interface IChoice { + name: string + initial: unknown + message: string + hint?: string +} +type Choices = Array + +type Option = Record | undefined + interface IFormPrompt { type: string name: string multiple: boolean message: string - choices: Array<{ - name: string - initial: unknown - message: string - hint?: string - }> + choices: Choices } function getName(key: string): string | undefined { @@ -49,6 +54,22 @@ function docsLink(pluginName: string): string { ) } +const isOptionRequired = ([_, option]: [string, Schema]): boolean => + option?.flags?.presence === `required` + +const schemaToChoice = ([name, option]: [string, Schema]): IChoice => { + const hasDefaultValue = + option.flags?.default && + supportedOptionTypes.includes(typeof option.flags?.default) + + return { + name, + initial: hasDefaultValue ? option.flags?.default.toString() : undefined, + message: name, + hint: option.flags?.description, + } +} + export const makePluginConfigQuestions = ( selectedPlugins: Array ): Array => { @@ -56,44 +77,27 @@ export const makePluginConfigQuestions = ( selectedPlugins.forEach((pluginName: string): void => { const schema = pluginSchemas[pluginName as PluginName] + if (!schema || typeof schema === `string` || !(`keys` in schema)) { return } - const options: Record | undefined = schema?.keys - const choices: Array<{ - name: string - initial: string - message: string - hint?: string - }> = [] + const options: Option = schema?.keys if (!options) { return } - Object.entries(options).forEach(([name, option]) => { - if (option?.flags?.presence !== `required`) { - return - } - choices.push({ - name, - initial: - option.flags?.default && - supportedOptionTypes.includes(typeof option.flags?.default) - ? option.flags?.default.toString() - : undefined, - message: name, - hint: option.flags?.description, - }) - }) + const choices: Choices = Object.entries(options) + .filter(isOptionRequired) + .map(schemaToChoice) - if (choices.length) { + if (choices.length > 0) { formPrompts.push({ type: `forminput`, name: pluginName, multiple: true, message: stripIndent` - Configure the ${getName(pluginName)} plugin. + Configure the ${getName(pluginName)} plugin. See ${docsLink(pluginName)} for help. ${ choices.length > 1 @@ -107,5 +111,6 @@ export const makePluginConfigQuestions = ( }) } }) + return formPrompts } From 10bbc17750e8a4e9ae9d881d0625a65440c18bcb Mon Sep 17 00:00:00 2001 From: Marvin Frachet Date: Tue, 1 Dec 2020 10:35:45 +0100 Subject: [PATCH 2/2] Apply suggestions from code review Co-authored-by: Matt Kane --- packages/create-gatsby/src/__tests__/plugin-options-form.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/create-gatsby/src/__tests__/plugin-options-form.ts b/packages/create-gatsby/src/__tests__/plugin-options-form.ts index 97f2aa18496e1..58d5d5c6ec10f 100644 --- a/packages/create-gatsby/src/__tests__/plugin-options-form.ts +++ b/packages/create-gatsby/src/__tests__/plugin-options-form.ts @@ -7,12 +7,12 @@ describe(`plugin-options-form`, () => { expect(makePluginConfigQuestions(plugins)).toEqual([]) }) - it(`returns an empty array when the plugin is not available for configu`, () => { + it(`returns an empty array when the plugin is not available for config`, () => { const plugins = [`not-valid-plugin`] expect(makePluginConfigQuestions(plugins)).toEqual([]) }) - it(`returns an arry containing only the wordpress options (choices are included)`, () => { + it(`returns an array containing only the wordpress options (choices are included)`, () => { const plugins = [`gatsby-source-wordpress-experimental`] expect(makePluginConfigQuestions(plugins)).toEqual([ {