From a84f78e075901d3195e4a81a949aaaa48979ff5b Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Sat, 28 Nov 2020 01:51:12 -0800 Subject: [PATCH 001/144] chore(gatsby): Invite more people to try QUERY_ON_DEMAND (#28327) * chore(gatsby): Invite more people to try QUERY_ON_DEMAND * update message for flags --- packages/gatsby/src/services/run-page-queries.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/gatsby/src/services/run-page-queries.ts b/packages/gatsby/src/services/run-page-queries.ts index 3f78acbe371b3..2c76f54440755 100644 --- a/packages/gatsby/src/services/run-page-queries.ts +++ b/packages/gatsby/src/services/run-page-queries.ts @@ -8,7 +8,7 @@ import { } from "../utils/show-experiment-notice" import { isCI } from "gatsby-core-utils" -const TWO_MINUTES = 2 * 60 * 1000 +const ONE_MINUTE = 1 * 60 * 1000 export async function runPageQueries({ parentSpan, @@ -58,11 +58,11 @@ export async function runPageQueries({ If you're interested in trialing out one of these future improvements *today* which should make your local development experience faster, go ahead and run your site with QUERY_ON_DEMAND enabled. - GATSBY_EXPERIMENTAL_QUERY_ON_DEMAND=true gatsby develop + You can enable it by adding "flags: { QUERY_ON_DEMAND: true }" to your gatsby-config.js Please do let us know how it goes (good, bad, or otherwise) and learn more about it at https://gatsby.dev/query-on-demand-feedback `), - TWO_MINUTES + ONE_MINUTE ) } From c4978e948c5b0cebf85ef9af62da523169994bf9 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Sat, 28 Nov 2020 02:02:15 -0800 Subject: [PATCH 002/144] feature(gatsby): Warn when there's unknown flags in gatsby-config.js & suggest fixes to potential typos (#28326) * feature(gatsby): Warn when there's unknown flags in gatsby-config.js & suggest fixes to potential typos * Update packages/gatsby/src/utils/handle-flags.ts Co-authored-by: Michal Piechowiak * Reformat message per @pieh's suggestion * make typescript happy Co-authored-by: Michal Piechowiak --- examples/using-drupal/gatsby-config.js | 3 ++ packages/gatsby/src/services/initialize.ts | 6 ++- .../__snapshots__/handle-flags.ts.snap | 21 ++++++++ .../src/utils/__tests__/handle-flags.ts | 9 ++++ packages/gatsby/src/utils/handle-flags.ts | 53 ++++++++++++++++++- 5 files changed, 89 insertions(+), 3 deletions(-) diff --git a/examples/using-drupal/gatsby-config.js b/examples/using-drupal/gatsby-config.js index cae0ee679d15e..5940d4f477a54 100644 --- a/examples/using-drupal/gatsby-config.js +++ b/examples/using-drupal/gatsby-config.js @@ -1,4 +1,7 @@ module.exports = { + flags: { + DEV_SSR: true, + }, siteMetadata: { title: `Gatsby with Drupal`, }, diff --git a/packages/gatsby/src/services/initialize.ts b/packages/gatsby/src/services/initialize.ts index 82914ac1885b0..48ada570b9c4a 100644 --- a/packages/gatsby/src/services/initialize.ts +++ b/packages/gatsby/src/services/initialize.ts @@ -186,11 +186,15 @@ export async function initialize({ if (config && config.flags) { const availableFlags = require(`../utils/flags`).default // Get flags - const { enabledConfigFlags, message } = handleFlags( + const { enabledConfigFlags, unknownFlagMessage, message } = handleFlags( availableFlags, config.flags ) + if (unknownFlagMessage !== ``) { + reporter.warn(unknownFlagMessage) + } + // set process.env for each flag enabledConfigFlags.forEach(flag => { process.env[flag.env] = `true` diff --git a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap index b07d4965c35ee..23541c5a3e911 100644 --- a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap +++ b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap @@ -1,5 +1,25 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`handle flags returns a message about unknown flags in the config 1`] = ` +Object { + "enabledConfigFlags": Array [ + Object { + "command": "all", + "description": "test", + "env": "GATSBY_EXPERIMENTAL_SOMETHING_COOL", + "name": "ALL_COMMANDS", + "umbrellaIssue": "test", + }, + ], + "message": "The following flags are active: +- ALL_COMMANDS · (Umbrella Issue (test)) · test +", + "unknownFlagMessage": "The following flag(s) found in your gatsby-config.js are not known: +- FASTLY_DEV (did you mean: FAST_DEV) +- SUPER_COOL_FLAG", +} +`; + exports[`handle flags returns validConfigFlags and a message 1`] = ` Object { "enabledConfigFlags": Array [ @@ -42,5 +62,6 @@ Object { - DEV_SSR · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/28138)) · SSR pages on full reloads during develop. Helps you detect SSR bugs and fix them without needing to do full builds. - QUERY_ON_DEMAND · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/27620)) · Only run queries when needed instead of running all queries upfront. Speeds starting the develop server. ", + "unknownFlagMessage": "", } `; diff --git a/packages/gatsby/src/utils/__tests__/handle-flags.ts b/packages/gatsby/src/utils/__tests__/handle-flags.ts index 25322498bb4ea..7afb54e37139b 100644 --- a/packages/gatsby/src/utils/__tests__/handle-flags.ts +++ b/packages/gatsby/src/utils/__tests__/handle-flags.ts @@ -84,4 +84,13 @@ describe(`handle flags`, () => { handleFlags(activeFlags, configFlags, `build`).enabledConfigFlags ).toHaveLength(1) }) + + it(`returns a message about unknown flags in the config`, () => { + const unknownConfigFlags = handleFlags( + activeFlags, + { ALL_COMMANDS: true, FASTLY_DEV: true, SUPER_COOL_FLAG: true }, + `develop` + ) + expect(unknownConfigFlags).toMatchSnapshot() + }) }) diff --git a/packages/gatsby/src/utils/handle-flags.ts b/packages/gatsby/src/utils/handle-flags.ts index c2fcf0321a69e..ca68f6534fc53 100644 --- a/packages/gatsby/src/utils/handle-flags.ts +++ b/packages/gatsby/src/utils/handle-flags.ts @@ -3,6 +3,8 @@ import { isCI } from "gatsby-core-utils" import realTerminalLink from "terminal-link" import { IFlag } from "./flags" import chalk from "chalk" +import { commaListsAnd } from "common-tags" +import { distance } from "fastest-levenshtein" const terminalLink = (text, url): string => { if (process.env.NODE_ENV === `test`) { @@ -16,11 +18,54 @@ const handleFlags = ( flags: Array, configFlags: Record, executingCommand = process.env.gatsby_executing_command -): { enabledConfigFlags: Array; message: string } => { +): { + enabledConfigFlags: Array + unknownFlagMessage: string + message: string +} => { // Prepare config flags. // Filter out any flags that are set to false. const availableFlags = new Map() flags.forEach(flag => availableFlags.set(flag.name, flag)) + + // Find unknown flags someone has in their config to warn them about. + const unknownConfigFlags: Array = [] + for (const flagName in configFlags) { + if (availableFlags.has(flagName)) { + continue + } + let flagWithMinDistance + let minDistance + for (const availableFlag of flags) { + if (availableFlag.name !== flagName) { + const distanceToFlag = distance(flagName, availableFlag.name) + if (!flagWithMinDistance || distanceToFlag < minDistance) { + flagWithMinDistance = availableFlag.name + minDistance = distanceToFlag + } + } + } + + if (flagName) { + unknownConfigFlags.push({ + flag: flagName, + didYouMean: + flagWithMinDistance && minDistance < 4 ? flagWithMinDistance : ``, + }) + } + } + + let unknownFlagMessage = `` + if (unknownConfigFlags.length > 0) { + unknownFlagMessage = commaListsAnd`The following flag(s) found in your gatsby-config.js are not known:` + unknownConfigFlags.forEach( + flag => + (unknownFlagMessage += `\n- ${flag?.flag}${ + flag?.didYouMean ? ` (did you mean: ${flag?.didYouMean})` : `` + }`) + ) + } + let enabledConfigFlags = Object.keys(configFlags) .filter(name => configFlags[name] && availableFlags.has(name)) .map(flagName => availableFlags.get(flagName)) @@ -85,7 +130,11 @@ const handleFlags = ( message += `\n` } - return { enabledConfigFlags, message } + return { + enabledConfigFlags, + message, + unknownFlagMessage, + } } export default handleFlags From 92742df253838a4c0cfd2a1c0ff74df39005242c Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Mon, 30 Nov 2020 09:05:07 +0100 Subject: [PATCH 003/144] chore: add cypress dashboard config to e2e dev runtime for fast refresh variant (#28348) --- .circleci/config.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.circleci/config.yml b/.circleci/config.yml index 6735755f0d9da..400264808a17a 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -334,6 +334,8 @@ jobs: environment: GATSBY_HOT_LOADER: fast-refresh CYPRESS_HOT_LOADER: fast-refresh + CYPRESS_PROJECT_ID: 917bea + CYPRESS_RECORD_KEY: 4750fb36-4576-4638-a617-d243a381acef e2e_tests_development_runtime_with_experimental_react: <<: *e2e_tests_development_runtime_alias From 4c4e8e8779bd587add8c2ac75e9a3e10ffe77a96 Mon Sep 17 00:00:00 2001 From: Lennart Date: Mon, 30 Nov 2020 11:47:19 +0100 Subject: [PATCH 004/144] chore(docs): Add note about icon_options (#28363) --- packages/gatsby-plugin-manifest/README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-plugin-manifest/README.md b/packages/gatsby-plugin-manifest/README.md index 880a19723e9e8..748c86100f2f0 100644 --- a/packages/gatsby-plugin-manifest/README.md +++ b/packages/gatsby-plugin-manifest/README.md @@ -202,7 +202,8 @@ module.exports = { display: `standalone`, icon: `src/images/icon.png`, icon_options: { - // For all the options available, please see the additional resources below. + // For all the options available, + // please see the section "Additional Resources" below. purpose: `any maskable`, }, }, @@ -444,7 +445,7 @@ Internet Explorer is the only other major browser that doesn't support the web a This article from the Chrome DevRel team is a good intro to the web app manifest — https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/ -For more information, see the [W3C specification](https://www.w3.org/TR/appmanifest/), [Mozilla documentation](https://developer.mozilla.org/en-US/docs/Web/Manifest) or [Web.Dev guide](https://web.dev/add-manifest/). +For more information, see the [W3C specification](https://www.w3.org/TR/appmanifest/), [Mozilla documentation](https://developer.mozilla.org/en-US/docs/Web/Manifest) or [Web.Dev guide](https://web.dev/add-manifest/). More information about `icon_options` can be found in [this Web.Dev guide](https://web.dev/maskable-icon/). ### Plugin options validation From 098448fcc5afcc9a610fb7879c83ebd6ebd8a02f Mon Sep 17 00:00:00 2001 From: "D. Kasi Pavan Kumar" <44864604+kasipavankumar@users.noreply.github.com> Date: Mon, 30 Nov 2020 16:49:51 +0530 Subject: [PATCH 005/144] chore(gatsby-plugin-manifest): Update pluginOptionsSchema link (#28344) Current link of the `pluginOptionsSchema.js` redirects to a non-existent (404) page on at https://www.gatsbyjs.com/plugins/gatsby-plugin-manifest/#plugin-options-validation. This commit fixes and points it to the actual file on the repository. --- packages/gatsby-plugin-manifest/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gatsby-plugin-manifest/README.md b/packages/gatsby-plugin-manifest/README.md index 748c86100f2f0..d6579bbb488bf 100644 --- a/packages/gatsby-plugin-manifest/README.md +++ b/packages/gatsby-plugin-manifest/README.md @@ -449,7 +449,7 @@ For more information, see the [W3C specification](https://www.w3.org/TR/appmanif ### Plugin options validation -This plugin validates plugin options set in the `gatsby-config.js`. It validates the options used by the plugin and the entire WebAppManifest spec. To see the exact implementation of the validator see [src/pluginOptionsSchema.js](src/pluginOptionsSchema.js). +This plugin validates plugin options set in the `gatsby-config.js`. It validates the options used by the plugin and the entire WebAppManifest spec. To see the exact implementation of the validator see [src/pluginOptionsSchema.js](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-manifest/src/pluginOptionsSchema.js). The WebAppManifest spec is not stable at the time of writing. This version of the validator adheres the [most recent](https://www.w3.org/TR/2020/WD-appmanifest-20201019/) version of the specification available. From 49983036de2bf7a61fe654b37fb8b3fe7d639153 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Mon, 30 Nov 2020 03:35:38 -0800 Subject: [PATCH 006/144] fix(gatsby): fix telemetryId for LAZY_IMAGES (#28340) --- packages/gatsby/src/utils/flags.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gatsby/src/utils/flags.ts b/packages/gatsby/src/utils/flags.ts index 2b18d0e4eaea6..385ac6b8a3d18 100644 --- a/packages/gatsby/src/utils/flags.ts +++ b/packages/gatsby/src/utils/flags.ts @@ -55,7 +55,7 @@ const activeFlags: Array = [ name: `LAZY_IMAGES`, env: `GATSBY_EXPERIMENTAL_LAZY_IMAGES`, command: `develop`, - telemetryId: `LazyImages`, + telemetryId: `LazyImageProcessing`, experimental: true, description: `Don't process images during development until they're requested from the browser. Speeds starting the develop server.`, umbrellaIssue: `https://github.com/gatsbyjs/gatsby/discussions/27603`, From 208f4cd25a71e7d52958262de94647d54fdde323 Mon Sep 17 00:00:00 2001 From: Max Stoiber Date: Mon, 30 Nov 2020 13:29:55 +0100 Subject: [PATCH 007/144] Fix v2.27 release notes (#28367) The `gatsby new` behavior wasn't actually shipped in that release! --- docs/reference/release-notes/v2.27/index.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/docs/reference/release-notes/v2.27/index.md b/docs/reference/release-notes/v2.27/index.md index d1445be85b17d..5d3b6491a9121 100644 --- a/docs/reference/release-notes/v2.27/index.md +++ b/docs/reference/release-notes/v2.27/index.md @@ -39,8 +39,6 @@ npm init gatsby This command will ask a series of questions, allowing you to select your CMS, preferred styling tools and common Gatsby plugins. After you've made your selections let the installation complete and you'll have a working Gatsby site, all packages included and configured for use. -This is also the alias for the existing `gatsby new` command when no arguments are passed. However, `gatsby new ` retains its current functionality, allowing you to make use of the numerous fully functional starters. - ## Making `gatsby develop` faster The Gatsby develop server can get slow to start on larger sites. We're working hard to speed it up. We're addressing different scaling problems one by one and have shipped several improvements behind flags as detailed below. If you'd like to enable all these dev speedups (along with all future ones!), we've created a single flag for you. Run your site like `GATSBY_EXPERIMENTAL_FAST_DEV=true gatsby develop` and zoom zoom! From 4fbded2e336fd97548bf3df23d764f3a500fe5ec Mon Sep 17 00:00:00 2001 From: Matt Kane Date: Mon, 30 Nov 2020 13:06:59 +0000 Subject: [PATCH 008/144] fix(create-gatsby): Improve install (#28318) --- packages/create-gatsby/src/index.ts | 41 +++++----- packages/create-gatsby/src/init-starter.ts | 94 ++++++++++++++++------ 2 files changed, 89 insertions(+), 46 deletions(-) diff --git a/packages/create-gatsby/src/index.ts b/packages/create-gatsby/src/index.ts index a0c620f0cad20..6b8456886e8fd 100644 --- a/packages/create-gatsby/src/index.ts +++ b/packages/create-gatsby/src/index.ts @@ -2,17 +2,18 @@ import Enquirer from "enquirer" import cmses from "./cmses.json" import styles from "./styles.json" import features from "./features.json" -import { initStarter, getPackageManager } from "./init-starter" +import { initStarter, getPackageManager, gitSetup } from "./init-starter" import { installPlugins } from "./install-plugins" import c from "ansi-colors" import path from "path" import fs from "fs" import { plugin } from "./components/plugin" import { makePluginConfigQuestions } from "./plugin-options-form" -import { center, rule, wrap } from "./components/utils" +import { center, wrap } from "./components/utils" import { stripIndent } from "common-tags" import { trackCli } from "./tracking" import crypto from "crypto" +import { reporter } from "./reporter" import { setSiteMetadata } from "./site-metadata" const sha256 = (str: string): string => @@ -51,6 +52,7 @@ const makeChoices = ( export const validateProjectName = async ( value: string ): Promise => { + value = value.trim() if (INVALID_FILENAMES.test(value)) { return `The destination "${value}" is not a valid filename. Please try again, avoiding special characters.` } @@ -139,9 +141,9 @@ export async function run(): Promise { const { version } = require(`../package.json`) - console.log(c.grey(`create-gatsby version ${version}`)) + reporter.info(c.grey(`create-gatsby version ${version}`)) - console.log( + reporter.info( ` @@ -151,23 +153,23 @@ ${center(c.blueBright.bold.underline(`Welcome to Gatsby!`))} ` ) - console.log( + reporter.info( wrap( `This command will generate a new Gatsby site for you in ${c.bold( process.cwd() )} with the setup you select. ${c.white.bold( - `Let's answer some questions:\n` + `Let's answer some questions:\n\n` )}`, process.stdout.columns ) ) - console.log(``) const enquirer = new Enquirer() enquirer.use(plugin) const data = await enquirer.prompt(questions) + data.project = data.project.trim() trackCli(`CREATE_GATSBY_SELECT_OPTION`, { name: `project_name`, @@ -260,7 +262,7 @@ ${center(c.blueBright.bold.underline(`Welcome to Gatsby!`))} const config = makePluginConfigQuestions(plugins) if (config.length) { - console.log( + reporter.info( `\nGreat! A few of the selections you made need to be configured. Please fill in the options for each plugin now:\n` ) @@ -274,7 +276,7 @@ ${center(c.blueBright.bold.underline(`Welcome to Gatsby!`))} trackCli(`CREATE_GATSBY_SET_PLUGINS_STOP`) } - console.log(` + reporter.info(` ${c.bold(`Thanks! Here's what we'll now do:`)} @@ -292,45 +294,44 @@ ${c.bold(`Thanks! Here's what we'll now do:`)} if (!confirm) { trackCli(`CREATE_GATSBY_CANCEL`) - console.log(`OK, bye!`) + reporter.info(`OK, bye!`) return } await initStarter(DEFAULT_STARTER, data.project, packages.map(removeKey)) - console.log( - c.green(c.symbols.check) + ` Created site in ` + c.green(data.project) - ) + reporter.success(`Created site in ${c.green(data.project)}`) const fullPath = path.resolve(data.project) if (plugins.length) { - console.log(c.bold(`${w(`🔌 `)}Installing plugins...`)) + reporter.info(`${w(`🔌 `)}Setting-up plugins...`) await installPlugins(plugins, pluginConfig, fullPath, []) } await setSiteMetadata(fullPath, `title`, data.project) - const pm = await getPackageManager() + await gitSetup(data.project) + const pm = await getPackageManager() const runCommand = pm === `npm` ? `npm run` : `yarn` - console.log( + reporter.info( stripIndent` ${w(`🎉 `)}Your new Gatsby site ${c.bold( data.project - )} has been successfully bootstrapped + )} has been successfully created at ${c.bold(fullPath)}. ` ) - console.log(`Start by going to the directory with\n + reporter.info(`Start by going to the directory with\n ${c.magenta(`cd ${data.project}`)} `) - console.log(`Start the local development server with\n + reporter.info(`Start the local development server with\n ${c.magenta(`${runCommand} develop`)} `) - console.log(`See all commands at\n + reporter.info(`See all commands at\n ${c.blueBright(`https://www.gatsbyjs.com/docs/gatsby-cli/`)} `) diff --git a/packages/create-gatsby/src/init-starter.ts b/packages/create-gatsby/src/init-starter.ts index c06f84c315e1c..fa9f4e6c76fdc 100644 --- a/packages/create-gatsby/src/init-starter.ts +++ b/packages/create-gatsby/src/init-starter.ts @@ -1,21 +1,40 @@ import { execSync } from "child_process" -import execa from "execa" +import execa, { Options } from "execa" import fs from "fs-extra" import path from "path" import { reporter } from "./reporter" import { spin } from "tiny-spin" import { getConfigStore } from "./get-config-store" type PackageManager = "yarn" | "npm" +import c from "ansi-colors" -const packageMangerConfigKey = `cli.packageManager` +const packageManagerConfigKey = `cli.packageManager` + +const kebabify = (str: string): string => + str + .replace(/([a-z])([A-Z])/g, `$1-$2`) + .replace(/[^a-zA-Z]+/g, `-`) + .toLowerCase() export const getPackageManager = (): PackageManager => - getConfigStore().get(packageMangerConfigKey) + getConfigStore().get(packageManagerConfigKey) export const setPackageManager = (packageManager: PackageManager): void => { - getConfigStore().set(packageMangerConfigKey, packageManager) + getConfigStore().set(packageManagerConfigKey, packageManager) } +const ESC = `\u001b` + +export const clearLine = (count = 1): Promise => + new Promise(resolve => { + // First move the cursor up one line... + process.stderr.moveCursor(0, -count, () => { + // ... then clear that line. This is the ANSI escape sequence for "clear whole line" + // List of escape sequences: http://ascii-table.com/ansi-escape-sequences.php + process.stderr.write(`${ESC}[2K`) + resolve() + }) + }) // Checks the existence of yarn package // We use yarnpkg instead of yarn to avoid conflict with Hadoop yarn // Refer to https://github.com/yarnpkg/yarn/issues/673 @@ -31,11 +50,8 @@ const checkForYarn = (): boolean => { // Initialize newly cloned directory as a git repo const gitInit = async ( rootPath: string -): Promise> => { - reporter.info(`Initialising git in ${rootPath}`) - - return await execa(`git`, [`init`], { cwd: rootPath }) -} +): Promise> => + await execa(`git`, [`init`], { cwd: rootPath }) // Create a .gitignore file if it is missing in the new directory const maybeCreateGitIgnore = async (rootPath: string): Promise => { @@ -43,7 +59,6 @@ const maybeCreateGitIgnore = async (rootPath: string): Promise => { return } - reporter.info(`Creating minimal .gitignore in ${rootPath}`) await fs.writeFile( path.join(rootPath, `.gitignore`), `.cache\nnode_modules\npublic\n` @@ -52,8 +67,6 @@ const maybeCreateGitIgnore = async (rootPath: string): Promise => { // Create an initial git commit in the new directory const createInitialGitCommit = async (rootPath: string): Promise => { - reporter.info(`Create initial git commit in ${rootPath}`) - await execa(`git`, [`add`, `-A`], { cwd: rootPath }) // use execSync instead of spawn to handle git clients using // pgp signatures (with password) @@ -68,6 +81,28 @@ const createInitialGitCommit = async (rootPath: string): Promise => { } } +const setNameInPackage = async ( + sitePath: string, + name: string +): Promise => { + const packageJsonPath = path.join(sitePath, `package.json`) + const packageJson = await fs.readJSON(packageJsonPath) + packageJson.name = kebabify(name) + packageJson.description = `My Gatsby site` + try { + const result = await execa(`git`, [`config`, `user.name`]) + if (result.failed) { + delete packageJson.author + } else { + packageJson.author = result.stdout + } + } catch (e) { + delete packageJson.author + } + + await fs.writeJSON(packageJsonPath, packageJson) +} + // Executes `npm install` or `yarn install` in rootPath. const install = async ( rootPath: string, @@ -75,14 +110,12 @@ const install = async ( ): Promise => { const prevDir = process.cwd() - let stop = spin(`Installing packages...`) + reporter.info(`${c.blueBright(c.symbols.pointer)} Installing Gatsby...`) process.chdir(rootPath) const npmConfigUserAgent = process.env.npm_config_user_agent - const silent = `--silent` - try { if (!getPackageManager()) { if (npmConfigUserAgent?.includes(`yarn`)) { @@ -91,25 +124,33 @@ const install = async ( setPackageManager(`npm`) } } + const options: Options = { + stderr: `inherit`, + } + + const config = [`--loglevel`, `error`, `--color`, `always`] + if (getPackageManager() === `yarn` && checkForYarn()) { await fs.remove(`package-lock.json`) - const args = packages.length ? [`add`, silent, ...packages] : [silent] - await execa(`yarnpkg`, args) + const args = packages.length + ? [`add`, `--silent`, ...packages] + : [`--silent`] + await execa(`yarnpkg`, args, options) } else { await fs.remove(`yarn.lock`) - await execa(`npm`, [`install`, silent]) - stop() - stop = spin(`Installing plugins...`) - await execa(`npm`, [`install`, silent, ...packages]) - stop() + await execa(`npm`, [`install`, ...config], options) + await clearLine() + reporter.success(`Installed Gatsby`) + reporter.info(`${c.blueBright(c.symbols.pointer)} Installing plugins...`) + await execa(`npm`, [`install`, ...config, ...packages], options) + await clearLine() + reporter.success(`Installed plugins`) } } catch (e) { reporter.panic(e.message) } finally { process.chdir(prevDir) - stop() - reporter.success(`Installed packages`) } } @@ -143,7 +184,7 @@ const clone = async ( await fs.remove(path.join(rootPath, `.git`)) } -async function gitSetup(rootPath: string): Promise { +export async function gitSetup(rootPath: string): Promise { await gitInit(rootPath) await maybeCreateGitIgnore(rootPath) await createInitialGitCommit(rootPath) @@ -161,8 +202,9 @@ export async function initStarter( await clone(starter, sitePath) + await setNameInPackage(sitePath, rootPath) + await install(rootPath, packages) - await gitSetup(rootPath) // trackCli(`NEW_PROJECT_END`); } From c5d28e2f365258f9e39e1e4a2e327a25c8ae696a Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 30 Nov 2020 14:17:29 +0100 Subject: [PATCH 009/144] chore(deps): update dependency theme-ui to v0.4.0-rc.14 (#28228) Co-authored-by: Renovate Bot --- package.json | 2 +- yarn.lock | 99 +++++++++++++++++++++++++++++++++------------------- 2 files changed, 64 insertions(+), 37 deletions(-) diff --git a/package.json b/package.json index 907bfd68044b5..d8ea0799ea620 100644 --- a/package.json +++ b/package.json @@ -93,7 +93,7 @@ "yargs": "^10.1.2" }, "resolutions": { - "theme-ui": "0.4.0-rc.8", + "theme-ui": "0.4.0-rc.14", "csstype": "2.6.14" }, "engines": { diff --git a/yarn.lock b/yarn.lock index b74abfbe2b1c6..6597bb10d791a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3708,17 +3708,30 @@ "@testing-library/dom" "^6.15.0" "@types/testing-library__react" "^9.1.2" -"@theme-ui/color-modes@^0.4.0-rc.7": - version "0.4.0-rc.7" - resolved "https://registry.yarnpkg.com/@theme-ui/color-modes/-/color-modes-0.4.0-rc.7.tgz#31ef49475da124b9c0c3c8975648d75622a0a7b7" - integrity sha512-t/DwgoWb/zvCSnho3Tsr9Vju7etFBS2Ys2IbfkECoBCWqEL2uM5r//1gHHPOrMmgw44oE34PXOH5t5y8l8FsxQ== +"@theme-ui/color-modes@^0.4.0-rc.14": + version "0.4.0-rc.14" + resolved "https://registry.yarnpkg.com/@theme-ui/color-modes/-/color-modes-0.4.0-rc.14.tgz#2e61a3e7ad8dcb916f9470fdfb57e55eb242d566" + integrity sha512-nxfgi2pD27xs7v96s7GswrFl/WvzqdbZDlE1RnF0tEvhRhurdWKaDTm2f7mFsALmf6xb85Uwa059lvumwSMbSw== dependencies: "@emotion/core" "^10.0.0" - "@theme-ui/core" "^0.4.0-rc.7" - "@theme-ui/css" "^0.4.0-rc.7" + "@theme-ui/core" "^0.4.0-rc.13" + "@theme-ui/css" "^0.4.0-rc.13" deepmerge "^4.2.2" -"@theme-ui/components@>= 0.4.0-rc.1", "@theme-ui/components@^0.4.0-rc.8": +"@theme-ui/components@0.4.0-rc.13": + version "0.4.0-rc.13" + resolved "https://registry.yarnpkg.com/@theme-ui/components/-/components-0.4.0-rc.13.tgz#7afe58a9570d63eccc481b352b694418b8e38a20" + integrity sha512-+S32r7jxvcsMIbReVW4fBHZhL4ZhmjhDVu9UwlHTYgF2fmoDywc4iJsBKsfqvdkeTg8Z/hWtzmUtdxL4X2lmjQ== + dependencies: + "@emotion/core" "^10.0.0" + "@emotion/styled" "^10.0.0" + "@styled-system/color" "^5.1.2" + "@styled-system/should-forward-prop" "^5.1.2" + "@styled-system/space" "^5.1.2" + "@theme-ui/css" "^0.4.0-rc.13" + "@types/styled-system" "^4.2.2" + +"@theme-ui/components@>= 0.4.0-rc.1": version "0.4.0" resolved "https://registry.yarnpkg.com/@theme-ui/components/-/components-0.4.0.tgz#9da8f3c59291f2150494fdc6afea40200f56c5a1" integrity sha512-P0+BaWewKVx7IybPfbtNl2Jbyt54LF8/GqpCAzYR2VFOaU0r5fOqLFyyxjK7msqziLpfkwdVtTqaB0qHJww55g== @@ -3730,40 +3743,47 @@ "@styled-system/space" "^5.1.2" "@theme-ui/css" "^0.4.0-rc.5" -"@theme-ui/core@^0.4.0-rc.7": - version "0.4.0-rc.7" - resolved "https://registry.yarnpkg.com/@theme-ui/core/-/core-0.4.0-rc.7.tgz#e4b78808a3c767e46080b13960f0b1e623177e0a" - integrity sha512-OBlAQkbUz/XVatAzzMKWmbT39ED7EqafOtlQ4FmXKHY3ngfBVQgJdawXTVh/krpKdonzObwDemVzp3F8TDi8UQ== +"@theme-ui/core@^0.4.0-rc.13": + version "0.4.0-rc.13" + resolved "https://registry.yarnpkg.com/@theme-ui/core/-/core-0.4.0-rc.13.tgz#ff206b3d2113f4f78df267d371ed21b03ac2da29" + integrity sha512-WJZWuA65QrZe6lKx+zLwKCK9JYuaGtnbGc3t+rdpc7hwX519IEM/lIVaLIzrpwih+sn3g64Npmls6gCOIrIIYQ== dependencies: "@emotion/core" "^10.0.0" - "@theme-ui/css" "^0.4.0-rc.7" + "@theme-ui/css" "^0.4.0-rc.13" deepmerge "^4.2.2" -"@theme-ui/css@>= 0.4.0-rc.1", "@theme-ui/css@^0.4.0-rc.5", "@theme-ui/css@^0.4.0-rc.7": +"@theme-ui/css@>= 0.4.0-rc.1", "@theme-ui/css@^0.4.0-rc.5": version "0.4.0-rc.7" resolved "https://registry.yarnpkg.com/@theme-ui/css/-/css-0.4.0-rc.7.tgz#7cc8e998726128db05ea1179ee599523da74e55d" integrity sha512-JWZOOSWYRlZivrptOzp4hrtarZJ5rsmUfqAGT2iex5zks8Sv31PRr4eMOTFow9hvqicpnc8WaJQqO3ltk6fCKA== dependencies: csstype "^2.5.7" -"@theme-ui/mdx@^0.4.0-rc.7": - version "0.4.0-rc.7" - resolved "https://registry.yarnpkg.com/@theme-ui/mdx/-/mdx-0.4.0-rc.7.tgz#a335a055a0085711d31051ad8253929eb51c2d5d" - integrity sha512-7TavOcnLKaFUCQzEqgSjMypERN19PoawE0M36dJXTwIvt057GjOJ1YIrg/bmjzZWCX8s+GCsSbcmv8HPuIC/Uw== +"@theme-ui/css@^0.4.0-rc.13": + version "0.4.0-rc.13" + resolved "https://registry.yarnpkg.com/@theme-ui/css/-/css-0.4.0-rc.13.tgz#ffe585bebe4fc91fea2935bb6beb40f50c6a7cf0" + integrity sha512-YEO462Ia26T+i/6p/B4EJt/p3qJanPsSYpRP7MK4GchF/LbuHi0MS+zc4TpctIuIqpXgQR3w75b6xJZG1Oqn1Q== + dependencies: + csstype "^2.5.7" + +"@theme-ui/mdx@^0.4.0-rc.13": + version "0.4.0-rc.13" + resolved "https://registry.yarnpkg.com/@theme-ui/mdx/-/mdx-0.4.0-rc.13.tgz#748eb2958280c4c63ebbf7157f16bbf1ef5a3025" + integrity sha512-ZESUQzOkAF9MXVRX0zQYdqfb0j8+K/KWHv+LJIGFgWXJmfhj+vmKn4CL630jT9jALpkMKXN08QD9mw3/vGlT6A== dependencies: "@emotion/core" "^10.0.0" "@emotion/styled" "^10.0.0" "@mdx-js/react" "^1.0.0" -"@theme-ui/theme-provider@^0.4.0-rc.7": - version "0.4.0-rc.7" - resolved "https://registry.yarnpkg.com/@theme-ui/theme-provider/-/theme-provider-0.4.0-rc.7.tgz#c2879162192f0f02cd4ca9116836f146be768fda" - integrity sha512-C1bvsJvvVl3HWvtLRzmcpsLoLJQ8ZroIhR99G14n+9VyqX+rMS9OFd+iaJbJhIDnXCVOehxsSPZr5I3fgzHziw== +"@theme-ui/theme-provider@^0.4.0-rc.14": + version "0.4.0-rc.14" + resolved "https://registry.yarnpkg.com/@theme-ui/theme-provider/-/theme-provider-0.4.0-rc.14.tgz#4f1ec3f337d1680691ff835132ab95f594ef8a4b" + integrity sha512-DyypwnCSY+ogzBJCGYS9Q/58BIRxxk2WVqp2wx4LHhADAhIdLCDz2KO+8SAGLXfwmgt3cvCO7ebo1T6ZRpJV5Q== dependencies: "@emotion/core" "^10.0.0" - "@theme-ui/color-modes" "^0.4.0-rc.7" - "@theme-ui/core" "^0.4.0-rc.7" - "@theme-ui/mdx" "^0.4.0-rc.7" + "@theme-ui/color-modes" "^0.4.0-rc.14" + "@theme-ui/core" "^0.4.0-rc.13" + "@theme-ui/mdx" "^0.4.0-rc.13" "@tokenizer/token@^0.1.0", "@tokenizer/token@^0.1.1": version "0.1.1" @@ -4370,6 +4390,13 @@ dependencies: csstype "^2.6.9" +"@types/styled-system@^4.2.2": + version "4.2.2" + resolved "https://registry.yarnpkg.com/@types/styled-system/-/styled-system-4.2.2.tgz#d8ec981978dc303849030c2428c92e2d472507ff" + integrity sha512-eULPjWVEaXElIFKBwDVWRvGkHC0Fj63XVRna8RHoaRivNhCI/QkEJpMgyb0uA4WpsHpO5SDXH+DyQwEUkyW3rA== + dependencies: + csstype "^2.6.4" + "@types/tapable@*": version "1.0.4" resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.4.tgz#b4ffc7dc97b498c969b360a41eee247f82616370" @@ -8448,7 +8475,7 @@ cssstyle@^2.0.0: dependencies: cssom "~0.3.6" -csstype@2.6.14, csstype@^2.5.7, csstype@^2.6.13, csstype@^2.6.9, csstype@^3.0.2: +csstype@2.6.14, csstype@^2.5.7, csstype@^2.6.13, csstype@^2.6.4, csstype@^2.6.9, csstype@^3.0.2: version "2.6.14" resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.14.tgz#004822a4050345b55ad4dcc00be1d9cf2f4296de" integrity sha512-2mSc+VEpGPblzAxyeR+vZhJKgYg0Og0nnRi7pmRXFYYxSfnOnW8A5wwQb4n4cE2nIOzqKOAzLCaEX6aBmNEv8A== @@ -24174,17 +24201,17 @@ text-table@0.2.0, text-table@^0.2.0, text-table@~0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" -theme-ui@0.4.0-rc.8, "theme-ui@>= 0.4.0-rc.1", theme-ui@^0.2.49, theme-ui@^0.4.0-rc.8: - version "0.4.0-rc.8" - resolved "https://registry.yarnpkg.com/theme-ui/-/theme-ui-0.4.0-rc.8.tgz#e0c00b4b579fb7ad8f3bc5dae43346c7f89882a0" - integrity sha512-SQrBJVPVujCKwSSORtl0oUi0s2Ub8IwbpVhJUyKC2ohyPcnWgYe8l+epkn9EwO3oLlC5ugDYHdF/daG/vaGiww== - dependencies: - "@theme-ui/color-modes" "^0.4.0-rc.7" - "@theme-ui/components" "^0.4.0-rc.8" - "@theme-ui/core" "^0.4.0-rc.7" - "@theme-ui/css" "^0.4.0-rc.7" - "@theme-ui/mdx" "^0.4.0-rc.7" - "@theme-ui/theme-provider" "^0.4.0-rc.7" +theme-ui@0.4.0-rc.14, "theme-ui@>= 0.4.0-rc.1", theme-ui@^0.2.49, theme-ui@^0.4.0-rc.8: + version "0.4.0-rc.14" + resolved "https://registry.yarnpkg.com/theme-ui/-/theme-ui-0.4.0-rc.14.tgz#67856dd8302e621ad55f7687a18d483b506c0706" + integrity sha512-ciaGwsv9cRskUAukHSzMHdRXhqpweV8xAsywkE61gBg9msAfeI6MyeOU7HCseK4U9/Ppu3NNJExI32CK4BMDtg== + dependencies: + "@theme-ui/color-modes" "^0.4.0-rc.14" + "@theme-ui/components" "0.4.0-rc.13" + "@theme-ui/core" "^0.4.0-rc.13" + "@theme-ui/css" "^0.4.0-rc.13" + "@theme-ui/mdx" "^0.4.0-rc.13" + "@theme-ui/theme-provider" "^0.4.0-rc.14" then-request@^2.0.1: version "2.2.0" From 6e60cc4e78010d17527f1136d76e10686d1c307f Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 30 Nov 2020 14:18:41 +0100 Subject: [PATCH 010/144] chore(deps): update dependency danger to ^10.5.4 (#28225) Co-authored-by: Renovate Bot --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index d8ea0799ea620..a571bb1b60bbe 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,7 @@ "chalk": "^4.1.0", "chokidar": "^3.4.3", "cross-env": "^7.0.2", - "danger": "^10.5.1", + "danger": "^10.5.4", "date-fns": "^1.30.1", "dictionary-en": "^3.0.1", "eslint": "^5.16.0", diff --git a/yarn.lock b/yarn.lock index 6597bb10d791a..122611f291e73 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8516,10 +8516,10 @@ damerau-levenshtein@^1.0.6: resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.6.tgz#143c1641cb3d85c60c32329e26899adea8701791" integrity sha512-JVrozIeElnj3QzfUIt8tB8YMluBJom4Vw9qTPpjGYQ9fYlB3D/rb6OordUxf3xeFB35LKWs0xqcO5U6ySvBtug== -danger@^10.5.1: - version "10.5.1" - resolved "https://registry.yarnpkg.com/danger/-/danger-10.5.1.tgz#54f6acee8953a2facad1359f5c94694556f9e6e9" - integrity sha512-M+SnvfD4VKSXwXMRGYR0KPtdl8jYmWqHIlqw1vwB/oTikjCi0nwXFJ7Nw/H3lCPY5NgXDFfJ7UHf8cR7kLNBlQ== +danger@^10.5.4: + version "10.5.4" + resolved "https://registry.yarnpkg.com/danger/-/danger-10.5.4.tgz#e4f3cd7267a2262178aafffb5ba6f379779276ab" + integrity sha512-+1OQymly06JlYwkY0CLJzjzRaSV5qx0/FBhM8uRQz+aNh0Zl6SeUzVYLoeyA+h1UZeXhjYwzlzVDATM+p0691w== dependencies: "@babel/polyfill" "^7.2.5" "@octokit/rest" "^16.43.1" From 5adfdcdea2504d999db4af26fd1041651bfa68cc Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 30 Nov 2020 14:19:01 +0100 Subject: [PATCH 011/144] chore(deps): update dependency lint-staged to ^10.5.2 (#28355) Co-authored-by: Renovate Bot --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index a571bb1b60bbe..4a05edef7b061 100644 --- a/package.json +++ b/package.json @@ -59,7 +59,7 @@ "joi": "^14.3.1", "js-yaml": "^3.14.0", "lerna": "^3.22.1", - "lint-staged": "^10.5.1", + "lint-staged": "^10.5.2", "markdown-magic": "^0.2.1", "npm-packlist": "^2.1.4", "npm-run-all": "4.1.5", diff --git a/yarn.lock b/yarn.lock index 122611f291e73..3e91ef3aa26d3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -15608,10 +15608,10 @@ linkify-it@^2.0.0: dependencies: uc.micro "^1.0.1" -lint-staged@^10.5.1: - version "10.5.1" - resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-10.5.1.tgz#901e915c2360072dded0e7d752a0d9a49e079daa" - integrity sha512-fTkTGFtwFIJJzn/PbUO3RXyEBHIhbfYBE7+rJyLcOXabViaO/h6OslgeK6zpeUtzkDrzkgyAYDTLAwx6JzDTHw== +lint-staged@^10.5.2: + version "10.5.2" + resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-10.5.2.tgz#acfaa0093af3262aee3130b2e22438941530bdd1" + integrity sha512-e8AYR1TDlzwB8VVd38Xu2lXDZf6BcshVqKVuBQThDJRaJLobqKnpbm4dkwJ2puypQNbLr9KF/9mfA649mAGvjA== dependencies: chalk "^4.1.0" cli-truncate "^2.1.0" From d9904ac69ec6abcd8e16f18056b0387c54d8c625 Mon Sep 17 00:00:00 2001 From: Peter van der Zee <209817+pvdz@users.noreply.github.com> Date: Mon, 30 Nov 2020 16:31:24 +0100 Subject: [PATCH 012/144] perf(gatsby-source-contentful): fix unguided search in loop over large lists (#28375) --- packages/gatsby-source-contentful/src/gatsby-node.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/gatsby-source-contentful/src/gatsby-node.js b/packages/gatsby-source-contentful/src/gatsby-node.js index 173f227cd23f3..f1563bf6a8a4d 100644 --- a/packages/gatsby-source-contentful/src/gatsby-node.js +++ b/packages/gatsby-source-contentful/src/gatsby-node.js @@ -499,17 +499,17 @@ exports.sourceNodes = async ( reporter.verbose(`Resolving Contentful references`) - const newOrUpdatedEntries = [] + const newOrUpdatedEntries = new Set() entryList.forEach(entries => { entries.forEach(entry => { - newOrUpdatedEntries.push(`${entry.sys.id}___${entry.sys.type}`) + newOrUpdatedEntries.add(`${entry.sys.id}___${entry.sys.type}`) }) }) // Update existing entry nodes that weren't updated but that need reverse // links added. existingNodes - .filter(n => _.includes(newOrUpdatedEntries, `${n.id}___${n.sys.type}`)) + .filter(n => newOrUpdatedEntries.has(`${n.id}___${n.sys.type}`)) .forEach(n => { if (foreignReferenceMap[`${n.id}___${n.sys.type}`]) { foreignReferenceMap[`${n.id}___${n.sys.type}`].forEach( From 3e056d1ab51cffb8fbf15c7b932fd4f11e1db545 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Mon, 30 Nov 2020 09:20:29 -0800 Subject: [PATCH 013/144] feat(gatsby): Track the use of flags in gatsby-config.js (#28337) --- packages/gatsby/src/services/initialize.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/gatsby/src/services/initialize.ts b/packages/gatsby/src/services/initialize.ts index 48ada570b9c4a..c21d66271b4e6 100644 --- a/packages/gatsby/src/services/initialize.ts +++ b/packages/gatsby/src/services/initialize.ts @@ -209,6 +209,11 @@ export async function initialize({ enabledConfigFlags.forEach(flag => { telemetry.trackFeatureIsUsed(flag.telemetryId) }) + + // Track the usage of config.flags + if (enabledConfigFlags.length > 0) { + telemetry.trackFeatureIsUsed(`ConfigFlags`) + } } // theme gatsby configs can be functions or objects From 5096e90f3af9490f910a47331ac42efa2edfd9e2 Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Mon, 30 Nov 2020 18:25:04 +0100 Subject: [PATCH 014/144] fix(develop): emit stale page data messages when staticQueryHashes change (#28349) --- .../adding-static-query-A-to-B-to-A-link.json | 4 + .../functionality/query-data-caches.js | 442 ++++++++++-------- .../adding-static-query-blank.js | 9 + .../adding-static-query-with-data.js | 13 + .../page-A.js | 21 + .../page-B.js | 28 ++ packages/gatsby/cache-dir/dev-loader.js | 10 +- packages/gatsby/cache-dir/ensure-resources.js | 2 +- packages/gatsby/cache-dir/loader.js | 7 +- .../gatsby/src/utils/websocket-manager.ts | 56 ++- 10 files changed, 386 insertions(+), 206 deletions(-) create mode 100644 e2e-tests/development-runtime/content/query-data-caches/adding-static-query-A-to-B-to-A-link.json create mode 100644 e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-blank.js create mode 100644 e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-with-data.js create mode 100644 e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-A.js create mode 100644 e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-B.js diff --git a/e2e-tests/development-runtime/content/query-data-caches/adding-static-query-A-to-B-to-A-link.json b/e2e-tests/development-runtime/content/query-data-caches/adding-static-query-A-to-B-to-A-link.json new file mode 100644 index 0000000000000..4edede06ada1c --- /dev/null +++ b/e2e-tests/development-runtime/content/query-data-caches/adding-static-query-A-to-B-to-A-link.json @@ -0,0 +1,4 @@ +{ + "selector": "adding-static-query-A-to-B-to-A-link", + "status": "from-static-query-results" +} diff --git a/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js b/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js index ad057c5cf5a08..0c580f56e6e2a 100644 --- a/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js +++ b/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js @@ -87,19 +87,24 @@ function pageTitleAndDataAssertion(config) { cy.findByText(`Preview custom 404 page`).click() } - cy.findByTestId(`${config.prefix || ``}page-path`) - .should(`have.text`, getExpectedCanonicalPath(config)) - - cy.findByTestId(`${config.prefix || ``}query-data-caches-page-title`) - .should(`have.text`, `This is page ${config.page}`) - - cy.findByTestId(`${config.prefix || ``}${config.queryType}-query-result`) - .should( - `have.text`, - `${config.slug} / ${ - config.page === config.initialPage ? `initial-page` : `second-page` - }: ${config.data}` - ) + cy.findByTestId(`${config.prefix || ``}page-path`).should( + `have.text`, + getExpectedCanonicalPath(config) + ) + + cy.findByTestId(`${config.prefix || ``}query-data-caches-page-title`).should( + `have.text`, + `This is page ${config.page}` + ) + + cy.findByTestId( + `${config.prefix || ``}${config.queryType}-query-result` + ).should( + `have.text`, + `${config.slug} / ${ + config.page === config.initialPage ? `initial-page` : `second-page` + }: ${config.data}` + ) } function runTests(config) { @@ -145,204 +150,267 @@ function runTests(config) { assertNotReloading() } -describe(`Navigate from static page A to page B, invalidate some data resources for static page A, navigate back to static page A`, () => { - describe(`Navigating back with gatsby-link`, () => { - it(`page query (page has trailing slash)`, () => { - const config = { - slug: `page-query-with-trailing-slash-A-to-B-to-A-link`, - queryType: `page`, - navigateBack: `link`, - initialPage: `A`, - } - - runTests(config) - }) - - it(`page query (page doesn't have trailing slash)`, () => { - const config = { - slug: `page-query-no-trailing-slash-A-to-B-to-A-link`, - trailingSlash: false, - queryType: `page`, - navigateBack: `link`, - initialPage: `A`, - } - - runTests(config) - }) - - it(`static query (page has trailing slash)`, () => { - const config = { - slug: `static-query-with-trailing-slash-A-to-B-to-A-link`, - queryType: `static`, - navigateBack: `link`, - initialPage: `A`, - } - - runTests(config) +describe(`Keeping caches up-to-date when updating data`, () => { + describe(`Navigate from static page A to page B, invalidate some data resources for static page A, navigate back to static page A`, () => { + describe(`Navigating back with gatsby-link`, () => { + it(`page query (page has trailing slash)`, () => { + const config = { + slug: `page-query-with-trailing-slash-A-to-B-to-A-link`, + queryType: `page`, + navigateBack: `link`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`page query (page doesn't have trailing slash)`, () => { + const config = { + slug: `page-query-no-trailing-slash-A-to-B-to-A-link`, + trailingSlash: false, + queryType: `page`, + navigateBack: `link`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`static query (page has trailing slash)`, () => { + const config = { + slug: `static-query-with-trailing-slash-A-to-B-to-A-link`, + queryType: `static`, + navigateBack: `link`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`static query (page doesn't have trailing slash)`, () => { + const config = { + slug: `static-query-no-trailing-slash-A-to-B-to-A-link`, + trailingSlash: false, + queryType: `static`, + navigateBack: `link`, + initialPage: `A`, + } + + runTests(config) + }) }) - it(`static query (page doesn't have trailing slash)`, () => { - const config = { - slug: `static-query-no-trailing-slash-A-to-B-to-A-link`, - trailingSlash: false, - queryType: `static`, - navigateBack: `link`, - initialPage: `A`, - } - - runTests(config) + describe(`Navigating back with history.back()`, () => { + it(`page query (page has trailing slash)`, () => { + const config = { + slug: `page-query-with-trailing-slash-A-to-B-to-A-history`, + queryType: `page`, + navigateBack: `history`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`page query (page doesn't have trailing slash)`, () => { + const config = { + slug: `page-query-no-trailing-slash-A-to-B-to-A-history`, + trailingSlash: false, + queryType: `page`, + navigateBack: `history`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`static query (page has trailing slash)`, () => { + const config = { + slug: `static-query-with-trailing-slash-A-to-B-to-A-history`, + queryType: `static`, + navigateBack: `history`, + initialPage: `A`, + } + + runTests(config) + }) + + it(`static query (page doesn't have trailing slash)`, () => { + const config = { + slug: `static-query-no-trailing-slash-A-to-B-to-A-history`, + trailingSlash: false, + queryType: `static`, + navigateBack: `history`, + initialPage: `A`, + } + + runTests(config) + }) }) }) - describe(`Navigating back with history.back()`, () => { - it(`page query (page has trailing slash)`, () => { - const config = { - slug: `page-query-with-trailing-slash-A-to-B-to-A-history`, - queryType: `page`, - navigateBack: `history`, - initialPage: `A`, - } - - runTests(config) + describe(`Navigate from client-only page A to page B, invalidate some data resources for client-only page A, navigate back to client-only page A`, () => { + describe(`Navigating back with gatsby-link`, () => { + it(`page query`, () => { + const config = { + slug: `page-query-CO-to-B-to-CO-link`, + queryType: `page`, + navigateBack: `link`, + initialPage: `client-only`, + } + + runTests(config) + }) + + it(`static query`, () => { + const config = { + slug: `static-query-CO-to-B-to-CO-link`, + queryType: `static`, + navigateBack: `link`, + initialPage: `client-only`, + } + + runTests(config) + }) }) - it(`page query (page doesn't have trailing slash)`, () => { - const config = { - slug: `page-query-no-trailing-slash-A-to-B-to-A-history`, - trailingSlash: false, - queryType: `page`, - navigateBack: `history`, - initialPage: `A`, - } - - runTests(config) - }) - - it(`static query (page has trailing slash)`, () => { - const config = { - slug: `static-query-with-trailing-slash-A-to-B-to-A-history`, - queryType: `static`, - navigateBack: `history`, - initialPage: `A`, - } - - runTests(config) - }) - - it(`static query (page doesn't have trailing slash)`, () => { - const config = { - slug: `static-query-no-trailing-slash-A-to-B-to-A-history`, - trailingSlash: false, - queryType: `static`, - navigateBack: `history`, - initialPage: `A`, - } - - runTests(config) + describe(`Navigating back with history.back()`, () => { + it(`page query`, () => { + const config = { + slug: `page-query-CO-to-B-to-CO-history`, + queryType: `page`, + navigateBack: `history`, + initialPage: `client-only`, + } + + runTests(config) + }) + + it(`static query`, () => { + const config = { + slug: `static-query-CO-to-B-to-CO-history`, + queryType: `static`, + navigateBack: `history`, + initialPage: `client-only`, + } + + runTests(config) + }) }) }) -}) - -describe(`Navigate from client-only page A to page B, invalidate some data resources for client-only page A, navigate back to client-only page A`, () => { - describe(`Navigating back with gatsby-link`, () => { - it(`page query`, () => { - const config = { - slug: `page-query-CO-to-B-to-CO-link`, - queryType: `page`, - navigateBack: `link`, - initialPage: `client-only`, - } - runTests(config) + describe(`Navigate from 404 page A to page B, invalidate some data resources for 404 page A, navigate back to 404 page A`, () => { + describe(`Navigating back with gatsby-link`, () => { + it(`page query`, () => { + const config = { + slug: `page-query-404-to-B-to-404-link`, + queryType: `page`, + navigateBack: `link`, + initialPage: `404`, + prefix: `page-link-`, + } + + runTests(config) + }) + + it(`static query`, () => { + const config = { + slug: `static-query-404-to-B-to-404-link`, + queryType: `static`, + navigateBack: `link`, + initialPage: `404`, + prefix: `static-link-`, + } + + runTests(config) + }) }) - it(`static query`, () => { - const config = { - slug: `static-query-CO-to-B-to-CO-link`, - queryType: `static`, - navigateBack: `link`, - initialPage: `client-only`, - } - - runTests(config) - }) - }) - - describe(`Navigating back with history.back()`, () => { - it(`page query`, () => { - const config = { - slug: `page-query-CO-to-B-to-CO-history`, - queryType: `page`, - navigateBack: `history`, - initialPage: `client-only`, - } - - runTests(config) - }) - - it(`static query`, () => { - const config = { - slug: `static-query-CO-to-B-to-CO-history`, - queryType: `static`, - navigateBack: `history`, - initialPage: `client-only`, - } - - runTests(config) + describe(`Navigating back with history.back()`, () => { + it(`page query`, () => { + const config = { + slug: `page-query-404-to-B-to-404-history`, + queryType: `page`, + navigateBack: `history`, + initialPage: `404`, + prefix: `page-history-`, + } + + runTests(config) + }) + + it(`static query`, () => { + const config = { + slug: `static-query-404-to-B-to-404-history`, + queryType: `static`, + navigateBack: `history`, + initialPage: `404`, + prefix: `static-history-`, + } + + runTests(config) + }) }) }) }) -describe(`Navigate from 404 page A to page B, invalidate some data resources for 404 page A, navigate back to 404 page A`, () => { - describe(`Navigating back with gatsby-link`, () => { - it(`page query`, () => { - const config = { - slug: `page-query-404-to-B-to-404-link`, - queryType: `page`, - navigateBack: `link`, - initialPage: `404`, - prefix: `page-link-`, - } - - runTests(config) - }) - - it(`static query`, () => { +describe(`Keeping caches up to date when modifying list of static query hashes assigned to a template`, () => { + describe(`using gatsby-link`, () => { + it.only(`Navigate from page A to page B, add static query to page A, navigate back to page A`, () => { const config = { - slug: `static-query-404-to-B-to-404-link`, + slug: `adding-static-query-A-to-B-to-A-link`, queryType: `static`, navigateBack: `link`, - initialPage: `404`, - prefix: `static-link-`, + initialPage: `A`, } - runTests(config) - }) - }) - - describe(`Navigating back with history.back()`, () => { - it(`page query`, () => { - const config = { - slug: `page-query-404-to-B-to-404-history`, - queryType: `page`, - navigateBack: `history`, - initialPage: `404`, - prefix: `page-history-`, + cy.visit(`/query-data-caches/${config.slug}/page-A/`).waitForRouteChange() + + setupForAssertingNotReloading() + + // baseline assertions + pageTitleAndDataAssertion({ + ...config, + page: config.initialPage, + data: `from-hardcoded-data`, + }) + + cy.getTestElement(`page-b-link`).click().waitForRouteChange() + + // assert we navigated + pageTitleAndDataAssertion({ + ...config, + page: `B`, + data: `from-static-query-results`, + }) + + cy.exec( + `npm run update -- --file src/pages/query-data-caches/${config.slug}/page-A.js --replacements "adding-static-query-blank:adding-static-query-with-data" --exact` + ) + + // TODO: get rid of this wait + // We currently have timing issue when emitting both webpack's HMR and page-data. + // Problem is we need to potentially wait for webpack recompilation before we emit page-data (due to dependency graph traversal). + // Even if we could delay emitting data on the "server" side - this doesn't guarantee that messages are received + // and handled in correct order (ideally they are applied at the exact same time actually, because ordering might still cause issues if we change query text and component render function) + cy.wait(10000) + + if (config.navigateBack === `link`) { + cy.getTestElement(`page-a-link`).click().waitForRouteChange() + } else if (config.navigateBack === `history`) { + // this is just making sure page components don't have link to navigate back (asserting correct setup) + cy.getTestElement(`page-a-link`).should(`not.exist`) + cy.go(`back`).waitForRouteChange() } - runTests(config) - }) - - it(`static query`, () => { - const config = { - slug: `static-query-404-to-B-to-404-history`, - queryType: `static`, - navigateBack: `history`, - initialPage: `404`, - prefix: `static-history-`, - } + // assert data on page we previously visited is updated + pageTitleAndDataAssertion({ + ...config, + page: config.initialPage, + data: `from-static-query-results`, + }) - runTests(config) + assertNotReloading() }) }) }) diff --git a/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-blank.js b/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-blank.js new file mode 100644 index 0000000000000..5102ea2ccbbfa --- /dev/null +++ b/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-blank.js @@ -0,0 +1,9 @@ +export function useDataForAddingStaticQueryTest() { + return { + queryDataCachesJson: { + selector: `adding-static-query-A-to-B-to-A-link`, + status: `from-hardcoded-data`, + initialOrSecond: `initial-page`, + }, + } +} diff --git a/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-with-data.js b/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-with-data.js new file mode 100644 index 0000000000000..3e5b1645da7b0 --- /dev/null +++ b/e2e-tests/development-runtime/src/components/query-data-caches/adding-static-query-with-data.js @@ -0,0 +1,13 @@ +import { graphql, useStaticQuery } from "gatsby" + +export function useDataForAddingStaticQueryTest() { + return useStaticQuery(graphql` + { + queryDataCachesJson( + selector: { eq: "adding-static-query-A-to-B-to-A-link" } + ) { + ...QueryDataCachesFragmentInitialPage + } + } + `) +} diff --git a/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-A.js b/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-A.js new file mode 100644 index 0000000000000..6e4a2703c0a51 --- /dev/null +++ b/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-A.js @@ -0,0 +1,21 @@ +import React from "react" +import { Link } from "gatsby" +import { QueryDataCachesView } from "../../../components/query-data-caches/view" +import { useDataForAddingStaticQueryTest } from "../../../components/query-data-caches/adding-static-query-blank" + +export default function AddingStaticQueryToPageTemplatePageA({ path }) { + const data = useDataForAddingStaticQueryTest() + return ( + <> + + + Go to page B + + + ) +} diff --git a/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-B.js b/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-B.js new file mode 100644 index 0000000000000..18a209c901662 --- /dev/null +++ b/e2e-tests/development-runtime/src/pages/query-data-caches/adding-static-query-A-to-B-to-A-link/page-B.js @@ -0,0 +1,28 @@ +import React from "react" +import { Link, graphql, useStaticQuery } from "gatsby" +import { QueryDataCachesView } from "../../../components/query-data-caches/view" + +export default function AddingStaticQueryToPageTemplatePageB({ path }) { + const data = useStaticQuery(graphql` + { + queryDataCachesJson( + selector: { eq: "adding-static-query-A-to-B-to-A-link" } + ) { + ...QueryDataCachesFragmentSecondPage + } + } + `) + return ( + <> + + + Go back to page A + + + ) +} diff --git a/packages/gatsby/cache-dir/dev-loader.js b/packages/gatsby/cache-dir/dev-loader.js index 7d6169a981b32..25bbdf38d2ff9 100644 --- a/packages/gatsby/cache-dir/dev-loader.js +++ b/packages/gatsby/cache-dir/dev-loader.js @@ -38,8 +38,8 @@ class DevLoader extends BaseLoader { this.handleStaticQueryResultHotUpdate(msg) } else if (msg.type === `pageQueryResult`) { this.handlePageQueryResultHotUpdate(msg) - } else if (msg.type === `dirtyQueries`) { - this.handleDirtyPageQueryMessage(msg) + } else if (msg.type === `stalePageData`) { + this.handleStalePageDataMessage(msg) } }) } else if (process.env.NODE_ENV !== `test`) { @@ -103,6 +103,8 @@ class DevLoader extends BaseLoader { const cachedPageData = this.pageDataDb.get(pageDataDbCacheKey)?.payload if (!isEqual(newPageData, cachedPageData)) { + // TODO: if this is update for current page and there are any new static queries added + // that are not yet cached, there is currently no trigger to fetch them (yikes) // always update canonical key for pageDataDb this.pageDataDb.set(pageDataDbCacheKey, { pagePath: pageDataDbCacheKey, @@ -146,8 +148,8 @@ class DevLoader extends BaseLoader { } } - handleDirtyPageQueryMessage(msg) { - msg.payload.dirtyQueries.forEach(dirtyQueryId => { + handleStalePageDataMessage(msg) { + msg.payload.stalePageDataPaths.forEach(dirtyQueryId => { if (dirtyQueryId === `/dev-404-page/` || dirtyQueryId === `/404.html`) { // those pages are not on demand so skipping return diff --git a/packages/gatsby/cache-dir/ensure-resources.js b/packages/gatsby/cache-dir/ensure-resources.js index b548e7a8d5572..c3232c1fab076 100644 --- a/packages/gatsby/cache-dir/ensure-resources.js +++ b/packages/gatsby/cache-dir/ensure-resources.js @@ -48,7 +48,7 @@ class EnsureResources extends React.Component { } if ( - process.env.GATSBY_EXPERIMENTAL_QUERY_ON_DEMAND && + process.env.BUILD_STAGE === `develop` && nextState.pageResources.stale ) { this.loadResources(nextProps.location.pathname) diff --git a/packages/gatsby/cache-dir/loader.js b/packages/gatsby/cache-dir/loader.js index 80b1a2720e54b..de73b9938d49b 100644 --- a/packages/gatsby/cache-dir/loader.js +++ b/packages/gatsby/cache-dir/loader.js @@ -191,7 +191,7 @@ export class BaseLoader { const pagePath = findPath(rawPath) if (this.pageDataDb.has(pagePath)) { const pageData = this.pageDataDb.get(pagePath) - if (!process.env.GATSBY_EXPERIMENTAL_QUERY_ON_DEMAND || !pageData.stale) { + if (process.env.BUILD_STAGE !== `develop` || !pageData.stale) { return Promise.resolve(pageData) } } @@ -212,10 +212,7 @@ export class BaseLoader { const pagePath = findPath(rawPath) if (this.pageDb.has(pagePath)) { const page = this.pageDb.get(pagePath) - if ( - !process.env.GATSBY_EXPERIMENTAL_QUERY_ON_DEMAND || - !page.payload.stale - ) { + if (process.env.BUILD_STAGE !== `develop` || !page.payload.stale) { return Promise.resolve(page.payload) } } diff --git a/packages/gatsby/src/utils/websocket-manager.ts b/packages/gatsby/src/utils/websocket-manager.ts index b4902e129e7cc..760f8735ac8ce 100644 --- a/packages/gatsby/src/utils/websocket-manager.ts +++ b/packages/gatsby/src/utils/websocket-manager.ts @@ -1,6 +1,7 @@ /* eslint-disable no-invalid-this */ import { store, emitter } from "../redux" +import { IAddPendingTemplateDataWriteAction } from "../redux/types" import { clearDirtyQueriesListToEmitViaWebsocket } from "../redux/actions/internal" import { Server as HTTPSServer } from "https" import { Server as HTTPServer } from "http" @@ -119,12 +120,34 @@ export class WebsocketManager { }) if (process.env.GATSBY_EXPERIMENTAL_QUERY_ON_DEMAND) { - emitter.on(`CREATE_PAGE`, this.emitDirtyQueriesIds) - emitter.on(`CREATE_NODE`, this.emitDirtyQueriesIds) - emitter.on(`DELETE_NODE`, this.emitDirtyQueriesIds) - emitter.on(`QUERY_EXTRACTED`, this.emitDirtyQueriesIds) + // page-data marked stale due to dirty query tracking + const boundEmitStalePageDataPathsFromDirtyQueryTracking = this.emitStalePageDataPathsFromDirtyQueryTracking.bind( + this + ) + emitter.on( + `CREATE_PAGE`, + boundEmitStalePageDataPathsFromDirtyQueryTracking + ) + emitter.on( + `CREATE_NODE`, + boundEmitStalePageDataPathsFromDirtyQueryTracking + ) + emitter.on( + `DELETE_NODE`, + boundEmitStalePageDataPathsFromDirtyQueryTracking + ) + emitter.on( + `QUERY_EXTRACTED`, + boundEmitStalePageDataPathsFromDirtyQueryTracking + ) } + // page-data marked stale due to static query hashes change + emitter.on( + `ADD_PENDING_TEMPLATE_DATA_WRITE`, + this.emitStalePageDataPathsFromStaticQueriesAssignment.bind(this) + ) + return this.websocket } @@ -187,20 +210,35 @@ export class WebsocketManager { } } - emitDirtyQueriesIds = (): void => { + emitStalePageDataPathsFromDirtyQueryTracking(): void { const dirtyQueries = store.getState().queries .dirtyQueriesListToEmitViaWebsocket - if (dirtyQueries.length > 0) { + if (this.emitStalePageDataPaths(dirtyQueries)) { + store.dispatch(clearDirtyQueriesListToEmitViaWebsocket()) + } + } + + emitStalePageDataPathsFromStaticQueriesAssignment( + pendingTemplateDataWrite: IAddPendingTemplateDataWriteAction + ): void { + this.emitStalePageDataPaths( + Array.from(pendingTemplateDataWrite.payload.pages) + ) + } + + emitStalePageDataPaths(stalePageDataPaths: Array): boolean { + if (stalePageDataPaths.length > 0) { if (this.websocket) { this.websocket.send({ - type: `dirtyQueries`, - payload: { dirtyQueries }, + type: `stalePageData`, + payload: { stalePageDataPaths }, }) - store.dispatch(clearDirtyQueriesListToEmitViaWebsocket()) + return true } } + return false } } From f9bd368cfb64d2960080f359ca92ee07dfb67668 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Mon, 30 Nov 2020 09:52:02 -0800 Subject: [PATCH 015/144] Update release notes (#28342) --- docs/reference/release-notes/v2.27/index.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/reference/release-notes/v2.27/index.md b/docs/reference/release-notes/v2.27/index.md index 5d3b6491a9121..365d932c59134 100644 --- a/docs/reference/release-notes/v2.27/index.md +++ b/docs/reference/release-notes/v2.27/index.md @@ -75,13 +75,15 @@ Try it out immediately by running `GATSBY_EXPERIMENTAL_DEV_SSR=true gatsby devel ### Experimental: Lazy page bundling in development +UPDATE: After a number of community members tested the change on their website, we decided it wasn't going to work out—https://github.com/gatsbyjs/gatsby/discussions/28137#discussioncomment-138998 + An obstacle to Gatsby being a delightful experience for larger sites is JavaScript compilation can start to get annoyingly slow. For example, gatsbyjs.com takes over two minutes currently (with a cold cache) to compile and bundle the code for the many page components. Not acceptable! We knew we needed to make this lazy and have shipped experimental support for this. Now when you run `GATSBY_EXPERIMENT_DEVJS_LAZY=true gatsby develop`, webpack won't look at any of your page components until you visit them. You'll notice a slight (generally under 0.5s) delay when you first visit a page while webpack compiles it but thereafter, it'll be instantaneous. -All sites should see some speedups but it's especially noticible for larger sites like gatsbyjs.com which now starts webpack 81% faster than before! Please test it out and tell us how fast your dev server boots up over at the [umbrella issue](https://github.com/gatsbyjs/gatsby/issues/28138) along with any bugs you might run across. +All sites should see some speedups but it's especially noticible for larger sites like gatsbyjs.com which now starts webpack 81% faster than before! Please test it out and tell us how fast your dev server boots up over at the [umbrella issue](https://github.com/gatsbyjs/gatsby/discussions/28137) along with any bugs you might run across. ## gatsby-plugin-mdx@1.5.0 From d18b19967936efcefb9d806b49050d00ceb73575 Mon Sep 17 00:00:00 2001 From: Kyle Gill Date: Mon, 30 Nov 2020 12:13:18 -0700 Subject: [PATCH 016/144] wip(gatsby-cli): add login, logout, whoami commands (#28251) * add first wip implementation of login command * add logout and whoami commands * update urls * wrap commands in experimental flag --- packages/gatsby-cli/src/create-cli.ts | 29 +++++ packages/gatsby-cli/src/login.ts | 109 +++++++++++++++++++ packages/gatsby-cli/src/logout.ts | 10 ++ packages/gatsby-cli/src/util/manage-token.ts | 23 ++++ packages/gatsby-cli/src/whoami.ts | 43 ++++++++ 5 files changed, 214 insertions(+) create mode 100644 packages/gatsby-cli/src/login.ts create mode 100644 packages/gatsby-cli/src/logout.ts create mode 100644 packages/gatsby-cli/src/util/manage-token.ts create mode 100644 packages/gatsby-cli/src/whoami.ts diff --git a/packages/gatsby-cli/src/create-cli.ts b/packages/gatsby-cli/src/create-cli.ts index 19973fffd1c17..acc33143e3793 100644 --- a/packages/gatsby-cli/src/create-cli.ts +++ b/packages/gatsby-cli/src/create-cli.ts @@ -16,6 +16,9 @@ import report from "./reporter" import { setStore } from "./reporter/redux" import { getLocalGatsbyVersion } from "./util/version" import { initStarter } from "./init-starter" +import { login } from "./login" +import { logout } from "./logout" +import { whoami } from "./whoami" import { recipesHandler } from "./recipes" import { getPackageManager, setPackageManager } from "./util/package-manager" import reporter from "./reporter" @@ -411,6 +414,32 @@ function buildLocalCommands(cli: yargs.Argv, isLocalSite: boolean): void { }), handler: getCommandHandler(`plugin`), }) + + if (process.env.GATSBY_EXPERIMENTAL_CLOUD_CLI) { + cli.command({ + command: `login`, + describe: `Log in to Gatsby Cloud.`, + handler: handlerP(async () => { + await login() + }), + }) + + cli.command({ + command: `logout`, + describe: `Sign out of Gatsby Cloud.`, + handler: handlerP(async () => { + await logout() + }), + }) + + cli.command({ + command: `whoami`, + describe: `Gives the username of the current logged in user.`, + handler: handlerP(async () => { + await whoami() + }), + }) + } } function isLocalGatsbySite(): boolean { diff --git a/packages/gatsby-cli/src/login.ts b/packages/gatsby-cli/src/login.ts new file mode 100644 index 0000000000000..baa5895e9d8f2 --- /dev/null +++ b/packages/gatsby-cli/src/login.ts @@ -0,0 +1,109 @@ +import fetch from "node-fetch" +import opn from "better-opn" +import reporter from "./reporter" +import { getToken, setToken } from "./util/manage-token" + +interface ITicket { + verified: boolean + token?: string | null + expiration?: string | null +} + +const createTicket = async (): Promise => { + let ticketId + try { + const ticketResponse = await fetch( + `https://auth.gatsbyjs.com/auth/tickets/create`, + { + method: `post`, + } + ) + const ticketJson = await ticketResponse.json() + ticketId = ticketJson.ticketId + } catch (e) { + reporter.panic( + `We had trouble connecting to Gatsby Cloud to create a login session. +Please try again later, and if it continues to have trouble connecting file an issue.` + ) + } + + return ticketId +} + +const getTicket = async (ticketId: string): Promise => { + let ticket: ITicket = { + verified: false, + } + try { + const ticketResponse = await fetch( + `https://auth.gatsbyjs.com/auth/tickets/${ticketId}` + ) + const ticketJson = await ticketResponse.json() + ticket = ticketJson + } catch (e) { + reporter.error(e) + } + + return ticket +} + +const handleOpenBrowser = (url): void => { + // TODO: this will break if run from the CLI + // for ideas see https://github.com/netlify/cli/blob/908f285fb80f04bf2635da73381c94387b9c8b0d/src/utils/open-browser.js + console.log(``) + reporter.info(`Opening Gatsby Cloud for you to login from, copy this`) + reporter.info(`url into your browser if it doesn't open automatically:`) + console.log(``) + console.log(url) + opn(url) +} + +/** + * Main function that logs in to Gatsby Cloud using Gatsby Cloud's authentication service. + */ +export async function login(): Promise { + const tokenFromStore = await getToken() + + if (tokenFromStore) { + reporter.info(`You are already logged in!`) + return + } + + const webUrl = `https://gatsbyjs.com` + reporter.info(`Logging into your Gatsby Cloud account...`) + + // Create "ticket" for auth (like an expiring session) + const ticketId = await createTicket() + + // Open browser for authentication + const authUrl = `${webUrl}/dashboard/login?authType=EXTERNAL_AUTH&ticketId=${ticketId}&noredirect=1` + + await handleOpenBrowser(authUrl) + + // Poll until the ticket has been verified, and should have the token attached + function pollForTicket(): Promise { + return new Promise(function (resolve): void { + // eslint-disable-next-line consistent-return + async function verify(): Promise { + const ticket = await getTicket(ticketId) + const timeoutId = setTimeout(verify, 3000) + if (ticket.verified) { + clearTimeout(timeoutId) + return resolve(ticket) + } + } + + verify() + }) + } + + console.log(``) + reporter.info(`Waiting for login from Gatsby Cloud...`) + + const ticket = await pollForTicket() + + if (ticket?.token && ticket?.expiration) { + await setToken(ticket.token, ticket.expiration) + } + reporter.info(`You have been logged in!`) +} diff --git a/packages/gatsby-cli/src/logout.ts b/packages/gatsby-cli/src/logout.ts new file mode 100644 index 0000000000000..2ec2d49c6b890 --- /dev/null +++ b/packages/gatsby-cli/src/logout.ts @@ -0,0 +1,10 @@ +import reporter from "./reporter" +import { setToken } from "./util/manage-token" + +/** + * Main function that logs out of Gatsby Cloud by removing the token from the config store. + */ +export async function logout(): Promise { + await setToken(null, ``) + reporter.info(`You have been logged out of Gatsby Cloud from this device.`) +} diff --git a/packages/gatsby-cli/src/util/manage-token.ts b/packages/gatsby-cli/src/util/manage-token.ts new file mode 100644 index 0000000000000..27c6147eda669 --- /dev/null +++ b/packages/gatsby-cli/src/util/manage-token.ts @@ -0,0 +1,23 @@ +import { getConfigStore } from "gatsby-core-utils" +import report from "../reporter" + +const tokenKey = `cli.token` +const tokenExpirationKey = `cli.tokenExpiration` + +const getExpiration = (): string => getConfigStore().get(tokenExpirationKey) +export const getToken = async (): Promise => { + const expiration = await getExpiration() + const tokenHasExpired = new Date() > new Date(expiration) + if (tokenHasExpired) { + report.warn(`Your token has expired, you may need to login again`) + } + return getConfigStore().get(tokenKey) +} + +export const setToken = (token: string | null, expiration: string): void => { + const store = getConfigStore() + + store.set(tokenKey, token) + // we would be able to decode an expiration off the JWT, but the auth service isn't set up to attach it to the token + store.set(tokenExpirationKey, expiration) +} diff --git a/packages/gatsby-cli/src/whoami.ts b/packages/gatsby-cli/src/whoami.ts new file mode 100644 index 0000000000000..16e0dce35c0e8 --- /dev/null +++ b/packages/gatsby-cli/src/whoami.ts @@ -0,0 +1,43 @@ +import fetch from "node-fetch" +import reporter from "./reporter" +import { getToken } from "./util/manage-token" + +const getUsername = async (token: string): Promise => { + let currentUsername + const query = `query { + currentUser { + name + } + }` + try { + const usernameResponse = await fetch(`https://api.gatsbyjs.com/graphql`, { + method: `post`, + body: JSON.stringify({ query }), + headers: { + Authorization: `Bearer ${token}`, + "content-type": `application/json`, + }, + }) + const resJson = await usernameResponse.json() + currentUsername = resJson.data.currentUser.name + } catch (e) { + reporter.error(e) + } + + return currentUsername +} + +/** + * Reports the username of the logged in user if they are logged in. + */ +export async function whoami(): Promise { + const tokenFromStore = await getToken() + + if (!tokenFromStore) { + reporter.info(`You are not currently logged in!`) + return + } + + const username = await getUsername(tokenFromStore) + reporter.info(username) +} From 9c8f78842784c6882953d2f5c72dd71d61ba3e29 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Mon, 30 Nov 2020 11:51:07 -0800 Subject: [PATCH 017/144] feat(gatsby): people who are using a flag, invite them to try out other flags (#28338) * feat(gatsby): people who are using a flag, invite them to try out other flags * Avoid scaling problems --- .../__snapshots__/handle-flags.ts.snap | 4 ++ .../src/utils/__tests__/handle-flags.ts | 7 +++ packages/gatsby/src/utils/handle-flags.ts | 49 ++++++++++++------- 3 files changed, 42 insertions(+), 18 deletions(-) diff --git a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap index 23541c5a3e911..46b63e30cbab9 100644 --- a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap +++ b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap @@ -61,6 +61,10 @@ Object { - ALL_COMMANDS · (Umbrella Issue (test)) · test - DEV_SSR · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/28138)) · SSR pages on full reloads during develop. Helps you detect SSR bugs and fix them without needing to do full builds. - QUERY_ON_DEMAND · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/27620)) · Only run queries when needed instead of running all queries upfront. Speeds starting the develop server. + +There are 2 other flags available that you might be interested in: +- ONLY_BUILDS · (Umbrella Issue (test)) · test +- YET_ANOTHER · (Umbrella Issue (test)) · test ", "unknownFlagMessage": "", } diff --git a/packages/gatsby/src/utils/__tests__/handle-flags.ts b/packages/gatsby/src/utils/__tests__/handle-flags.ts index 7afb54e37139b..4af0bbd1a2443 100644 --- a/packages/gatsby/src/utils/__tests__/handle-flags.ts +++ b/packages/gatsby/src/utils/__tests__/handle-flags.ts @@ -46,6 +46,13 @@ describe(`handle flags`, () => { description: `test`, umbrellaIssue: `test`, }, + { + name: `YET_ANOTHER`, + env: `GATSBY_EXPERIMENTAL_SOMETHING_COOL2`, + command: `all`, + description: `test`, + umbrellaIssue: `test`, + }, ] const configFlags = { diff --git a/packages/gatsby/src/utils/handle-flags.ts b/packages/gatsby/src/utils/handle-flags.ts index ca68f6534fc53..ff825a8ecda02 100644 --- a/packages/gatsby/src/utils/handle-flags.ts +++ b/packages/gatsby/src/utils/handle-flags.ts @@ -101,31 +101,44 @@ const handleFlags = ( // TODO remove flags that longer exist. // w/ message of thanks + const generateFlagLine = (flag): string => { + let message = `` + message += `\n- ${flag.name}` + if (flag.experimental) { + message += ` · ${chalk.white.bgRed.bold(`EXPERIMENTAL`)}` + } + if (flag.umbrellaIssue) { + message += ` · (${terminalLink(`Umbrella Issue`, flag.umbrellaIssue)})` + } + message += ` · ${flag.description}` + + return message + } + let message = `` // Create message about what flags are active. if (enabledConfigFlags.length > 0) { message = `The following flags are active:` enabledConfigFlags.forEach(flag => { - message += `\n- ${flag.name}` - if (flag.experimental) { - message += ` · ${chalk.white.bgRed.bold(`EXPERIMENTAL`)}` - } - if (flag.umbrellaIssue) { - message += ` · (${terminalLink(`Umbrella Issue`, flag.umbrellaIssue)})` - } - message += ` · ${flag.description}` + message += generateFlagLine(flag) }) - // TODO renable once "gatsby flags` CLI command exists. - // Suggest enabling other flags if they're not trying them all. - // const otherFlagsCount = flags.length - enabledConfigFlags.length - // if (otherFlagsCount > 0) { - // message += `\n\nThere ${ - // otherFlagsCount === 1 - // ? `is one other flag` - // : `are ${otherFlagsCount} other flags` - // } available you can test — run "gatsby flags" to enable them` - // } + const otherFlagsCount = flags.length - enabledConfigFlags.length + if (otherFlagsCount > 0) { + message += `\n\nThere ${ + otherFlagsCount === 1 + ? `is one other flag` + : `are ${otherFlagsCount} other flags` + } available that you might be interested in:` + + const enabledFlagsSet = new Set() + enabledConfigFlags.forEach(f => enabledFlagsSet.add(f.name)) + flags.forEach(flag => { + if (!enabledFlagsSet.has(flag.name)) { + message += generateFlagLine(flag) + } + }) + } message += `\n` } From 91b0433a8155efe526ab93028fdec25c86d5124c Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Mon, 30 Nov 2020 13:26:38 -0800 Subject: [PATCH 018/144] feature(docs): Add mention of flags to the gatsby-config.js doc page (#28384) --- docs/docs/gatsby-config.md | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/docs/docs/gatsby-config.md b/docs/docs/gatsby-config.md index ac891c2d02441..098e421cc050f 100644 --- a/docs/docs/gatsby-config.md +++ b/docs/docs/gatsby-config.md @@ -12,11 +12,12 @@ Options available to set within `gatsby-config.js` include: 1. [siteMetadata](#sitemetadata) (object) 2. [plugins](#plugins) (array) -3. [pathPrefix](#pathprefix) (string) -4. [polyfill](#polyfill) (boolean) -5. [mapping](#mapping-node-types) (object) -6. [proxy](#proxy) (object) -7. [developMiddleware](#advanced-proxying-with-developmiddleware) (function) +3. [flags](#flags) (object) +4. [pathPrefix](#pathprefix) (string) +5. [polyfill](#polyfill) (boolean) +6. [mapping](#mapping-node-types) (object) +7. [proxy](#proxy) (object) +8. [developMiddleware](#advanced-proxying-with-developmiddleware) (function) ## siteMetadata @@ -57,6 +58,20 @@ module.exports = { See more about [Plugins](/docs/plugins/) for more on utilizing plugins, and to see available official and community plugins. +## Flags + +Flags let sites enable experimental or upcoming changes that are still in testing or waiting for the next major release. + +[Go here to see a list of the current flags](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/utils/flags.ts). + +```javascript:title=gatsby-config.js +module.exports = { + flags: { + QUERY_ON_DEMAND: true, + }, +} +``` + ## pathPrefix It's common for sites to be hosted somewhere other than the root of their domain. Say you have a Gatsby site at `example.com/blog/`. In this case, you would need a prefix (`/blog`) added to all paths on the site. From 93a144744c20fc57f563cb5af2683725abc3c941 Mon Sep 17 00:00:00 2001 From: Matt Kane Date: Tue, 1 Dec 2020 07:04:56 +0000 Subject: [PATCH 019/144] fix(gatsby-plugin-image): Fix StaticImage props interface and add propTypes (#28372) * Add proptypes and better props defs * Fix compilation error --- .../src/components/gatsby-image.browser.tsx | 14 +-- .../src/components/hooks.ts | 7 +- .../src/components/layout-wrapper.tsx | 12 ++- .../src/components/static-image.server.tsx | 94 ++++++++++++++++++- .../src/components/static-image.tsx | 16 +++- .../gatsby-plugin-image/src/image-utils.ts | 3 +- packages/gatsby-plugin-image/src/utils.ts | 3 +- packages/gatsby-plugin-image/tsconfig.json | 2 +- 8 files changed, 127 insertions(+), 24 deletions(-) diff --git a/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx b/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx index 227d6b69c4116..b03defdc43607 100644 --- a/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx +++ b/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx @@ -15,12 +15,14 @@ import { } from "./hooks" import { PlaceholderProps } from "./placeholder" import { MainImageProps } from "./main-image" -import { Layout } from "../utils" - -export type GatsbyImageProps = Omit< - ImgHTMLAttributes, - "placeholder" | "onLoad" | "src" | "srcSet" | "width" | "height" -> & { +import { Layout } from "../image-utils" + +// eslint-disable-next-line @typescript-eslint/interface-name-prefix +export interface GatsbyImageProps + extends Omit< + ImgHTMLAttributes, + "placeholder" | "onLoad" | "src" | "srcSet" | "width" | "height" + > { alt: string as?: ElementType className?: string diff --git a/packages/gatsby-plugin-image/src/components/hooks.ts b/packages/gatsby-plugin-image/src/components/hooks.ts index 0612a9322b531..19895626c39c3 100644 --- a/packages/gatsby-plugin-image/src/components/hooks.ts +++ b/packages/gatsby-plugin-image/src/components/hooks.ts @@ -11,9 +11,12 @@ import { import { Node } from "gatsby" import { PlaceholderProps } from "./placeholder" import { MainImageProps } from "./main-image" -import { Layout } from "../utils" import type { IGatsbyImageData } from "./gatsby-image.browser" -import { IGatsbyImageHelperArgs, generateImageData } from "../image-utils" +import { + IGatsbyImageHelperArgs, + generateImageData, + Layout, +} from "../image-utils" const imageCache = new Set() // Native lazy-loading support: https://addyosmani.com/blog/lazy-loading/ diff --git a/packages/gatsby-plugin-image/src/components/layout-wrapper.tsx b/packages/gatsby-plugin-image/src/components/layout-wrapper.tsx index c14e7c68c606c..c4e9a728b55f9 100644 --- a/packages/gatsby-plugin-image/src/components/layout-wrapper.tsx +++ b/packages/gatsby-plugin-image/src/components/layout-wrapper.tsx @@ -1,7 +1,9 @@ -/* global SERVER */ +// eslint-disable-next-line @typescript-eslint/triple-slash-reference +/// + import React, { Fragment, FunctionComponent } from "react" import terserMacro from "../../macros/terser.macro" -import { Layout } from "../utils" +import { Layout } from "../image-utils" export interface ILayoutWrapperProps { layout: Layout @@ -71,7 +73,11 @@ export const LayoutWrapper: FunctionComponent = function La {sizer} {children} - {SERVER && } + + { + // eslint-disable-next-line no-undef + SERVER && + } ) } diff --git a/packages/gatsby-plugin-image/src/components/static-image.server.tsx b/packages/gatsby-plugin-image/src/components/static-image.server.tsx index 35a47d4cd608e..ea598e43f6fe9 100644 --- a/packages/gatsby-plugin-image/src/components/static-image.server.tsx +++ b/packages/gatsby-plugin-image/src/components/static-image.server.tsx @@ -1,7 +1,29 @@ import React, { FunctionComponent } from "react" -import { StaticImageProps } from "../utils" import { GatsbyImage as GatsbyImageServer } from "./gatsby-image.server" import { GatsbyImageProps, IGatsbyImageData } from "./gatsby-image.browser" +import PropTypes from "prop-types" +import { ImageFormat, Layout, Fit } from "../image-utils" + +export interface IStaticImageProps extends Omit { + src: string + layout?: Layout + formats?: Array + placeholder?: "tracedSVG" | "dominantColor" | "blurred" | "none" + tracedSVGOptions?: Record + width?: number + height?: number + maxWidth?: number + maxHeight?: number + sizes?: string + quality?: number + transformOptions: { + fit?: Fit + } + jpgOptions?: Record + pngOptions?: Record + webpOptions?: Record + blurredOptions: Record +} // These values are added by Babel. Do not add them manually interface IPrivateProps { @@ -11,11 +33,26 @@ interface IPrivateProps { export function _getStaticImage( GatsbyImage: FunctionComponent -): React.FC { +): React.FC { return function StaticImage({ src, __imageData: imageData, __error, + /* eslint-disable @typescript-eslint/no-unused-vars */ + width, + maxWidth, + height, + maxHeight, + tracedSVGOptions, + placeholder, + formats, + quality, + transformOptions, + jpgOptions, + pngOptions, + webpOptions, + blurredOptions, + /* eslint-enable @typescript-eslint/no-unused-vars */ ...props }): JSX.Element { if (__error) { @@ -35,6 +72,55 @@ export function _getStaticImage( } } -export const StaticImage: React.FC< - StaticImageProps & IPrivateProps +const StaticImage: React.FC< + IStaticImageProps & IPrivateProps > = _getStaticImage(GatsbyImageServer) + +const checkDimensionProps: PropTypes.Validator = ( + props: IStaticImageProps & IPrivateProps, + propName: keyof IStaticImageProps & IPrivateProps, + ...rest +) => { + if (props.layout === `fluid` || props.layout === `constrained`) { + if (propName === `maxWidth` && !props[propName]) { + return new Error( + `The prop "${propName}" is required when layout is "${props.layout}"` + ) + } + if ((propName === `width` || propName === `height`) && props[propName]) { + return new Error( + `"${propName}" ${props[propName]} may not be passed when layout is "${props.layout}"` + ) + } + } else { + if ( + (propName === `maxWidth` || propName === `maxHeight`) && + props[propName] + ) { + return new Error( + `"${propName}" may not be passed when layout is "${props.layout}"` + ) + } + if (propName === `width` && !props[propName]) { + return new Error( + `The prop "${propName}" is required when layout is "${props.layout}"` + ) + } + } + return PropTypes.number(props, propName, ...rest) +} + +export const propTypes = { + src: PropTypes.string.isRequired, + alt: PropTypes.string.isRequired, + width: checkDimensionProps, + height: checkDimensionProps, + maxHeight: checkDimensionProps, + maxWidth: checkDimensionProps, + sizes: PropTypes.string, +} + +StaticImage.displayName = `StaticImage` +StaticImage.propTypes = propTypes + +export { StaticImage } diff --git a/packages/gatsby-plugin-image/src/components/static-image.tsx b/packages/gatsby-plugin-image/src/components/static-image.tsx index c194f412364a7..b8433e5c7295f 100644 --- a/packages/gatsby-plugin-image/src/components/static-image.tsx +++ b/packages/gatsby-plugin-image/src/components/static-image.tsx @@ -2,14 +2,22 @@ import { GatsbyImage as GatsbyImageBrowser, IGatsbyImageData, } from "./gatsby-image.browser" -import { _getStaticImage } from "./static-image.server" -import { StaticImageProps } from "../utils" +import { + _getStaticImage, + propTypes, + IStaticImageProps, +} from "./static-image.server" // These values are added by Babel. Do not add them manually interface IPrivateProps { __imageData?: IGatsbyImageData __error?: string } -export const StaticImage: React.FC< - StaticImageProps & IPrivateProps +const StaticImage: React.FC< + IStaticImageProps & IPrivateProps > = _getStaticImage(GatsbyImageBrowser) + +StaticImage.displayName = `StaticImage` +StaticImage.propTypes = propTypes + +export { StaticImage } diff --git a/packages/gatsby-plugin-image/src/image-utils.ts b/packages/gatsby-plugin-image/src/image-utils.ts index e0686311957c6..e616768db03b4 100644 --- a/packages/gatsby-plugin-image/src/image-utils.ts +++ b/packages/gatsby-plugin-image/src/image-utils.ts @@ -9,6 +9,7 @@ const DEFAULT_FIXED_WIDTH = 400 export type Fit = "cover" | "fill" | "inside" | "outside" | "contain" export type Layout = "fixed" | "fluid" | "constrained" +export type ImageFormat = "jpg" | "png" | "webp" | "avif" | "auto" | "" /** * The minimal required reporter, as we don't want to import it from gatsby-cli @@ -66,8 +67,6 @@ export interface IImage { format: ImageFormat } -export type ImageFormat = "jpg" | "png" | "webp" | "avif" | "auto" | "" - export interface IGatsbyImageHelperArgs { pluginName: string generateImageSource: ( diff --git a/packages/gatsby-plugin-image/src/utils.ts b/packages/gatsby-plugin-image/src/utils.ts index 50573851a25aa..91bad62d29b97 100644 --- a/packages/gatsby-plugin-image/src/utils.ts +++ b/packages/gatsby-plugin-image/src/utils.ts @@ -1,6 +1,5 @@ import { ImgHTMLAttributes, ElementType } from "react" - -export type Layout = "fixed" | "fluid" | "constrained" +import { Layout } from "./image-utils" export interface ICommonImageProps { layout?: Layout diff --git a/packages/gatsby-plugin-image/tsconfig.json b/packages/gatsby-plugin-image/tsconfig.json index cf9ab118b02d9..f71d85383877f 100644 --- a/packages/gatsby-plugin-image/tsconfig.json +++ b/packages/gatsby-plugin-image/tsconfig.json @@ -12,5 +12,5 @@ "skipLibCheck": true // "jsxFactory": "createElement" }, - "include": ["./src/global.d.ts", "./src/index.ts", "./src/index.browser.ts"] + "files": ["./src/global.d.ts", "./src/index.ts", "./src/index.browser.ts"] } From 3ce476b1eac97aedd16f9d150cd6a81f36255380 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 00:45:52 -0800 Subject: [PATCH 020/144] fix(gatsby): move starting dev-ssr listener inside function & only init listeners once (#28395) * fix(gatsby): move starting dev-ssr listener inside function & only init listeners once * fix snapshot --- .../gatsby/src/bootstrap/requires-writer.ts | 29 ++++++++++++------- .../__snapshots__/handle-flags.ts.snap | 7 +++++ 2 files changed, 25 insertions(+), 11 deletions(-) diff --git a/packages/gatsby/src/bootstrap/requires-writer.ts b/packages/gatsby/src/bootstrap/requires-writer.ts index 78058b91898c3..93268a065e698 100644 --- a/packages/gatsby/src/bootstrap/requires-writer.ts +++ b/packages/gatsby/src/bootstrap/requires-writer.ts @@ -321,22 +321,29 @@ const debouncedWriteAll = _.debounce( } ) -if (process.env.GATSBY_EXPERIMENTAL_DEV_SSR) { - /** - * Start listening to CREATE_SERVER_VISITED_PAGE events so we can rewrite - * files as required - */ - emitter.on(`CREATE_SERVER_VISITED_PAGE`, (): void => { - reporter.pendingActivity({ id: `requires-writer` }) - debouncedWriteAll() - }) -} - /** * Start listening to CREATE/DELETE_PAGE events so we can rewrite * files as required */ +let listenerStarted = false export const startListener = (): void => { + // Only start the listener once. + if (listenerStarted) { + return + } + listenerStarted = true + + if (process.env.GATSBY_EXPERIMENTAL_DEV_SSR) { + /** + * Start listening to CREATE_SERVER_VISITED_PAGE events so we can rewrite + * files as required + */ + emitter.on(`CREATE_SERVER_VISITED_PAGE`, (): void => { + reporter.pendingActivity({ id: `requires-writer` }) + debouncedWriteAll() + }) + } + emitter.on(`CREATE_PAGE`, (): void => { reporter.pendingActivity({ id: `requires-writer` }) debouncedWriteAll() diff --git a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap index 46b63e30cbab9..640b8b1199403 100644 --- a/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap +++ b/packages/gatsby/src/utils/__tests__/__snapshots__/handle-flags.ts.snap @@ -13,6 +13,13 @@ Object { ], "message": "The following flags are active: - ALL_COMMANDS · (Umbrella Issue (test)) · test + +There are 5 other flags available that you might be interested in: +- FAST_DEV · Enable all experiments aimed at improving develop server start time +- DEV_SSR · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/28138)) · SSR pages on full reloads during develop. Helps you detect SSR bugs and fix them without needing to do full builds. +- QUERY_ON_DEMAND · (Umbrella Issue (https://github.com/gatsbyjs/gatsby/discussions/27620)) · Only run queries when needed instead of running all queries upfront. Speeds starting the develop server. +- ONLY_BUILDS · (Umbrella Issue (test)) · test +- YET_ANOTHER · (Umbrella Issue (test)) · test ", "unknownFlagMessage": "The following flag(s) found in your gatsby-config.js are not known: - FASTLY_DEV (did you mean: FAST_DEV) From 5812c813cb6f74b1965870bbf4671e8fcd51dc9d Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Tue, 1 Dec 2020 10:14:11 +0100 Subject: [PATCH 021/144] fix(assert-changed-files): don't skip running tests on master (#28400) --- scripts/assert-changed-files.sh | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/scripts/assert-changed-files.sh b/scripts/assert-changed-files.sh index 486b29e039971..649fb3060f16c 100755 --- a/scripts/assert-changed-files.sh +++ b/scripts/assert-changed-files.sh @@ -3,6 +3,11 @@ IS_CI="${CI:-false}" GREP_PATTERN=$1 +if [ "$CIRCLE_BRANCH" = "master" ]; then + echo "On master branch; continuing." + exit 0 +fi + if [ "$IS_CI" = true ]; then git config --local url."https://github.com/".insteadOf git@github.com: git config --local user.name "GatsbyJS Bot" From a19a76d6aa429cda949ce6802bcd6820cdc4a1f7 Mon Sep 17 00:00:00 2001 From: Marvin Frachet Date: Tue, 1 Dec 2020 12:06:04 +0100 Subject: [PATCH 022/144] test(create-gatsby): snapshot plugins-options-form and tiny refactoring (#28366) --- .../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..58d5d5c6ec10f --- /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 config`, () => { + const plugins = [`not-valid-plugin`] + expect(makePluginConfigQuestions(plugins)).toEqual([]) + }) + + it(`returns an array 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 0e4d026059d9d0507de9433ed13e4bcd3d7376a6 Mon Sep 17 00:00:00 2001 From: LB Date: Tue, 1 Dec 2020 07:27:13 -0500 Subject: [PATCH 023/144] Feat: (gatsby-cli) Add a CLI command for listing plugins (#28018) * initial commit * initial gatsby list functionality * fix linter * use all, but pass a flag * add tests * Update integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/package.json * fix log destructure * use different not syntax * Refactor to move plugin commands out of gatsby package * linter * instead of showing the whole error let's show a more helpful message Co-authored-by: gatsbybot --- .../gatsby-cli/__tests__/plugin.js | 23 +++++++ .../gatsby-sites/gatsby-plugin/.eslintrc | 1 + .../gatsby-sites/gatsby-plugin/.gitignore | 69 +++++++++++++++++++ .../gatsby-plugin/gatsby-config.js | 14 ++++ .../gatsby-sites/gatsby-plugin/package.json | 39 +++++++++++ .../gatsby-plugin/src/pages/index.js | 2 + packages/create-gatsby/src/install-plugins.ts | 11 +-- packages/gatsby-cli/src/create-cli.ts | 13 +++- .../src/{ => handlers}/plugin-add.ts | 2 +- .../src/handlers}/plugin.ts | 19 +++-- .../src/providers/gatsby/plugin.js | 6 +- 11 files changed, 185 insertions(+), 14 deletions(-) create mode 100644 integration-tests/gatsby-cli/__tests__/plugin.js create mode 100644 integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.eslintrc create mode 100644 integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.gitignore create mode 100644 integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/gatsby-config.js create mode 100644 integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/package.json create mode 100644 integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/src/pages/index.js rename packages/gatsby-cli/src/{ => handlers}/plugin-add.ts (98%) rename packages/{gatsby/src/commands => gatsby-cli/src/handlers}/plugin.ts (73%) diff --git a/integration-tests/gatsby-cli/__tests__/plugin.js b/integration-tests/gatsby-cli/__tests__/plugin.js new file mode 100644 index 0000000000000..c5cf188dcbf23 --- /dev/null +++ b/integration-tests/gatsby-cli/__tests__/plugin.js @@ -0,0 +1,23 @@ +import { GatsbyCLI } from "../test-helpers" + + +const MAX_TIMEOUT = 2147483647 +jest.setTimeout(MAX_TIMEOUT) + +describe(`gatsby plugin`, () => { + const cwd = `gatsby-sites/gatsby-plugin` + + beforeAll(() => GatsbyCLI.from(cwd).invoke(`clean`)) + afterAll(() => GatsbyCLI.from(cwd).invoke(`clean`)) + + it(`lists plugins`, async () => { + const [code, logs] = GatsbyCLI.from(cwd).invoke([`plugin`, `ls`]) + + logs.should.contain(`gatsby-source-filesystem`) + logs.should.contain(`gatsby-plugin-offline`) + expect(logs).toEqual(expect.not.stringContaining(`ignore comments`)) + expect(code).toBe(0) + + }) +}) + \ No newline at end of file diff --git a/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.eslintrc b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.eslintrc new file mode 100644 index 0000000000000..9b12771a6f0fe --- /dev/null +++ b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.eslintrc @@ -0,0 +1 @@ +// Disable eslint-loader \ No newline at end of file diff --git a/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.gitignore b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.gitignore new file mode 100644 index 0000000000000..f81327511eeb4 --- /dev/null +++ b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/.gitignore @@ -0,0 +1,69 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# Typescript v1 declaration files +typings/ + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# dotenv environment variable files +.env* + +# gatsby files +.cache/ +public + +# Mac files +.DS_Store + +# Yarn +yarn-error.log +.pnp/ +.pnp.js +# Yarn Integrity file +.yarn-integrity diff --git a/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/gatsby-config.js b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/gatsby-config.js new file mode 100644 index 0000000000000..75d4b868f0fa5 --- /dev/null +++ b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/gatsby-config.js @@ -0,0 +1,14 @@ +module.exports = { + plugins: [ + { + resolve: "gatsby-source-filesystem", + options: { + "name": "pages", + "path": "./src/pages/" + } + + }, + `gatsby-plugin-offline`, + // ignore comments + ] +} \ No newline at end of file diff --git a/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/package.json b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/package.json new file mode 100644 index 0000000000000..b129dbe38820b --- /dev/null +++ b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/package.json @@ -0,0 +1,39 @@ +{ + "name": "gatsby-starter-default-plugin", + "private": true, + "description": "A simple starter to get up and developing quickly with Gatsby", + "version": "0.1.0", + "author": "Kyle Mathews ", + "dependencies": { + "gatsby": "^2.19.45", + "prop-types": "^15.7.2", + "react": "^16.12.0", + "react-dom": "^16.12.0", + "react-helmet": "^5.2.1", + "gatsby-source-filesystem": "^2.5.0", + "gatsby-plugin-offline": "^3.4.0" + }, + "devDependencies": { + "prettier": "2.0.4" + }, + "keywords": [ + "gatsby" + ], + "license": "MIT", + "scripts": { + "build": "gatsby build", + "develop": "gatsby develop", + "format": "prettier --write \"**/*.{js,jsx,json,md}\"", + "start": "npm run develop", + "serve": "gatsby serve", + "clean": "gatsby clean", + "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1" + }, + "repository": { + "type": "git", + "url": "https://github.com/gatsbyjs/gatsby-starter-default" + }, + "bugs": { + "url": "https://github.com/gatsbyjs/gatsby/issues" + } +} diff --git a/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/src/pages/index.js b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/src/pages/index.js new file mode 100644 index 0000000000000..cf671a42b39d9 --- /dev/null +++ b/integration-tests/gatsby-cli/gatsby-sites/gatsby-plugin/src/pages/index.js @@ -0,0 +1,2 @@ +import React from "react" +export default () =>
Hi
diff --git a/packages/create-gatsby/src/install-plugins.ts b/packages/create-gatsby/src/install-plugins.ts index f87a5d8d4fe64..d9bfc5ac50e76 100644 --- a/packages/create-gatsby/src/install-plugins.ts +++ b/packages/create-gatsby/src/install-plugins.ts @@ -27,10 +27,13 @@ export async function installPlugins( } try { - installPluginCommand = require.resolve(`gatsby-cli/lib/plugin-add`, { - // Try to find gatsby-cli in the site root, or in the site's gatsby dir - paths: [rootPath, path.dirname(gatsbyPath)], - }) + installPluginCommand = require.resolve( + `gatsby-cli/lib/handlers/plugin-add`, + { + // Try to find gatsby-cli in the site root, or in the site's gatsby dir + paths: [rootPath, path.dirname(gatsbyPath)], + } + ) } catch (e) { // The file is missing } diff --git a/packages/gatsby-cli/src/create-cli.ts b/packages/gatsby-cli/src/create-cli.ts index acc33143e3793..bccffe11ee8ea 100644 --- a/packages/gatsby-cli/src/create-cli.ts +++ b/packages/gatsby-cli/src/create-cli.ts @@ -22,6 +22,7 @@ import { whoami } from "./whoami" import { recipesHandler } from "./recipes" import { getPackageManager, setPackageManager } from "./util/package-manager" import reporter from "./reporter" +import pluginHandler from "./handlers/plugin" const handlerP = (fn: Function) => (...args: Array): void => { Promise.resolve(fn(...args)).then( @@ -404,15 +405,21 @@ function buildLocalCommands(cli: yargs.Argv, isLocalSite: boolean): void { builder: yargs => yargs .positional(`cmd`, { - choices: [`docs`], - describe: "Valid commands include `docs`.", + choices: [`docs`, `ls`], + describe: "Valid commands include `docs`, `ls`.", type: `string`, }) .positional(`plugins`, { describe: `The plugin names`, type: `string`, }), - handler: getCommandHandler(`plugin`), + handler: async ({ + cmd, + }: yargs.Arguments<{ + cmd: string | undefined + }>) => { + await pluginHandler(siteInfo.directory, cmd) + }, }) if (process.env.GATSBY_EXPERIMENTAL_CLOUD_CLI) { diff --git a/packages/gatsby-cli/src/plugin-add.ts b/packages/gatsby-cli/src/handlers/plugin-add.ts similarity index 98% rename from packages/gatsby-cli/src/plugin-add.ts rename to packages/gatsby-cli/src/handlers/plugin-add.ts index ae902589cb267..71101035408d0 100644 --- a/packages/gatsby-cli/src/plugin-add.ts +++ b/packages/gatsby-cli/src/handlers/plugin-add.ts @@ -1,5 +1,5 @@ import { NPMPackage, GatsbyPlugin } from "gatsby-recipes" -import reporter from "./reporter" +import reporter from "../reporter" const normalizePluginName = (plugin: string): string => { if (plugin.startsWith(`gatsby-`)) { return plugin diff --git a/packages/gatsby/src/commands/plugin.ts b/packages/gatsby-cli/src/handlers/plugin.ts similarity index 73% rename from packages/gatsby/src/commands/plugin.ts rename to packages/gatsby-cli/src/handlers/plugin.ts index edde15d421dee..b5f9a22d047d4 100644 --- a/packages/gatsby/src/commands/plugin.ts +++ b/packages/gatsby-cli/src/handlers/plugin.ts @@ -1,7 +1,7 @@ -import { IProgram } from "./types" +import { GatsbyPlugin } from "gatsby-recipes" +import reporter from "../reporter" -module.exports = async (args: IProgram & { cmd: string }): Promise => { - const { report, cmd } = args +export default async (root: string, cmd: string | undefined): Promise => { switch (cmd) { case `docs`: console.log(` @@ -25,9 +25,20 @@ module.exports = async (args: IProgram & { cmd: string }): Promise => { - Join Discord #plugin-authoring channel to ask questions! (https://gatsby.dev/discord/) `) return + case `ls`: { + try { + const plugins = await GatsbyPlugin.all({ root }, false) + console.log(plugins) + } catch { + reporter.error( + `There was a problem parsing your \`gatsby-config.js\` file.\nIt may be malformed. Or, the syntax you're using is not currently supported by this command.` + ) + } + return + } default: - report.error(`Unknown command ${cmd}`) + reporter.error(`Unknown command ${cmd}`) } return } diff --git a/packages/gatsby-recipes/src/providers/gatsby/plugin.js b/packages/gatsby-recipes/src/providers/gatsby/plugin.js index 192b9f6963301..555faeec67545 100644 --- a/packages/gatsby-recipes/src/providers/gatsby/plugin.js +++ b/packages/gatsby-recipes/src/providers/gatsby/plugin.js @@ -511,11 +511,13 @@ export { create, create as update, read, destroy } export const config = {} -export const all = async ({ root }) => { +export const all = async ({ root }, processPlugins = true) => { const configSrc = await readConfigFile(root) const plugins = getPluginsFromConfig(configSrc) - return Promise.all(plugins.map(({ name }) => read({ root }, name))) + return Promise.all( + plugins.map(({ name }) => (processPlugins ? read({ root }, name) : name)) + ) } const schema = { From deac4357af4813eeddc266070c7035ee0bb126d4 Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Tue, 1 Dec 2020 13:27:28 +0100 Subject: [PATCH 024/144] Revert "fix(assert-changed-files): don't skip running tests on master (#28400)" (#28408) This reverts commit 5812c813cb6f74b1965870bbf4671e8fcd51dc9d. --- scripts/assert-changed-files.sh | 5 ----- 1 file changed, 5 deletions(-) diff --git a/scripts/assert-changed-files.sh b/scripts/assert-changed-files.sh index 649fb3060f16c..486b29e039971 100755 --- a/scripts/assert-changed-files.sh +++ b/scripts/assert-changed-files.sh @@ -3,11 +3,6 @@ IS_CI="${CI:-false}" GREP_PATTERN=$1 -if [ "$CIRCLE_BRANCH" = "master" ]; then - echo "On master branch; continuing." - exit 0 -fi - if [ "$IS_CI" = true ]; then git config --local url."https://github.com/".insteadOf git@github.com: git config --local user.name "GatsbyJS Bot" From 4d14e22a5dd4a9522c25f55c5faefb207bd78db0 Mon Sep 17 00:00:00 2001 From: Marvin Frachet Date: Tue, 1 Dec 2020 13:37:30 +0100 Subject: [PATCH 025/144] test(create-gatsby): some for init starter (#28376) --- .../src/__tests__/init-starter.ts | 162 ++++++++++++++++++ packages/create-gatsby/src/init-starter.ts | 62 +++---- packages/create-gatsby/src/utils.ts | 12 ++ 3 files changed, 206 insertions(+), 30 deletions(-) create mode 100644 packages/create-gatsby/src/__tests__/init-starter.ts create mode 100644 packages/create-gatsby/src/utils.ts diff --git a/packages/create-gatsby/src/__tests__/init-starter.ts b/packages/create-gatsby/src/__tests__/init-starter.ts new file mode 100644 index 0000000000000..d2ed06a979a0a --- /dev/null +++ b/packages/create-gatsby/src/__tests__/init-starter.ts @@ -0,0 +1,162 @@ +import { execSync } from "child_process" +import execa from "execa" +import fs from "fs-extra" +import path from "path" +import { initStarter } from "../init-starter" +import { reporter } from "../reporter" + +jest.mock(`tiny-spin`, () => { + return { + spin: (): (() => void) => jest.fn(), + } +}) +jest.mock(`../utils`) +jest.mock(`execa`) +jest.mock(`child_process`) +jest.mock(`fs-extra`) +jest.mock(`path`) +jest.mock(`../reporter`) +jest.mock(`../get-config-store`, () => { + return { + getConfigStore: (): unknown => { + return { + items: {}, + set(key: string, value: unknown): void { + this.items[key] = value + }, + get(key: string): unknown { + return this.items[key] + }, + + __reset(): void { + this.items = {} + }, + } + }, + } +}) + +describe(`init-starter`, () => { + beforeEach(() => { + process.chdir = jest.fn() + }) + + afterEach(() => { + jest.resetAllMocks() + }) + + describe(`initStarter / cloning`, () => { + it(`reports an error when it s not possible to clone the repo`, async () => { + ;(path as any).join.mockImplementation(() => `/somewhere-here`) + ;(execa as any).mockImplementation(() => { + throw new Error(`Not possible to clone the repo`) + }) + + try { + await initStarter(`gatsby-starter-hello-world`, `./somewhere`, []) + } catch (e) { + expect(execa).toBeCalledWith(`git`, [ + `clone`, + `gatsby-starter-hello-world`, + `--recursive`, + `--depth=1`, + `--quiet`, + ]) + expect(reporter.panic).toBeCalledWith(`Not possible to clone the repo`) + expect(reporter.success).not.toBeCalledWith( + `Created site from template` + ) + expect(fs.remove).toBeCalledWith(`/somewhere-here`) + } + }) + + it(`reports a success when everything is going ok`, async () => { + ;(path as any).join.mockImplementation(() => `/somewhere-here`) + ;(execa as any).mockImplementation(() => Promise.resolve()) + ;(fs as any).readJSON.mockImplementation(() => { + return { name: `gatsby-project` } + }) + + await initStarter(`gatsby-starter-hello-world`, `./somewhere`, []) + + expect(execa).toBeCalledWith(`git`, [ + `clone`, + `gatsby-starter-hello-world`, + `--recursive`, + `--depth=1`, + `--quiet`, + ]) + expect(reporter.panic).not.toBeCalled() + expect(reporter.success).toBeCalledWith(`Created site from template`) + expect(fs.remove).toBeCalledWith(`/somewhere-here`) + }) + }) + + describe(`initStarter / install`, () => { + it(`process package installation with yarn`, async () => { + process.env.npm_config_user_agent = `yarn` + ;(path as any).join.mockImplementation(() => `/somewhere-here`) + ;(execa as any).mockImplementation(() => Promise.resolve()) + ;(fs as any).readJSON.mockImplementation(() => { + return { name: `gatsby-project` } + }) + + await initStarter(`gatsby-starter-hello-world`, `./somewhere`, []) + + expect(fs.remove).toBeCalledWith(`package-lock.json`) + expect(reporter.success).toBeCalledWith(`Installed plugins`) + expect(reporter.panic).not.toBeCalled() + expect(execa).toBeCalledWith(`yarnpkg`, [`--silent`], { + stderr: `inherit`, + }) + }) + + it(`process package installation with NPM`, async () => { + process.env.npm_config_user_agent = `npm` + ;(path as any).join.mockImplementation(() => `/somewhere-here`) + ;(execa as any).mockImplementation(() => Promise.resolve()) + ;(fs as any).readJSON.mockImplementation(() => { + return { name: `gatsby-project` } + }) + + await initStarter(`gatsby-starter-hello-world`, `./somewhere`, [ + `one-package`, + ]) + + expect(fs.remove).toBeCalledWith(`yarn.lock`) + expect(reporter.success).toBeCalledWith(`Installed Gatsby`) + expect(reporter.success).toBeCalledWith(`Installed plugins`) + expect(reporter.panic).not.toBeCalled() + expect(execa).toBeCalledWith( + `npm`, + [`install`, `--loglevel`, `error`, `--color`, `always`], + { stderr: `inherit` } + ) + expect(execa).toBeCalledWith( + `npm`, + [`install`, `--loglevel`, `error`, `--color`, `always`, `one-package`], + { stderr: `inherit` } + ) + }) + + it(`gently informs the user that yarn is not available when trying to use it`, async () => { + process.env.npm_config_user_agent = `yarn` + ;(execSync as any).mockImplementation(() => { + throw new Error(`Something wrong occured when trying to use yarn`) + }) + ;(path as any).join.mockImplementation(() => `/somewhere-here`) + ;(execa as any).mockImplementation(() => Promise.resolve()) + ;(fs as any).readJSON.mockImplementation(() => { + return { name: `gatsby-project` } + }) + + await initStarter(`gatsby-starter-hello-world`, `./somewhere`, [ + `one-package`, + ]) + + expect(reporter.info).toBeCalledWith( + `Woops! You have chosen "yarn" as your package manager, but it doesn't seem be installed on your machine. You can install it from https://yarnpkg.com/getting-started/install or change your preferred package manager with the command "gatsby options set pm npm". As a fallback, we will run the next steps with npm.` + ) + }) + }) +}) diff --git a/packages/create-gatsby/src/init-starter.ts b/packages/create-gatsby/src/init-starter.ts index fa9f4e6c76fdc..8e85d14eaa08a 100644 --- a/packages/create-gatsby/src/init-starter.ts +++ b/packages/create-gatsby/src/init-starter.ts @@ -7,6 +7,7 @@ import { spin } from "tiny-spin" import { getConfigStore } from "./get-config-store" type PackageManager = "yarn" | "npm" import c from "ansi-colors" +import { clearLine } from "./utils" const packageManagerConfigKey = `cli.packageManager` @@ -16,25 +17,25 @@ const kebabify = (str: string): string => .replace(/[^a-zA-Z]+/g, `-`) .toLowerCase() -export const getPackageManager = (): PackageManager => - getConfigStore().get(packageManagerConfigKey) +export const getPackageManager = ( + npmConfigUserAgent?: string +): PackageManager => { + const configStore = getConfigStore() + const actualPackageManager = configStore.get(packageManagerConfigKey) -export const setPackageManager = (packageManager: PackageManager): void => { - getConfigStore().set(packageManagerConfigKey, packageManager) -} + if (actualPackageManager) { + return actualPackageManager + } -const ESC = `\u001b` + if (npmConfigUserAgent?.includes(`yarn`)) { + configStore.set(packageManagerConfigKey, `yarn`) + return `yarn` + } + + configStore.set(packageManagerConfigKey, `npm`) + return `npm` +} -export const clearLine = (count = 1): Promise => - new Promise(resolve => { - // First move the cursor up one line... - process.stderr.moveCursor(0, -count, () => { - // ... then clear that line. This is the ANSI escape sequence for "clear whole line" - // List of escape sequences: http://ascii-table.com/ansi-escape-sequences.php - process.stderr.write(`${ESC}[2K`) - resolve() - }) - }) // Checks the existence of yarn package // We use yarnpkg instead of yarn to avoid conflict with Hadoop yarn // Refer to https://github.com/yarnpkg/yarn/issues/673 @@ -43,6 +44,9 @@ const checkForYarn = (): boolean => { execSync(`yarnpkg --version`, { stdio: `ignore` }) return true } catch (e) { + reporter.info( + `Woops! You have chosen "yarn" as your package manager, but it doesn't seem be installed on your machine. You can install it from https://yarnpkg.com/getting-started/install or change your preferred package manager with the command "gatsby options set pm npm". As a fallback, we will run the next steps with npm.` + ) return false } } @@ -117,36 +121,34 @@ const install = async ( const npmConfigUserAgent = process.env.npm_config_user_agent try { - if (!getPackageManager()) { - if (npmConfigUserAgent?.includes(`yarn`)) { - setPackageManager(`yarn`) - } else { - setPackageManager(`npm`) - } - } + const pm = getPackageManager(npmConfigUserAgent) + const options: Options = { stderr: `inherit`, } const config = [`--loglevel`, `error`, `--color`, `always`] - if (getPackageManager() === `yarn` && checkForYarn()) { - await fs.remove(`package-lock.json`) + if (pm === `yarn` && checkForYarn()) { const args = packages.length ? [`add`, `--silent`, ...packages] : [`--silent`] + + await fs.remove(`package-lock.json`) await execa(`yarnpkg`, args, options) } else { await fs.remove(`yarn.lock`) - await execa(`npm`, [`install`, ...config], options) await clearLine() + reporter.success(`Installed Gatsby`) reporter.info(`${c.blueBright(c.symbols.pointer)} Installing plugins...`) + await execa(`npm`, [`install`, ...config, ...packages], options) await clearLine() - reporter.success(`Installed plugins`) } + + reporter.success(`Installed plugins`) } catch (e) { reporter.panic(e.message) } finally { @@ -161,9 +163,7 @@ const clone = async ( branch?: string ): Promise => { const branchProps = branch ? [`-b`, branch] : [] - const stop = spin(`Cloning site template`) - const args = [ `clone`, ...branchProps, @@ -176,11 +176,13 @@ const clone = async ( try { await execa(`git`, args) + + reporter.success(`Created site from template`) } catch (err) { reporter.panic(err.message) } + stop() - reporter.success(`Created site from template`) await fs.remove(path.join(rootPath, `.git`)) } diff --git a/packages/create-gatsby/src/utils.ts b/packages/create-gatsby/src/utils.ts new file mode 100644 index 0000000000000..77ea4dc353e77 --- /dev/null +++ b/packages/create-gatsby/src/utils.ts @@ -0,0 +1,12 @@ +const ESC = `\u001b` + +export const clearLine = (count = 1): Promise => + new Promise(resolve => { + // First move the cursor up one line... + process.stderr.moveCursor(0, -count, () => { + // ... then clear that line. This is the ANSI escape sequence for "clear whole line" + // List of escape sequences: http://ascii-table.com/ansi-escape-sequences.php + process.stderr.write(`${ESC}[2K`) + resolve() + }) + }) From 7577e3ffc1c3ac31554311014b0fa0dd8b78ebb9 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 06:57:32 -0800 Subject: [PATCH 026/144] feature(gatsby): let users skip out of dev SSR (#28396) * feature(gatsby): let users skip out of dev SSR * update snapshot * update snapshot * Add link on ssr error page to the docs * copy fix * update snapshot Co-authored-by: Michal Piechowiak --- .../ssr/__tests__/__snapshots__/ssr.js.snap | 20 ++++++++++++++- .../__snapshots__/develop-html-route.ts.snap | 2 +- .../src/utils/dev-ssr/develop-html-route.ts | 25 +++++++++++++++++++ .../utils/dev-ssr/render-dev-html-child.js | 2 +- .../src/utils/dev-ssr/render-dev-html.ts | 6 +++++ 5 files changed, 52 insertions(+), 3 deletions(-) diff --git a/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap b/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap index 5a4ebf200881f..5ffedbfcb2be6 100644 --- a/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap +++ b/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap @@ -16,5 +16,23 @@ exports[`SSR it generates an error page correctly 1`] = ` | ^ 5 | 6 | return <div>hi</div> - 7 | }" + 7 | } +

For help debugging SSR errors, see this docs page: https://www.gatsbyjs.com/docs/debugging-html-builds/

+

Skip SSR

+

If you don't wish to fix the SSR error at the moment, press the + button below to reload the page without attempting SSR

+

Note: this error will show up in when you build your site so must be fixed before then.

+

Caveat: SSR errors in module scope i.e. outside of your components can't be skipped so will need fixed before you can continue

+ + + " `; diff --git a/packages/gatsby/src/utils/__tests__/__snapshots__/develop-html-route.ts.snap b/packages/gatsby/src/utils/__tests__/__snapshots__/develop-html-route.ts.snap index 4ac4ef6be38cb..1c86bd2249c71 100644 --- a/packages/gatsby/src/utils/__tests__/__snapshots__/develop-html-route.ts.snap +++ b/packages/gatsby/src/utils/__tests__/__snapshots__/develop-html-route.ts.snap @@ -9,7 +9,7 @@ Object { 17 | let tags 18 | let tagsSection 19 | if (this.props.data.markdownRemark.fields.tagSlugs) {", - "filename": "develop-html-route.ts", + "filename": "fixtures/blog-post.js", "line": 16, "message": "window is not defined", "row": 17, diff --git a/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts b/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts index a230a968bd286..28803398e77ef 100644 --- a/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts +++ b/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts @@ -22,6 +22,7 @@ export const route = ({ app, program, store }): any => const renderResponse = await renderDevHTML({ path: pathObj.path, page: pathObj, + skipSsr: req.query[`skip-ssr`] || false, store, htmlComponentRendererPath: `${program.directory}/public/render-page.js`, directory: program.directory, @@ -62,6 +63,30 @@ export const route = ({ app, program, store }): any => if (error.codeFrame) { errorHtml += `
${error.codeFrame}
` } + + // Add link to help page + errorHtml += ` +

For help debugging SSR errors, see this docs page: https://www.gatsbyjs.com/docs/debugging-html-builds/

` + + // Add skip ssr button + errorHtml += ` +

Skip SSR

+

If you don't wish to fix the SSR error at the moment, press the + button below to reload the page without attempting SSR

+

Note: this error will show up in when you build your site so must be fixed before then.

+

Caveat: SSR errors in module scope i.e. outside of your components can't be skipped so will need fixed before you can continue

+ + + ` res.status(500).send(errorHtml) } diff --git a/packages/gatsby/src/utils/dev-ssr/render-dev-html-child.js b/packages/gatsby/src/utils/dev-ssr/render-dev-html-child.js index 1f7ac76a47dfb..d9ac2c7c516e9 100644 --- a/packages/gatsby/src/utils/dev-ssr/render-dev-html-child.js +++ b/packages/gatsby/src/utils/dev-ssr/render-dev-html-child.js @@ -69,7 +69,7 @@ const parseError = function ({ err, directory, componentPath }) { const type = err.type ? err.type : err.name const data = { - filename: sysPath.relative(directory, componentPath), + filename: sysPath.relative(directory, filename), message: message, type: type, stack: stack, diff --git a/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts b/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts index f3e811a00562e..7424625285164 100644 --- a/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts +++ b/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts @@ -110,6 +110,7 @@ const ensurePathComponentInSSRBundle = async ( export const renderDevHTML = ({ path, page, + skipSsr = false, store, htmlComponentRendererPath, directory, @@ -156,6 +157,11 @@ export const renderDevHTML = ({ isClientOnlyPage = true } + // If the user added the query string `skip-ssr`, we always just render an empty shell. + if (skipSsr) { + isClientOnlyPage = true + } + try { const htmlString = await worker.renderHTML({ path, From 2b62f389457f515daf843ab22f95c015aa643ffe Mon Sep 17 00:00:00 2001 From: LB Date: Tue, 1 Dec 2020 11:44:15 -0500 Subject: [PATCH 027/144] fix(gatsby-plugin-image): Add overflow hidden back to wrapper CSS (#28410) * Add overflow hidden back to wrapper CSS * update tests * Update packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx * Update packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx --- .../__tests__/gatsby-image.server.tsx | 21 +++++++++++++------ .../src/components/hooks.ts | 1 + 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx b/packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx index 1bc2e7fe84c0d..0b564c46fded3 100644 --- a/packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx +++ b/packages/gatsby-plugin-image/src/components/__tests__/gatsby-image.server.tsx @@ -62,12 +62,15 @@ describe(`GatsbyImage server`, () => { expect((wrapper as HTMLElement).style).toMatchInlineSnapshot(` CSSStyleDeclaration { "0": "position", + "1": "overflow", "_importants": Object { + "overflow": undefined, "position": undefined, }, - "_length": 1, + "_length": 2, "_onChange": [Function], "_values": Object { + "overflow": "hidden", "position": "relative", }, } @@ -95,17 +98,20 @@ describe(`GatsbyImage server`, () => { expect((wrapper as HTMLElement).style).toMatchInlineSnapshot(` CSSStyleDeclaration { "0": "position", - "1": "width", - "2": "height", + "1": "overflow", + "2": "width", + "3": "height", "_importants": Object { "height": undefined, + "overflow": undefined, "position": undefined, "width": undefined, }, - "_length": 3, + "_length": 4, "_onChange": [Function], "_values": Object { "height": "100px", + "overflow": "hidden", "position": "relative", "width": "100px", }, @@ -134,15 +140,18 @@ describe(`GatsbyImage server`, () => { expect((wrapper as HTMLElement).style).toMatchInlineSnapshot(` CSSStyleDeclaration { "0": "position", - "1": "display", + "1": "overflow", + "2": "display", "_importants": Object { "display": undefined, + "overflow": undefined, "position": undefined, }, - "_length": 2, + "_length": 3, "_onChange": [Function], "_values": Object { "display": "inline-block", + "overflow": "hidden", "position": "relative", }, } diff --git a/packages/gatsby-plugin-image/src/components/hooks.ts b/packages/gatsby-plugin-image/src/components/hooks.ts index 19895626c39c3..09aa5767ac09c 100644 --- a/packages/gatsby-plugin-image/src/components/hooks.ts +++ b/packages/gatsby-plugin-image/src/components/hooks.ts @@ -52,6 +52,7 @@ export function getWrapperProps( } { const wrapperStyle: CSSProperties = { position: `relative`, + overflow: `hidden`, } if (layout === `fixed`) { From f5cc9559fd26dbda8fb65c48426d6e3a7be378e5 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 09:10:55 -0800 Subject: [PATCH 028/144] chore(gatsby): add StaticQuery to SSR test (#28187) * chore(gatsby): add StaticQuery to SSR test * Fail if status isn't 200 * Add env flag to the develop command too Co-authored-by: gatsbybot --- integration-tests/ssr/package.json | 2 +- integration-tests/ssr/src/pages/hi.js | 32 ++++++++++++++++++--------- integration-tests/ssr/test-output.js | 12 +++++++--- 3 files changed, 31 insertions(+), 15 deletions(-) diff --git a/integration-tests/ssr/package.json b/integration-tests/ssr/package.json index a25e6caace20a..f0b0b554ac26b 100644 --- a/integration-tests/ssr/package.json +++ b/integration-tests/ssr/package.json @@ -29,7 +29,7 @@ "scripts": { "build": "gatsby build", "clean": "gatsby clean", - "develop": "gatsby develop", + "develop": "cross-env GATSBY_EXPERIMENTAL_DEV_SSR=true gatsby develop", "serve": "gatsby serve", "start-dev-server": "start-server-and-test develop http://localhost:8000 test:jest", "test": "cross-env GATSBY_EXPERIMENTAL_DEV_SSR=true npm-run-all -s build start-dev-server", diff --git a/integration-tests/ssr/src/pages/hi.js b/integration-tests/ssr/src/pages/hi.js index 20466045525dd..eaf03024a6f3b 100644 --- a/integration-tests/ssr/src/pages/hi.js +++ b/integration-tests/ssr/src/pages/hi.js @@ -1,15 +1,25 @@ import React from "react" -import { useStaticQuery, graphql } from "gatsby" +import { StaticQuery, graphql } from "gatsby" export default function Inline() { - const { site } = useStaticQuery(graphql` - { - site { - siteMetadata { - title - } - } - } - `) - return
hi1 {site.siteMetadata.title}
+ return ( +
+ ( +
+

{data.site.siteMetadata.title}

+
+ )} + /> +
+ ) } diff --git a/integration-tests/ssr/test-output.js b/integration-tests/ssr/test-output.js index cf2d1731c387a..884cae205fd68 100644 --- a/integration-tests/ssr/test-output.js +++ b/integration-tests/ssr/test-output.js @@ -42,9 +42,15 @@ ) ) - const rawDevHtml = await fetch(`${devSiteBasePath}/${path}`).then(res => - res.text() - ) + let devStatus = 200 + const rawDevHtml = await fetch(`${devSiteBasePath}/${path}`).then(res => { + devStatus = res.status + return res.text() + }) + + if (devStatus !== 200) { + return false + } const devHtml = format(filterHtml(rawDevHtml)) const diffResult = diff(devHtml, builtHtml, { From 4fb1f62183bdd0bc676e4357c3218ae919e491fa Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 09:30:13 -0800 Subject: [PATCH 029/144] feature(gatsby): Add experiment to run source plugins in parallel (#28214) * feature(gatsby): Add experiment to run source plugins in parallel * Add concurrency limit (20) * remove debugging code * Add flag support * Update packages/gatsby/src/utils/api-runner-node.js Co-authored-by: Vladimir Razuvaev Co-authored-by: Vladimir Razuvaev --- packages/gatsby/src/utils/api-runner-node.js | 159 +++++++++++-------- packages/gatsby/src/utils/flags.ts | 9 ++ 2 files changed, 98 insertions(+), 70 deletions(-) diff --git a/packages/gatsby/src/utils/api-runner-node.js b/packages/gatsby/src/utils/api-runner-node.js index b6629568973d4..3b8ec03a308f1 100644 --- a/packages/gatsby/src/utils/api-runner-node.js +++ b/packages/gatsby/src/utils/api-runner-node.js @@ -558,90 +558,109 @@ module.exports = async (api, args = {}, { pluginSource, activity } = {}) => } } - Promise.mapSeries(implementingPlugins, plugin => { - if (stopQueuedApiRuns) { - return null - } + let apiRunPromiseOptions = {} + let runPromise + if ( + api === `sourceNodes` && + process.env.GATSBY_EXPERIMENTAL_PARALLEL_SOURCING + ) { + runPromise = Promise.map + apiRunPromiseOptions.concurrency = 20 + } else { + runPromise = Promise.mapSeries + apiRunPromiseOptions = undefined + } - let gatsbyNode = pluginNodeCache.get(plugin.name) - if (!gatsbyNode) { - gatsbyNode = require(`${plugin.resolve}/gatsby-node`) - pluginNodeCache.set(plugin.name, gatsbyNode) - } + runPromise( + implementingPlugins, + plugin => { + if (stopQueuedApiRuns) { + return null + } - const pluginName = - plugin.name === `default-site-plugin` ? `gatsby-node.js` : plugin.name - - // TODO: rethink createNode API to handle this better - if ( - api === `onCreateNode` && - gatsbyNode?.unstable_shouldOnCreateNode && // Don't bail if this api is not exported - !gatsbyNode.unstable_shouldOnCreateNode( - { node: args.node }, - plugin.pluginOptions - ) - ) { - // Do not try to schedule an async event for this node for this plugin - return null - } + let gatsbyNode = pluginNodeCache.get(plugin.name) + if (!gatsbyNode) { + gatsbyNode = require(`${plugin.resolve}/gatsby-node`) + pluginNodeCache.set(plugin.name, gatsbyNode) + } - return new Promise(resolve => { - resolve(runAPI(plugin, api, { ...args, parentSpan: apiSpan }, activity)) - }).catch(err => { - decorateEvent(`BUILD_PANIC`, { - pluginName: `${plugin.name}@${plugin.version}`, - }) + const pluginName = + plugin.name === `default-site-plugin` ? `gatsby-node.js` : plugin.name + + // TODO: rethink createNode API to handle this better + if ( + api === `onCreateNode` && + gatsbyNode?.unstable_shouldOnCreateNode && // Don't bail if this api is not exported + !gatsbyNode.unstable_shouldOnCreateNode( + { node: args.node }, + plugin.pluginOptions + ) + ) { + // Do not try to schedule an async event for this node for this plugin + return null + } + + return new Promise(resolve => { + resolve( + runAPI(plugin, api, { ...args, parentSpan: apiSpan }, activity) + ) + }).catch(err => { + decorateEvent(`BUILD_PANIC`, { + pluginName: `${plugin.name}@${plugin.version}`, + }) - const localReporter = getLocalReporter({ activity, reporter }) + const localReporter = getLocalReporter({ activity, reporter }) - const file = stackTrace - .parse(err) - .find(file => /gatsby-node/.test(file.fileName)) + const file = stackTrace + .parse(err) + .find(file => /gatsby-node/.test(file.fileName)) - let codeFrame = `` - const structuredError = errorParser({ err }) + let codeFrame = `` + const structuredError = errorParser({ err }) - if (file) { - const { fileName, lineNumber: line, columnNumber: column } = file + if (file) { + const { fileName, lineNumber: line, columnNumber: column } = file - try { - const code = fs.readFileSync(fileName, { encoding: `utf-8` }) - codeFrame = codeFrameColumns( - code, - { - start: { - line, - column, + try { + const code = fs.readFileSync(fileName, { encoding: `utf-8` }) + codeFrame = codeFrameColumns( + code, + { + start: { + line, + column, + }, }, - }, - { - highlightCode: true, - } - ) - } catch (_e) { - // sometimes stack trace point to not existing file - // particularly when file is transpiled and path actually changes - // (like pointing to not existing `src` dir or original typescript file) - } + { + highlightCode: true, + } + ) + } catch (_e) { + // sometimes stack trace point to not existing file + // particularly when file is transpiled and path actually changes + // (like pointing to not existing `src` dir or original typescript file) + } - structuredError.location = { - start: { line: line, column: column }, + structuredError.location = { + start: { line: line, column: column }, + } + structuredError.filePath = fileName } - structuredError.filePath = fileName - } - structuredError.context = { - ...structuredError.context, - pluginName, - api, - codeFrame, - } + structuredError.context = { + ...structuredError.context, + pluginName, + api, + codeFrame, + } - localReporter.panicOnBuild(structuredError) + localReporter.panicOnBuild(structuredError) - return null - }) - }).then(results => { + return null + }) + }, + apiRunPromiseOptions + ).then(results => { if (onAPIRunComplete) { onAPIRunComplete() } diff --git a/packages/gatsby/src/utils/flags.ts b/packages/gatsby/src/utils/flags.ts index 385ac6b8a3d18..4a089c8916ec2 100644 --- a/packages/gatsby/src/utils/flags.ts +++ b/packages/gatsby/src/utils/flags.ts @@ -60,6 +60,15 @@ const activeFlags: Array = [ description: `Don't process images during development until they're requested from the browser. Speeds starting the develop server.`, umbrellaIssue: `https://github.com/gatsbyjs/gatsby/discussions/27603`, }, + { + name: `PARALLEL_SOURCING`, + env: `GATSBY_EXPERIMENTAL_PARALLEL_SOURCING`, + command: `all`, + telemetryId: `ParallelSourcing`, + experimental: true, + description: `Run all source plugins at the same time instead of serially. For sites with multiple source plugins, this can speedup sourcing and transforming considerably.`, + umbrellaIssue: `https://github.com/gatsbyjs/gatsby/discussions/28336`, + }, ] export default activeFlags From ce090e5e058ff4927e51aaadba1a834f9f5c4e9f Mon Sep 17 00:00:00 2001 From: Lennart Date: Tue, 1 Dec 2020 19:36:42 +0100 Subject: [PATCH 030/144] fix(gatsby): Add `FAST_REFRESH` config flag (#28409) * add FAST_REFRESH flag * update desc * handle case when FAST_REFRESH flag is set and GATSBY_HOT_LOADER env var is set to something else than fast-refresh Co-authored-by: Michal Piechowiak --- packages/gatsby/cache-dir/app.js | 6 ++++++ packages/gatsby/src/services/initialize.ts | 21 +++++++++++++++++-- packages/gatsby/src/utils/flags.ts | 9 ++++++++ .../utils/get-react-hot-loader-strategy.ts | 5 ++++- 4 files changed, 38 insertions(+), 3 deletions(-) diff --git a/packages/gatsby/cache-dir/app.js b/packages/gatsby/cache-dir/app.js index de028d5758fff..16e1d35ba2b94 100644 --- a/packages/gatsby/cache-dir/app.js +++ b/packages/gatsby/cache-dir/app.js @@ -12,6 +12,12 @@ import syncRequires from "$virtual/sync-requires" // Generated during bootstrap import matchPaths from "$virtual/match-paths.json" +if (process.env.GATSBY_HOT_LOADER === `fast-refresh` && module.hot) { + module.hot.accept(`$virtual/sync-requires`, () => { + // Manually reload + }) +} + window.___emitter = emitter const loader = new DevLoader(syncRequires, matchPaths) diff --git a/packages/gatsby/src/services/initialize.ts b/packages/gatsby/src/services/initialize.ts index c21d66271b4e6..21ad88953c662 100644 --- a/packages/gatsby/src/services/initialize.ts +++ b/packages/gatsby/src/services/initialize.ts @@ -105,8 +105,6 @@ export async function initialize({ reporter.panic(`Missing program args`) } - process.env.GATSBY_HOT_LOADER = getReactHotLoaderStrategy() - /* Time for a little story... * When running `gatsby develop`, the globally installed gatsby-cli starts * and sets up a Redux store (which is where logs are now stored). When gatsby @@ -184,6 +182,23 @@ export async function initialize({ // Setup flags if (config && config.flags) { + // TODO: this should be handled in FAST_REFRESH configuration and not be one-off here. + if ( + config.flags.FAST_REFRESH && + process.env.GATSBY_HOT_LOADER && + process.env.GATSBY_HOT_LOADER !== `fast-refresh` + ) { + delete config.flags.FAST_REFRESH + reporter.warn( + reporter.stripIndent(` + Both FAST_REFRESH gatsby-config flag and GATSBY_HOT_LOADER environment variable is used with conflicting setting ("${process.env.GATSBY_HOT_LOADER}"). + + Will use react-hot-loader. + + To use Fast Refresh either do not use GATSBY_HOT_LOADER environment variable or set it to "fast-refresh". + `) + ) + } const availableFlags = require(`../utils/flags`).default // Get flags const { enabledConfigFlags, unknownFlagMessage, message } = handleFlags( @@ -216,6 +231,8 @@ export async function initialize({ } } + process.env.GATSBY_HOT_LOADER = getReactHotLoaderStrategy() + // theme gatsby configs can be functions or objects if (config && config.__experimentalThemes) { reporter.warn( diff --git a/packages/gatsby/src/utils/flags.ts b/packages/gatsby/src/utils/flags.ts index 4a089c8916ec2..af2bf1e866664 100644 --- a/packages/gatsby/src/utils/flags.ts +++ b/packages/gatsby/src/utils/flags.ts @@ -60,6 +60,15 @@ const activeFlags: Array = [ description: `Don't process images during development until they're requested from the browser. Speeds starting the develop server.`, umbrellaIssue: `https://github.com/gatsbyjs/gatsby/discussions/27603`, }, + { + name: `FAST_REFRESH`, + env: `GATSBY_FAST_REFRESH`, + command: `develop`, + telemetryId: `FastRefresh`, + experimental: false, + description: `Use React Fast Refresh instead of the legacy react-hot-loader for instantaneous feedback in your development server. Recommended for versions of React >= 17.0.`, + umbrellaIssue: `https://github.com/gatsbyjs/gatsby/discussions/28390`, + }, { name: `PARALLEL_SOURCING`, env: `GATSBY_EXPERIMENTAL_PARALLEL_SOURCING`, diff --git a/packages/gatsby/src/utils/get-react-hot-loader-strategy.ts b/packages/gatsby/src/utils/get-react-hot-loader-strategy.ts index 58d2ce6c2ebfe..7c713b1b990d6 100644 --- a/packages/gatsby/src/utils/get-react-hot-loader-strategy.ts +++ b/packages/gatsby/src/utils/get-react-hot-loader-strategy.ts @@ -7,10 +7,13 @@ export function getReactHotLoaderStrategy(): string { // If the user has defined this, we don't want to do any package sniffing if (process.env.GATSBY_HOT_LOADER) return process.env.GATSBY_HOT_LOADER + // If the config flag is true, return fast-refresh + if (process.env.GATSBY_FAST_REFRESH) return `fast-refresh` + // Do some package sniffing to see if we can use fast-refresh if the user didn't // specify a specific hot loader with the environment variable. - // TODO: Decide if we wanna do this + // TODO: Probably use the flags for this /* try { const reactVersion = require(`react/package.json`).version From 3ccaec855b376b267c02009f51772c237620088d Mon Sep 17 00:00:00 2001 From: Will Mayger Date: Tue, 1 Dec 2020 19:04:50 +0000 Subject: [PATCH 031/144] fix(gatsby): re-render route when location state changes (#28346) * creating e2e tests to catch issue * comparing location and state * update test message * using optional chaining --- .../cypress/integration/navigation/linking.js | 32 ++++++++++++++++--- .../src/pages/navigation-effects.js | 19 ++++++++++- packages/gatsby/cache-dir/navigation.js | 17 ++++++++-- 3 files changed, 60 insertions(+), 8 deletions(-) diff --git a/e2e-tests/development-runtime/cypress/integration/navigation/linking.js b/e2e-tests/development-runtime/cypress/integration/navigation/linking.js index 587f015b99cfd..8225ecf39104e 100644 --- a/e2e-tests/development-runtime/cypress/integration/navigation/linking.js +++ b/e2e-tests/development-runtime/cypress/integration/navigation/linking.js @@ -150,16 +150,31 @@ describe(`navigation`, () => { }) it(`should trigger an effect after a search param has changed`, () => { - cy.findByTestId(`effect-message`).should(`have.text`, `Waiting for effect`) + cy.findByTestId(`effect-message`).should( + `have.text`, + `Waiting for effect` + ) cy.findByTestId(`send-search-message`).click().waitForRouteChange() - cy.findByTestId(`effect-message`).should(`have.text`, `?message=searchParam`) + cy.findByTestId(`effect-message`).should( + `have.text`, + `?message=searchParam` + ) }) it(`should trigger an effect after the hash has changed`, () => { - cy.findByTestId(`effect-message`).should(`have.text`, `Waiting for effect`) + cy.findByTestId(`effect-message`).should( + `have.text`, + `Waiting for effect` + ) cy.findByTestId(`send-hash-message`).click().waitForRouteChange() cy.findByTestId(`effect-message`).should(`have.text`, `#message-hash`) }) + + it(`should trigger an effect after the state has changed`, () => { + cy.findByTestId(`effect-message`).should(`have.text`, ``) + cy.findByTestId(`send-state-message`).click().waitForRouteChange() + cy.findByTestId(`effect-message`).should(`have.text`, `this is a message using the state`) + }) }) } @@ -173,7 +188,10 @@ describe(`navigation`, () => { it(`should trigger an effect after a search param has changed`, () => { cy.findByTestId(`effect-message`).should(`have.text`, ``) cy.findByTestId(`send-search-message`).click().waitForRouteChange() - cy.findByTestId(`effect-message`).should(`have.text`, `?message=searchParam`) + cy.findByTestId(`effect-message`).should( + `have.text`, + `?message=searchParam` + ) }) it(`should trigger an effect after the hash has changed`, () => { @@ -181,6 +199,12 @@ describe(`navigation`, () => { cy.findByTestId(`send-hash-message`).click().waitForRouteChange() cy.findByTestId(`effect-message`).should(`have.text`, `#message-hash`) }) + + it(`should trigger an effect after the state has changed`, () => { + cy.findByTestId(`effect-message`).should(`have.text`, ``) + cy.findByTestId(`send-state-message`).click().waitForRouteChange() + cy.findByTestId(`effect-message`).should(`have.text`, `this is a message using the state`) + }) }) } diff --git a/e2e-tests/development-runtime/src/pages/navigation-effects.js b/e2e-tests/development-runtime/src/pages/navigation-effects.js index f3c041d5c90ea..e9ad800964198 100644 --- a/e2e-tests/development-runtime/src/pages/navigation-effects.js +++ b/e2e-tests/development-runtime/src/pages/navigation-effects.js @@ -8,6 +8,7 @@ export default function NavigationEffects({ location }) { const searchParam = location.search const searchHash = location.hash + const searchState = location?.state?.message useEffect(() => { setMessage(searchParam) @@ -17,7 +18,12 @@ export default function NavigationEffects({ location }) { setMessage(searchHash) }, [searchHash]) - const handleClick = next => navigate(`${next}`, { replace: true }) + useEffect(() => { + setMessage(searchState) + }, [searchState]) + + const handleClick = (next, options = { replace: true }) => + navigate(`${next}`, options) return ( @@ -35,6 +41,17 @@ export default function NavigationEffects({ location }) { > Send Hash + + ) } diff --git a/packages/gatsby/cache-dir/navigation.js b/packages/gatsby/cache-dir/navigation.js index 3521b1359eef2..43d252a102d0f 100644 --- a/packages/gatsby/cache-dir/navigation.js +++ b/packages/gatsby/cache-dir/navigation.js @@ -195,6 +195,18 @@ class RouteAnnouncer extends React.Component { } } +const compareLocationProps = (prevLocation, nextLocation) => { + if (prevLocation.href !== nextLocation.href) { + return true + } + + if (prevLocation?.state?.key !== nextLocation?.state?.key) { + return true + } + + return false +} + // Fire on(Pre)RouteUpdate APIs class RouteUpdates extends React.Component { constructor(props) { @@ -207,16 +219,15 @@ class RouteUpdates extends React.Component { } shouldComponentUpdate(prevProps) { - if (this.props.location.href !== prevProps.location.href) { + if (compareLocationProps(prevProps.location, this.props.location)) { onPreRouteUpdate(this.props.location, prevProps.location) return true } - return false } componentDidUpdate(prevProps) { - if (this.props.location.href !== prevProps.location.href) { + if (compareLocationProps(prevProps.location, this.props.location)) { onRouteUpdate(this.props.location, prevProps.location) } } From 4e50d5c8008e1608138b2cecabd00b014bc90bf9 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Wed, 2 Dec 2020 02:07:21 +0700 Subject: [PATCH 032/144] fix(gatsby): correct tracing for GraphQL queries (#28415) --- packages/gatsby/src/query/graphql-runner.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gatsby/src/query/graphql-runner.ts b/packages/gatsby/src/query/graphql-runner.ts index 17feee7bb10d8..27ac60e0d7af7 100644 --- a/packages/gatsby/src/query/graphql-runner.ts +++ b/packages/gatsby/src/query/graphql-runner.ts @@ -184,7 +184,7 @@ export class GraphQLRunner { try { // `execute` will return a promise - return execute({ + return await execute({ schema, document, rootValue: context, From 43b2f1071b1e465919d1f3a3a5caec36ac909d44 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 12:10:20 -0800 Subject: [PATCH 033/144] fix(gatsby-recipes): add isLocal to schema for GatsbyPlugin (#28417) --- packages/gatsby-recipes/src/providers/gatsby/plugin.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/gatsby-recipes/src/providers/gatsby/plugin.js b/packages/gatsby-recipes/src/providers/gatsby/plugin.js index 555faeec67545..68b0f68a67bc7 100644 --- a/packages/gatsby-recipes/src/providers/gatsby/plugin.js +++ b/packages/gatsby-recipes/src/providers/gatsby/plugin.js @@ -524,6 +524,7 @@ const schema = { name: Joi.string(), description: Joi.string().optional().allow(null).allow(``), options: Joi.object(), + isLocal: Joi.boolean(), readme: Joi.string().optional().allow(null).allow(``), shadowableFiles: Joi.array().items(Joi.string()), shadowedFiles: Joi.array().items(Joi.string()), From 4a7a324553669a72445a427ed8cc30e812f38bd1 Mon Sep 17 00:00:00 2001 From: vrabe Date: Wed, 2 Dec 2020 04:46:02 +0800 Subject: [PATCH 034/144] fix(gatsby): scroll restoration issue in browser API (#27384) * fix scroll restoration issue * keep the behavior same * fix the lint error --- packages/gatsby/cache-dir/navigation.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/gatsby/cache-dir/navigation.js b/packages/gatsby/cache-dir/navigation.js index 43d252a102d0f..095ed635d2311 100644 --- a/packages/gatsby/cache-dir/navigation.js +++ b/packages/gatsby/cache-dir/navigation.js @@ -128,7 +128,10 @@ function shouldUpdateScroll(prevRouterProps, { location }) { // `pathname` for backwards compatibility pathname, routerProps: { location }, - getSavedScrollPosition: args => this._stateStorage.read(args), + getSavedScrollPosition: args => [ + 0, + this._stateStorage.read(args, args.key), + ], }) if (results.length > 0) { // Use the latest registered shouldUpdateScroll result, this allows users to override plugin's configuration From 43e4050db8d0eae5f4b4cb50b58aad85bf45a790 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Wed, 2 Dec 2020 04:46:04 +0700 Subject: [PATCH 035/144] chore(release): Publish next - create-gatsby@0.2.0-next.1 - gatsby-admin@0.5.0-next.1 - gatsby-cli@2.16.0-next.1 - gatsby-plugin-image@0.4.0-next.1 - gatsby-plugin-manifest@2.9.0-next.1 - gatsby-plugin-react-helmet@3.7.0-next.1 - gatsby-plugin-sharp@2.11.0-next.1 - gatsby-recipes@0.6.0-next.1 - gatsby-source-contentful@4.3.0-next.1 - gatsby-source-shopify@3.7.0-next.1 - gatsby-transformer-sqip@2.8.0-next.1 - gatsby@2.29.0-next.1 --- packages/create-gatsby/CHANGELOG.md | 10 ++++++++++ packages/create-gatsby/package.json | 2 +- packages/gatsby-admin/CHANGELOG.md | 4 ++++ packages/gatsby-admin/package.json | 4 ++-- packages/gatsby-cli/CHANGELOG.md | 4 ++++ packages/gatsby-cli/package.json | 6 +++--- packages/gatsby-plugin-image/CHANGELOG.md | 8 ++++++++ packages/gatsby-plugin-image/package.json | 2 +- packages/gatsby-plugin-manifest/CHANGELOG.md | 4 ++++ packages/gatsby-plugin-manifest/package.json | 2 +- .../gatsby-plugin-react-helmet/CHANGELOG.md | 4 ++++ .../gatsby-plugin-react-helmet/package.json | 2 +- packages/gatsby-plugin-sharp/CHANGELOG.md | 6 ++++++ packages/gatsby-plugin-sharp/package.json | 4 ++-- packages/gatsby-recipes/CHANGELOG.md | 6 ++++++ packages/gatsby-recipes/package.json | 2 +- packages/gatsby-source-contentful/CHANGELOG.md | 6 ++++++ packages/gatsby-source-contentful/package.json | 2 +- packages/gatsby-source-shopify/CHANGELOG.md | 6 ++++++ packages/gatsby-source-shopify/package.json | 2 +- packages/gatsby-transformer-sqip/CHANGELOG.md | 4 ++++ packages/gatsby-transformer-sqip/package.json | 4 ++-- packages/gatsby/CHANGELOG.md | 18 ++++++++++++++++++ packages/gatsby/package.json | 4 ++-- 24 files changed, 98 insertions(+), 18 deletions(-) diff --git a/packages/create-gatsby/CHANGELOG.md b/packages/create-gatsby/CHANGELOG.md index 0225525274680..c508f32f759c7 100644 --- a/packages/create-gatsby/CHANGELOG.md +++ b/packages/create-gatsby/CHANGELOG.md @@ -3,6 +3,16 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.2.0-next.1](https://github.com/gatsbyjs/gatsby/compare/create-gatsby@0.2.0-next.0...create-gatsby@0.2.0-next.1) (2020-12-01) + +### Bug Fixes + +- **create-gatsby:** Improve install ([#28318](https://github.com/gatsbyjs/gatsby/issues/28318)) ([4fbded2](https://github.com/gatsbyjs/gatsby/commit/4fbded2e336fd97548bf3df23d764f3a500fe5ec)) + +### Features + +- **create-gatsby:** Add name to site metadata ([#28324](https://github.com/gatsbyjs/gatsby/issues/28324)) ([064a16f](https://github.com/gatsbyjs/gatsby/commit/064a16f5f6049edea3d49a3787b5ef2346b7b89b)) + # [0.2.0-next.0](https://github.com/gatsbyjs/gatsby/compare/create-gatsby@0.1.0-next.2...create-gatsby@0.2.0-next.0) (2020-11-26) ### Bug Fixes diff --git a/packages/create-gatsby/package.json b/packages/create-gatsby/package.json index ec941b372cecf..4dbb147acda99 100644 --- a/packages/create-gatsby/package.json +++ b/packages/create-gatsby/package.json @@ -1,6 +1,6 @@ { "name": "create-gatsby", - "version": "0.2.0-next.0", + "version": "0.2.0-next.1", "main": "lib/index.js", "bin": "cli.js", "license": "MIT", diff --git a/packages/gatsby-admin/CHANGELOG.md b/packages/gatsby-admin/CHANGELOG.md index dbd5f829e3beb..59eebb6e65ab1 100644 --- a/packages/gatsby-admin/CHANGELOG.md +++ b/packages/gatsby-admin/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.5.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-admin@0.5.0-next.0...gatsby-admin@0.5.0-next.1) (2020-12-01) + +**Note:** Version bump only for package gatsby-admin + # [0.5.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-admin@0.4.0-next.2...gatsby-admin@0.5.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-admin diff --git a/packages/gatsby-admin/package.json b/packages/gatsby-admin/package.json index 65d8fbd6a34e7..b84add9749f3a 100644 --- a/packages/gatsby-admin/package.json +++ b/packages/gatsby-admin/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-admin", - "version": "0.5.0-next.0", + "version": "0.5.0-next.1", "main": "index.js", "author": "Max Stoiber", "license": "MIT", @@ -20,7 +20,7 @@ "@typescript-eslint/parser": "^2.34.0", "csstype": "^2.6.13", "formik": "^2.2.5", - "gatsby": "^2.29.0-next.0", + "gatsby": "^2.29.0-next.1", "gatsby-interface": "^0.0.225", "gatsby-plugin-typescript": "^2.9.0-next.0", "gatsby-plugin-webfonts": "^1.1.3", diff --git a/packages/gatsby-cli/CHANGELOG.md b/packages/gatsby-cli/CHANGELOG.md index d8b05d5a8c7ac..9b4f2185f82e9 100644 --- a/packages/gatsby-cli/CHANGELOG.md +++ b/packages/gatsby-cli/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.16.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-cli@2.16.0-next.0...gatsby-cli@2.16.0-next.1) (2020-12-01) + +**Note:** Version bump only for package gatsby-cli + # [2.16.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-cli@2.15.0-next.2...gatsby-cli@2.16.0-next.0) (2020-11-26) ### Bug Fixes diff --git a/packages/gatsby-cli/package.json b/packages/gatsby-cli/package.json index 9f1859f94e935..bb0341c3b8877 100644 --- a/packages/gatsby-cli/package.json +++ b/packages/gatsby-cli/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-cli", "description": "Gatsby command-line interface for creating new sites and running Gatsby commands", - "version": "2.16.0-next.0", + "version": "2.16.0-next.1", "author": "Kyle Mathews ", "bin": { "gatsby": "cli.js" @@ -19,13 +19,13 @@ "common-tags": "^1.8.0", "configstore": "^5.0.1", "convert-hrtime": "^3.0.0", - "create-gatsby": "^0.2.0-next.0", + "create-gatsby": "^0.2.0-next.1", "envinfo": "^7.7.3", "execa": "^3.4.0", "fs-exists-cached": "^1.0.0", "fs-extra": "^8.1.0", "gatsby-core-utils": "^1.7.0-next.0", - "gatsby-recipes": "^0.6.0-next.0", + "gatsby-recipes": "^0.6.0-next.1", "gatsby-telemetry": "^1.7.0-next.0", "hosted-git-info": "^3.0.6", "is-valid-path": "^0.1.1", diff --git a/packages/gatsby-plugin-image/CHANGELOG.md b/packages/gatsby-plugin-image/CHANGELOG.md index 44b7203605f6a..6757b49417089 100644 --- a/packages/gatsby-plugin-image/CHANGELOG.md +++ b/packages/gatsby-plugin-image/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.4.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-image@0.4.0-next.0...gatsby-plugin-image@0.4.0-next.1) (2020-12-01) + +### Bug Fixes + +- **gatsby-plugin-image:** Add overflow hidden back to wrapper CSS ([#28410](https://github.com/gatsbyjs/gatsby/issues/28410)) ([2b62f38](https://github.com/gatsbyjs/gatsby/commit/2b62f389457f515daf843ab22f95c015aa643ffe)) +- **gatsby-plugin-image:** Correct img CSS ([#28317](https://github.com/gatsbyjs/gatsby/issues/28317)) ([bfd86df](https://github.com/gatsbyjs/gatsby/commit/bfd86dfc5bdad881e9b4363fc00c4186e0124833)) +- **gatsby-plugin-image:** Fix StaticImage props interface and add propTypes ([#28372](https://github.com/gatsbyjs/gatsby/issues/28372)) ([93a1447](https://github.com/gatsbyjs/gatsby/commit/93a144744c20fc57f563cb5af2683725abc3c941)) + # [0.4.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-image@0.3.0-next.1...gatsby-plugin-image@0.4.0-next.0) (2020-11-26) ### Bug Fixes diff --git a/packages/gatsby-plugin-image/package.json b/packages/gatsby-plugin-image/package.json index 26caac600285e..612d445a2baa7 100644 --- a/packages/gatsby-plugin-image/package.json +++ b/packages/gatsby-plugin-image/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-image", - "version": "0.4.0-next.0", + "version": "0.4.0-next.1", "scripts": { "build": "npm-run-all -s clean -p build:*", "build:gatsby-node": "tsc --jsx react --downlevelIteration true --skipLibCheck true --esModuleInterop true --outDir dist/ src/gatsby-node.ts src/babel-plugin-parse-static-images.ts src/resolver-utils.ts src/types.d.ts", diff --git a/packages/gatsby-plugin-manifest/CHANGELOG.md b/packages/gatsby-plugin-manifest/CHANGELOG.md index 45cc9a18fc280..2317915a70af5 100644 --- a/packages/gatsby-plugin-manifest/CHANGELOG.md +++ b/packages/gatsby-plugin-manifest/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.9.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-manifest@2.9.0-next.0...gatsby-plugin-manifest@2.9.0-next.1) (2020-12-01) + +**Note:** Version bump only for package gatsby-plugin-manifest + # [2.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-manifest@2.8.0-next.0...gatsby-plugin-manifest@2.9.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-plugin-manifest diff --git a/packages/gatsby-plugin-manifest/package.json b/packages/gatsby-plugin-manifest/package.json index 6665cbfffa069..6d99cea648983 100644 --- a/packages/gatsby-plugin-manifest/package.json +++ b/packages/gatsby-plugin-manifest/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-manifest", "description": "Gatsby plugin which adds a manifest.webmanifest to make sites progressive web apps", - "version": "2.9.0-next.0", + "version": "2.9.0-next.1", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-plugin-react-helmet/CHANGELOG.md b/packages/gatsby-plugin-react-helmet/CHANGELOG.md index b5080c8672bcc..4b1e5fdab4651 100644 --- a/packages/gatsby-plugin-react-helmet/CHANGELOG.md +++ b/packages/gatsby-plugin-react-helmet/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.7.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-react-helmet@3.7.0-next.0...gatsby-plugin-react-helmet@3.7.0-next.1) (2020-12-01) + +**Note:** Version bump only for package gatsby-plugin-react-helmet + # [3.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-react-helmet@3.6.0-next.0...gatsby-plugin-react-helmet@3.7.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-plugin-react-helmet diff --git a/packages/gatsby-plugin-react-helmet/package.json b/packages/gatsby-plugin-react-helmet/package.json index 796139a93e9e1..fcbb20ef93de1 100644 --- a/packages/gatsby-plugin-react-helmet/package.json +++ b/packages/gatsby-plugin-react-helmet/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-react-helmet", "description": "Manage document head data with react-helmet. Provides drop-in server rendering support for Gatsby.", - "version": "3.7.0-next.0", + "version": "3.7.0-next.1", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-plugin-sharp/CHANGELOG.md b/packages/gatsby-plugin-sharp/CHANGELOG.md index ca7d0389d0d81..17d2edc88cd21 100644 --- a/packages/gatsby-plugin-sharp/CHANGELOG.md +++ b/packages/gatsby-plugin-sharp/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.11.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-sharp@2.11.0-next.0...gatsby-plugin-sharp@2.11.0-next.1) (2020-12-01) + +### Bug Fixes + +- avoid joi validation error when using reporter.panic ([#28291](https://github.com/gatsbyjs/gatsby/issues/28291)) ([231cf9f](https://github.com/gatsbyjs/gatsby/commit/231cf9f8c0ad077c8c1324a5c89c791a2da775a1)) + # [2.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-sharp@2.10.0-next.1...gatsby-plugin-sharp@2.11.0-next.0) (2020-11-26) ### Features diff --git a/packages/gatsby-plugin-sharp/package.json b/packages/gatsby-plugin-sharp/package.json index 2ecd141220d89..ffa65f7a3786e 100644 --- a/packages/gatsby-plugin-sharp/package.json +++ b/packages/gatsby-plugin-sharp/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-sharp", "description": "Wrapper of the Sharp image manipulation library for Gatsby plugins", - "version": "2.11.0-next.0", + "version": "2.11.0-next.1", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -33,7 +33,7 @@ "@types/sharp": "^0.26.1", "babel-preset-gatsby-package": "^0.9.0-next.0", "cross-env": "^7.0.2", - "gatsby-plugin-image": "^0.4.0-next.0" + "gatsby-plugin-image": "^0.4.0-next.1" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-sharp#readme", "keywords": [ diff --git a/packages/gatsby-recipes/CHANGELOG.md b/packages/gatsby-recipes/CHANGELOG.md index 9a3d8fbff1c63..48c37f754e8b6 100644 --- a/packages/gatsby-recipes/CHANGELOG.md +++ b/packages/gatsby-recipes/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.6.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-recipes@0.6.0-next.0...gatsby-recipes@0.6.0-next.1) (2020-12-01) + +### Bug Fixes + +- **gatsby-recipes:** add isLocal to schema for GatsbyPlugin ([#28417](https://github.com/gatsbyjs/gatsby/issues/28417)) ([43b2f10](https://github.com/gatsbyjs/gatsby/commit/43b2f1071b1e465919d1f3a3a5caec36ac909d44)) + # [0.6.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-recipes@0.5.0-next.2...gatsby-recipes@0.6.0-next.0) (2020-11-26) ### Bug Fixes diff --git a/packages/gatsby-recipes/package.json b/packages/gatsby-recipes/package.json index 19de925b24247..1248732b5acb6 100644 --- a/packages/gatsby-recipes/package.json +++ b/packages/gatsby-recipes/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-recipes", "description": "Core functionality for Gatsby Recipes", - "version": "0.6.0-next.0", + "version": "0.6.0-next.1", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-contentful/CHANGELOG.md b/packages/gatsby-source-contentful/CHANGELOG.md index 51aae459d3458..33735cab3b7d8 100644 --- a/packages/gatsby-source-contentful/CHANGELOG.md +++ b/packages/gatsby-source-contentful/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [4.3.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-source-contentful@4.3.0-next.0...gatsby-source-contentful@4.3.0-next.1) (2020-12-01) + +### Performance Improvements + +- **gatsby-source-contentful:** fix unguided search in loop over large lists ([#28375](https://github.com/gatsbyjs/gatsby/issues/28375)) ([d9904ac](https://github.com/gatsbyjs/gatsby/commit/d9904ac69ec6abcd8e16f18056b0387c54d8c625)) + # [4.3.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-source-contentful@4.2.0-next.2...gatsby-source-contentful@4.3.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-source-contentful diff --git a/packages/gatsby-source-contentful/package.json b/packages/gatsby-source-contentful/package.json index 75bbb51bfeb27..07a1529fede9d 100644 --- a/packages/gatsby-source-contentful/package.json +++ b/packages/gatsby-source-contentful/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-contentful", "description": "Gatsby source plugin for building websites using the Contentful CMS as a data source", - "version": "4.3.0-next.0", + "version": "4.3.0-next.1", "author": "Marcus Ericsson (mericsson.com)", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-shopify/CHANGELOG.md b/packages/gatsby-source-shopify/CHANGELOG.md index 666707b475a4b..3eb2bf79233d5 100644 --- a/packages/gatsby-source-shopify/CHANGELOG.md +++ b/packages/gatsby-source-shopify/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.7.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-source-shopify@3.7.0-next.0...gatsby-source-shopify@3.7.0-next.1) (2020-12-01) + +### Features + +- **gatsby-source-shopify:** add "priceNumber" field that will allow for proper sorting ([#28243](https://github.com/gatsbyjs/gatsby/issues/28243)) ([11a0a16](https://github.com/gatsbyjs/gatsby/commit/11a0a1642c699a14dc0e8747d03e2a42fe70a679)) + # [3.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-source-shopify@3.6.0-next.2...gatsby-source-shopify@3.7.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-source-shopify diff --git a/packages/gatsby-source-shopify/package.json b/packages/gatsby-source-shopify/package.json index 0c10d1a6041dd..3662412ff1e0a 100644 --- a/packages/gatsby-source-shopify/package.json +++ b/packages/gatsby-source-shopify/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-source-shopify", - "version": "3.7.0-next.0", + "version": "3.7.0-next.1", "description": "Gatsby source plugin for building websites using Shopify as a data source.", "scripts": { "build": "babel src --out-dir . --ignore \"**/__tests__\"", diff --git a/packages/gatsby-transformer-sqip/CHANGELOG.md b/packages/gatsby-transformer-sqip/CHANGELOG.md index 93338e0554695..bc4a0bf08b64c 100644 --- a/packages/gatsby-transformer-sqip/CHANGELOG.md +++ b/packages/gatsby-transformer-sqip/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.8.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-transformer-sqip@2.8.0-next.0...gatsby-transformer-sqip@2.8.0-next.1) (2020-12-01) + +**Note:** Version bump only for package gatsby-transformer-sqip + # [2.8.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-transformer-sqip@2.7.0-next.1...gatsby-transformer-sqip@2.8.0-next.0) (2020-11-26) **Note:** Version bump only for package gatsby-transformer-sqip diff --git a/packages/gatsby-transformer-sqip/package.json b/packages/gatsby-transformer-sqip/package.json index 88faab3a0c48b..adb5392b204ab 100644 --- a/packages/gatsby-transformer-sqip/package.json +++ b/packages/gatsby-transformer-sqip/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-transformer-sqip", "description": "Generates geometric primitive version of images", - "version": "2.8.0-next.0", + "version": "2.8.0-next.1", "author": "Benedikt Rötsch ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -9,7 +9,7 @@ "dependencies": { "@babel/runtime": "^7.12.5", "fs-extra": "^8.1.0", - "gatsby-plugin-sharp": "^2.11.0-next.0", + "gatsby-plugin-sharp": "^2.11.0-next.1", "md5-file": "^5.0.0", "mini-svg-data-uri": "^1.2.3", "p-queue": "^6.6.2", diff --git a/packages/gatsby/CHANGELOG.md b/packages/gatsby/CHANGELOG.md index b11bb7ee15719..1385e96f6ffbb 100644 --- a/packages/gatsby/CHANGELOG.md +++ b/packages/gatsby/CHANGELOG.md @@ -3,6 +3,24 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.29.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.29.0-next.0...gatsby@2.29.0-next.1) (2020-12-01) + +### Bug Fixes + +- **develop:** emit stale page data messages when staticQueryHashes change ([#28349](https://github.com/gatsbyjs/gatsby/issues/28349)) ([5096e90](https://github.com/gatsbyjs/gatsby/commit/5096e90f3af9490f910a47331ac42efa2edfd9e2)) +- **gatsby:** Add `FAST_REFRESH` config flag ([#28409](https://github.com/gatsbyjs/gatsby/issues/28409)) ([ce090e5](https://github.com/gatsbyjs/gatsby/commit/ce090e5e058ff4927e51aaadba1a834f9f5c4e9f)) +- **gatsby:** correct tracing for GraphQL queries ([#28415](https://github.com/gatsbyjs/gatsby/issues/28415)) ([4e50d5c](https://github.com/gatsbyjs/gatsby/commit/4e50d5c8008e1608138b2cecabd00b014bc90bf9)) +- **gatsby:** fix telemetryId for LAZY_IMAGES ([#28340](https://github.com/gatsbyjs/gatsby/issues/28340)) ([4998303](https://github.com/gatsbyjs/gatsby/commit/49983036de2bf7a61fe654b37fb8b3fe7d639153)) +- **gatsby:** handle in dev-ssr when a page is deleted ([#28325](https://github.com/gatsbyjs/gatsby/issues/28325)) ([a9f9a23](https://github.com/gatsbyjs/gatsby/commit/a9f9a23705edaf393466b30bc89546b59de59158)) +- **gatsby:** move starting dev-ssr listener inside function & only init listeners once ([#28395](https://github.com/gatsbyjs/gatsby/issues/28395)) ([3ce476b](https://github.com/gatsbyjs/gatsby/commit/3ce476b1eac97aedd16f9d150cd6a81f36255380)) +- **gatsby:** re-render route when location state changes ([#28346](https://github.com/gatsbyjs/gatsby/issues/28346)) ([3ccaec8](https://github.com/gatsbyjs/gatsby/commit/3ccaec855b376b267c02009f51772c237620088d)) +- **gatsby:** scroll restoration issue in browser API ([#27384](https://github.com/gatsbyjs/gatsby/issues/27384)) ([4a7a324](https://github.com/gatsbyjs/gatsby/commit/4a7a324553669a72445a427ed8cc30e812f38bd1)) + +### Features + +- **gatsby:** people who are using a flag, invite them to try out other flags ([#28338](https://github.com/gatsbyjs/gatsby/issues/28338)) ([9c8f788](https://github.com/gatsbyjs/gatsby/commit/9c8f78842784c6882953d2f5c72dd71d61ba3e29)) +- **gatsby:** Track the use of flags in gatsby-config.js ([#28337](https://github.com/gatsbyjs/gatsby/issues/28337)) ([3e056d1](https://github.com/gatsbyjs/gatsby/commit/3e056d1ab51cffb8fbf15c7b932fd4f11e1db545)) + # [2.29.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.28.0-next.2...gatsby@2.29.0-next.0) (2020-11-26) ### Bug Fixes diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json index 0510eb4ca54e7..f8cf1d700eda1 100644 --- a/packages/gatsby/package.json +++ b/packages/gatsby/package.json @@ -1,7 +1,7 @@ { "name": "gatsby", "description": "Blazing fast modern site generator for React", - "version": "2.29.0-next.0", + "version": "2.29.0-next.1", "author": "Kyle Mathews ", "bin": { "gatsby": "./cli.js" @@ -77,7 +77,7 @@ "find-cache-dir": "^3.3.1", "fs-exists-cached": "1.0.0", "fs-extra": "^8.1.0", - "gatsby-cli": "^2.16.0-next.0", + "gatsby-cli": "^2.16.0-next.1", "gatsby-core-utils": "^1.7.0-next.0", "gatsby-graphiql-explorer": "^0.8.0-next.0", "gatsby-legacy-polyfills": "^0.4.0-next.0", From 239589a2304911cb7c0b3a5736aa8b7f59f016b2 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Tue, 1 Dec 2020 14:03:04 -0800 Subject: [PATCH 036/144] feature(gatsby): style the SSR error page (#28416) * Add styles & tweak language * Fix small error noticed w/ source-maps * fix snapshot * update snapshot --- .../ssr/__tests__/__snapshots__/ssr.js.snap | 126 ++++++++++++++++-- .../__snapshots__/develop-html-route.ts.snap | 14 +- .../src/utils/dev-ssr/develop-html-route.ts | 117 ++++++++++++++-- .../utils/dev-ssr/render-dev-html-child.js | 11 +- 4 files changed, 236 insertions(+), 32 deletions(-) diff --git a/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap b/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap index 5ffedbfcb2be6..716569a481059 100644 --- a/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap +++ b/integration-tests/ssr/__tests__/__snapshots__/ssr.js.snap @@ -3,28 +3,126 @@ exports[`SSR is run for a page when it is requested 1`] = `"
Hello world
"`; exports[`SSR it generates an error page correctly 1`] = ` -"Develop SSR Error

Error

-

The page didn't SSR correctly

+" + Develop SSR Error + + +

Error

+

The page didn't server render (SSR) correctly

+

+ React components in Gatsby must render successfully in the browser and in a + node.js environment. When we tried to render your page component in + node.js, it errored. +

  • URL path: /bad-page/
  • File path: src/pages/bad-page.js
-

error message

-

window is not defined

  2 | 
-  3 | const Component = () => {
-> 4 |   const a = window.width
-    |             ^
-  5 | 
-  6 |   return <div>hi</div>
-  7 | }
+

error

+ window is not defined + 
  2 | 
+  3 | const Component = () => {
+> 4 |   const a = window.width
+    |             ^
+  5 | 
+  6 |   return <div>hi</div>
+  7 | }

For help debugging SSR errors, see this docs page: https://www.gatsbyjs.com/docs/debugging-html-builds/

Skip SSR

-

If you don't wish to fix the SSR error at the moment, press the +

+ If you don't wish to fix the SSR error at the moment, press the button below to reload the page without attempting SSR

-

Note: this error will show up in when you build your site so must be fixed before then.

-

Caveat: SSR errors in module scope i.e. outside of your components can't be skipped so will need fixed before you can continue

- +

+ Note: this error will show up in when you build your site so must be fixed before then.

+

+ Caveat: SSR errors in module scope i.e. outside of your components can't be skipped so will need fixed before you can continue

+