{node.title} - {" - "}${node.priceRange.minVariantPrice.amount} + {" - "}${node.priceRangeV2.minVariantPrice.amount}
{node.description}
{data.sanityPerson.name}
-{product.title}
-{product.price}
@@ -373,8 +371,7 @@ A few notes about this file: 1. The result of the query is added to the template component as the `data` prop. 2. The image path was automatically converted by the Sharp transformer into a “child node” that includes optimized versions of the image. -3. The query uses a [GraphQL fragment](/plugins/gatsby-image/#fragments) to query all the required data for optimized images. GraphQL fragments _do not work_ in the GraphQL Playground. -4. The `img` tag has been swapped out for a `gatsby-image` component named `Image`. Instead of a `src` attribute, it accepts an object with optimized image data. +3. The `img` tag has been swapped out for a `gatsby-plugin-image` component named `GatsbyImage`. Instead of a `src` attribute, it accepts an object with optimized image data. Save this file, run `gatsby develop`, then open `http://localhost:8000/gql/purple-hat/`: diff --git a/docs/docs/working-with-fonts-and-typography.md b/docs/docs/working-with-fonts-and-typography.md index 5bc7afa97ce63..ec78fd9c0e0b1 100644 --- a/docs/docs/working-with-fonts-and-typography.md +++ b/docs/docs/working-with-fonts-and-typography.md @@ -10,4 +10,4 @@ The three different kinds of fonts covered in this section are: - **[Web fonts](/docs/how-to/styling/using-web-fonts/)**: For when you want to use a font from a service like [Google Fonts](https://fonts.google.com/) or [Typekit Web Fonts](https://fonts.adobe.com/typekit). - **[Typography.js framework](/docs/using-typography-js/)**: For when you want to use a predefined set of fonts from the [Typography.js](https://kyleamathews.github.io/typography.js/) library. -Gatsby doesn’t have an opinion about which [styling approach](/docs/styling/) you choose. Most every possible option is supported through official and community plugins. (If there isn’t a plugin yet for your favorite option, consider [contributing](/docs/creating-plugins) one!) +Gatsby doesn’t have an opinion about which [styling approach](/docs/styling/) you choose. Almost every possible option is supported through official and community plugins. (If there isn’t a plugin yet for your favorite option, consider [contributing](/docs/creating-plugins) one!) diff --git a/docs/docs/working-with-images.md b/docs/docs/working-with-images.md index 67f1ac060c897..f9b6c26b9df4f 100644 --- a/docs/docs/working-with-images.md +++ b/docs/docs/working-with-images.md @@ -6,7 +6,7 @@ _This document uses the deprecated image plugin. Please check out how to work wi Optimizing images is a challenge on any website. To utilize best practices for performance across devices, you need multiple sizes and resolutions of each image. Luckily, Gatsby has several useful [plugins](/docs/plugins/) that work together to do that for images on [page components](/docs/conceptual/building-with-components/#page-components). -The recommended approach is to use [GraphQL queries](/docs/conceptual/graphql-concepts/) to get images of the optimal size or resolution, then, display them with the [`gatsby-image`](/plugins/gatsby-image/) component. +The recommended approach is to use [GraphQL queries](/docs/conceptual/graphql-concepts/) to get images of the optimal size or resolution, then, display them with the [`gatsby-plugin-image`](/plugins/gatsby-plugin-image/) component. ## Query images with GraphQL @@ -15,7 +15,7 @@ Querying images with GraphQL allows you to access the image's data as well as pe You'll need a few plugins for this: - [`gatsby-source-filesystem`](/plugins/gatsby-source-filesystem/) plugin allows you to [query files with GraphQL](/docs/conceptual/graphql-concepts/#images) -- [`gatsby-plugin-sharp`](/plugins/gatsby-plugin-sharp) powers the connections between Sharp and Gatsby Plugins +- [`gatsby-plugin-sharp`](/plugins/gatsby-plugin-sharp/) powers the connections between Sharp and Gatsby Plugins - [`gatsby-transformer-sharp`](/plugins/gatsby-transformer-sharp/) allows you to create multiples images of the right sizes and resolutions with a query If the final image is of a fixed size, optimization relies on having multiple resolutions of the image. If it is responsive, meaning it stretches to fill a container or page, optimization relies on having different sizes of the same image. See the [Gatsby Image documentation for more information](/plugins/gatsby-image/#two-types-of-responsive-images). @@ -38,9 +38,9 @@ export const query = graphql` ` ``` -## Optimizing images with gatsby-image +## Optimizing images with gatsby-plugin-image -[`gatsby-image`](/plugins/gatsby-image/) is a plugin that automatically creates React components for optimized images that: +[`gatsby-image`](/plugins/gatsby-plugin-image/) is a plugin that automatically creates React components for optimized images that: > - Loads the optimal size of image for each device size and screen resolution > - Holds the image position while loading so your page doesn't jump around as images load diff --git a/e2e-tests/contentful/schema.gql b/e2e-tests/contentful/schema.gql index 2a8e30403f33d..7a501577d38cb 100644 --- a/e2e-tests/contentful/schema.gql +++ b/e2e-tests/contentful/schema.gql @@ -1,4 +1,4 @@ -### Type definitions saved at 2021-05-21T17:02:49.951Z ### +### Type definitions saved at 2021-09-25T11:33:25.217Z ### type File implements Node @dontInfer { sourceInstanceName: String! @@ -96,43 +96,23 @@ type SitePage implements Node @dontInfer { internalComponentName: String! componentChunkName: String! matchPath: String + pageContext: JSON } -type MarkdownHeading { - id: String - value: String - depth: Int -} - -enum MarkdownHeadingLevels { - h1 - h2 - h3 - h4 - h5 - h6 -} - -enum MarkdownExcerptFormats { - PLAIN - HTML - MARKDOWN -} - -type MarkdownWordCount { - paragraphs: Int - sentences: Int - words: Int -} - -type MarkdownRemark implements Node @childOf(mimeTypes: ["text/markdown", "text/x-markdown"], types: ["contentfulTextLongPlainTextNode", "contentfulTextLongMarkdownTextNode", "contentfulTextLongLocalizedTextNode"]) @derivedTypes @dontInfer { - frontmatter: MarkdownRemarkFrontmatter - excerpt: String - rawMarkdownBody: String +type SitePlugin implements Node @dontInfer { + resolve: String + name: String + version: String + nodeAPIs: [String] + browserAPIs: [String] + ssrAPIs: [String] + pluginFilepath: String + pluginOptions: JSON + packageJson: JSON } -type MarkdownRemarkFrontmatter { - title: String +type SiteBuildMetadata implements Node @dontInfer { + buildTime: Date @dateformat } interface ContentfulEntry implements Node { @@ -184,15 +164,16 @@ type ContentfulNumber implements ContentfulReference & ContentfulEntry & Node @d contentful_id: String! node_locale: String! title: String - decimal: Float + integerLocalized: Int spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulNumberSys + metadata: ContentfulNumberMetadata + decimal: Float integer: Int content_reference: [ContentfulContentReference] @link(by: "id", from: "content reference___NODE") @proxy(from: "content reference___NODE") decimalLocalized: Float - integerLocalized: Int } type ContentfulNumberSys @derivedTypes { @@ -211,22 +192,31 @@ type ContentfulNumberSysContentTypeSys { id: String } +type ContentfulNumberMetadata { + tags: [ContentfulTag] @link(by: "id", from: "tags___NODE") +} + +type ContentfulTag implements Node @dontInfer { + name: String! + contentful_id: String! +} + type ContentfulContentReference implements ContentfulReference & ContentfulEntry & Node @derivedTypes @dontInfer { contentful_id: String! node_locale: String! title: String - manyLocalized: [ContentfulNumberContentfulTextUnion] @link(by: "id", from: "manyLocalized___NODE") + one: ContentfulContentReferenceContentfulTextUnion @link(by: "id", from: "one___NODE") + content_reference: [ContentfulContentReference] @link(by: "id", from: "content reference___NODE") @proxy(from: "content reference___NODE") spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulContentReferenceSys oneLocalized: ContentfulNumber @link(by: "id", from: "oneLocalized___NODE") - one: ContentfulContentReferenceContentfulTextUnion @link(by: "id", from: "one___NODE") - content_reference: [ContentfulContentReference] @link(by: "id", from: "content reference___NODE") @proxy(from: "content reference___NODE") many: [ContentfulContentReferenceContentfulNumberContentfulTextUnion] @link(by: "id", from: "many___NODE") + manyLocalized: [ContentfulNumberContentfulTextUnion] @link(by: "id", from: "manyLocalized___NODE") } -union ContentfulNumberContentfulTextUnion = ContentfulNumber | ContentfulText +union ContentfulContentReferenceContentfulTextUnion = ContentfulContentReference | ContentfulText type ContentfulContentReferenceSys @derivedTypes { type: String @@ -244,10 +234,10 @@ type ContentfulContentReferenceSysContentTypeSys { id: String } -union ContentfulContentReferenceContentfulTextUnion = ContentfulContentReference | ContentfulText - union ContentfulContentReferenceContentfulNumberContentfulTextUnion = ContentfulContentReference | ContentfulNumber | ContentfulText +union ContentfulNumberContentfulTextUnion = ContentfulNumber | ContentfulText + type ContentfulText implements ContentfulReference & ContentfulEntry & Node @derivedTypes @dontInfer { contentful_id: String! node_locale: String! @@ -257,12 +247,12 @@ type ContentfulText implements ContentfulReference & ContentfulEntry & Node @der createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulTextSys - shortLocalized: String longMarkdown: contentfulTextLongMarkdownTextNode @link(by: "id", from: "longMarkdown___NODE") + shortLocalized: String longPlain: contentfulTextLongPlainTextNode @link(by: "id", from: "longPlain___NODE") + shortList: [String] short: String content_reference: [ContentfulContentReference] @link(by: "id", from: "content reference___NODE") @proxy(from: "content reference___NODE") - shortList: [String] } type contentfulTextLongLocalizedTextNode implements Node @derivedTypes @childOf(types: ["ContentfulText"]) @dontInfer { @@ -312,14 +302,14 @@ type ContentfulMediaReference implements ContentfulReference & ContentfulEntry & contentful_id: String! node_locale: String! title: String - manyLocalized: [ContentfulAsset] @link(by: "id", from: "manyLocalized___NODE") + one: ContentfulAsset @link(by: "id", from: "one___NODE") spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulMediaReferenceSys - many: [ContentfulAsset] @link(by: "id", from: "many___NODE") oneLocalized: ContentfulAsset @link(by: "id", from: "oneLocalized___NODE") - one: ContentfulAsset @link(by: "id", from: "one___NODE") + many: [ContentfulAsset] @link(by: "id", from: "many___NODE") + manyLocalized: [ContentfulAsset] @link(by: "id", from: "manyLocalized___NODE") } type ContentfulMediaReferenceSys @derivedTypes { @@ -370,14 +360,14 @@ type ContentfulDate implements ContentfulReference & ContentfulEntry & Node @der contentful_id: String! node_locale: String! title: String - dateLocalized: Date @dateformat + dateTimeTimezone: Date @dateformat spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulDateSys - dateTime: Date @dateformat - dateTimeTimezone: Date @dateformat date: Date @dateformat + dateLocalized: Date @dateformat + dateTime: Date @dateformat } type ContentfulDateSys @derivedTypes { @@ -409,8 +399,8 @@ type ContentfulLocation implements ContentfulReference & ContentfulEntry & Node } type ContentfulLocationLocationLocalized { - lat: Float lon: Float + lat: Float } type ContentfulLocationSys @derivedTypes { @@ -438,25 +428,39 @@ type ContentfulJson implements ContentfulReference & ContentfulEntry & Node @der contentful_id: String! node_locale: String! title: String - jsonLocalized: contentfulJsonJsonLocalizedJsonNode @link(by: "id", from: "jsonLocalized___NODE") + json: contentfulJsonJsonJsonNode @link(by: "id", from: "json___NODE") spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulJsonSys - json: contentfulJsonJsonJsonNode @link(by: "id", from: "json___NODE") + jsonLocalized: contentfulJsonJsonLocalizedJsonNode @link(by: "id", from: "jsonLocalized___NODE") } -type contentfulJsonJsonLocalizedJsonNode implements Node @derivedTypes @childOf(types: ["ContentfulJson"]) @dontInfer { +type contentfulJsonJsonJsonNode implements Node @derivedTypes @childOf(types: ["ContentfulJson"]) @dontInfer { age: Int city: String name: String - sys: contentfulJsonJsonLocalizedJsonNodeSys + sys: contentfulJsonJsonJsonNodeSys + Actors: [contentfulJsonJsonJsonNodeActors] } -type contentfulJsonJsonLocalizedJsonNodeSys { +type contentfulJsonJsonJsonNodeSys { type: String } +type contentfulJsonJsonJsonNodeActors { + age: Int + name: String + wife: String + photo: String + weight: Float + Born_At: String @proxy(from: "Born At") + children: [String] + Birthdate: String + hasChildren: Boolean + hasGreyHair: Boolean +} + type ContentfulJsonSys @derivedTypes { type: String revision: Int @@ -473,28 +477,14 @@ type ContentfulJsonSysContentTypeSys { id: String } -type contentfulJsonJsonJsonNode implements Node @derivedTypes @childOf(types: ["ContentfulJson"]) @dontInfer { - Actors: [contentfulJsonJsonJsonNodeActors] - sys: contentfulJsonJsonJsonNodeSys +type contentfulJsonJsonLocalizedJsonNode implements Node @derivedTypes @childOf(types: ["ContentfulJson"]) @dontInfer { name: String age: Int city: String + sys: contentfulJsonJsonLocalizedJsonNodeSys } -type contentfulJsonJsonJsonNodeActors { - name: String - age: Int - Born_At: String @proxy(from: "Born At") - Birthdate: String - photo: String - wife: String - weight: Float - hasChildren: Boolean - hasGreyHair: Boolean - children: [String] -} - -type contentfulJsonJsonJsonNodeSys { +type contentfulJsonJsonLocalizedJsonNodeSys { type: String } @@ -502,21 +492,21 @@ type ContentfulRichText implements ContentfulReference & ContentfulEntry & Node contentful_id: String! node_locale: String! title: String - richTextValidated: ContentfulRichTextRichTextValidated + richText: ContentfulRichTextRichText spaceId: String createdAt: Date @dateformat updatedAt: Date @dateformat sys: ContentfulRichTextSys + richTextValidated: ContentfulRichTextRichTextValidated richTextLocalized: ContentfulRichTextRichTextLocalized - richText: ContentfulRichTextRichText } -type ContentfulRichTextRichTextValidated { +type ContentfulRichTextRichText { raw: String - references: [ContentfulAssetContentfulLocationContentfulNumberContentfulTextUnion] @link(by: "id", from: "references___NODE") + references: [ContentfulAssetContentfulContentReferenceContentfulLocationContentfulTextUnion] @link(by: "id", from: "references___NODE") } -union ContentfulAssetContentfulLocationContentfulNumberContentfulTextUnion = ContentfulAsset | ContentfulLocation | ContentfulNumber | ContentfulText +union ContentfulAssetContentfulContentReferenceContentfulLocationContentfulTextUnion = ContentfulAsset | ContentfulContentReference | ContentfulLocation | ContentfulText type ContentfulRichTextSys @derivedTypes { type: String @@ -534,22 +524,59 @@ type ContentfulRichTextSysContentTypeSys { id: String } -type ContentfulRichTextRichTextLocalized { +type ContentfulRichTextRichTextValidated { raw: String + references: [ContentfulAssetContentfulLocationContentfulNumberContentfulTextUnion] @link(by: "id", from: "references___NODE") } -type ContentfulRichTextRichText { +union ContentfulAssetContentfulLocationContentfulNumberContentfulTextUnion = ContentfulAsset | ContentfulLocation | ContentfulNumber | ContentfulText + +type ContentfulRichTextRichTextLocalized { raw: String - references: [ContentfulAssetContentfulContentReferenceContentfulLocationContentfulTextUnion] @link(by: "id", from: "references___NODE") } -union ContentfulAssetContentfulContentReferenceContentfulLocationContentfulTextUnion = ContentfulAsset | ContentfulContentReference | ContentfulLocation | ContentfulText - type ContentfulValidatedContentReference implements ContentfulReference & ContentfulEntry & Node @dontInfer { contentful_id: String! node_locale: String! } +type MarkdownHeading { + id: String + value: String + depth: Int +} + +enum MarkdownHeadingLevels { + h1 + h2 + h3 + h4 + h5 + h6 +} + +enum MarkdownExcerptFormats { + PLAIN + HTML + MARKDOWN +} + +type MarkdownWordCount { + paragraphs: Int + sentences: Int + words: Int +} + +type MarkdownRemark implements Node @childOf(mimeTypes: ["text/markdown", "text/x-markdown"], types: ["contentfulTextLongPlainTextNode", "contentfulTextLongMarkdownTextNode", "contentfulTextLongLocalizedTextNode"]) @derivedTypes @dontInfer { + frontmatter: MarkdownRemarkFrontmatter + excerpt: String + rawMarkdownBody: String +} + +type MarkdownRemarkFrontmatter { + title: String +} + type ContentfulContentType implements Node @derivedTypes @dontInfer { name: String displayField: String diff --git a/e2e-tests/contentful/snapshots.js b/e2e-tests/contentful/snapshots.js index eebeb902df067..2207ca7c22e03 100644 --- a/e2e-tests/contentful/snapshots.js +++ b/e2e-tests/contentful/snapshots.js @@ -28,7 +28,7 @@ module.exports = { }, "rich-text": { "rich-text: All Features": { - "1": "\n
\n
\n
"
+ "1": "Rich Text: All Features
\nThe European languages
\nare members of the same family. Their separate
- \n
- \n
science
\n \n - \n
music
\n \n - \n
sport
\n \n - \n
etc
\n \n
Europe uses the same vocabulary.
\n \n \n![\"\"\n](\"//images.ctfassets.net/k8iqpp6u0ior/2PeXF5HW2hiDfCggU9RIpO/8236da1f40af17e19922ddb87030735a/jae-park-7GX5aICb5i4-unsplash.jpg?w=200&q=50\"\n)
\n \n
The languages only differ in:
\n- \n
- \n
their grammar
\n \n - \n
their pronunciation
\n \n - \n
their most common words
\n \n - \n
[Inline-ContentfulText]\n Text: Short\n :\n The quick brown fox jumps over the lazy dog.
\n \n
Everyone realizes why a new common language would be desirable: one could\n refuse to pay expensive translators.
\n{\n \"userId\": 1,\n \"id\": 1,\n \"title\": \"delectus aut autem\",\n \"completed\": false\n }
To achieve this, it would be necessary to have uniform grammar,\n pronunciation and more common words.
\n[ContentfulLocation] Lat:\n 52.51627\n , Long:\n 13.3777
\n\n\nIf several languages coalesce, the grammar of the resulting language is\n more simple and regular than that of the individual languages.
\n
The new common language will be more simple and regular than the existing\n European languages. It will be as simple as Occidental; in fact, it will be\n
\n\n
\n
\n
\n
"
},
"rich-text: Basic": {
"1": "Rich Text: All Features
\nThe European languages
\nare members of the same family. Their separate
- \n
- \n
science
\n \n - \n
music
\n \n - \n
sport
\n \n - \n
etc
\n \n
Europe uses the same vocabulary.
\n \n \n![\"\"\n](\"https://images.ctfassets.net/k8iqpp6u0ior/2PeXF5HW2hiDfCggU9RIpO/8236da1f40af17e19922ddb87030735a/jae-park-7GX5aICb5i4-unsplash.jpg?w=200&q=50\"\n)
\n \n
The languages only differ in:
\n- \n
- \n
their grammar
\n \n - \n
their pronunciation
\n \n - \n
their most common words
\n \n - \n
[Inline-ContentfulText]\n Text: Short\n :\n The quick brown fox jumps over the lazy dog.
\n \n
Everyone realizes why a new common language would be desirable: one could\n refuse to pay expensive translators.
\n{\n \"userId\": 1,\n \"id\": 1,\n \"title\": \"delectus aut autem\",\n \"completed\": false\n }
To achieve this, it would be necessary to have uniform grammar,\n pronunciation and more common words.
\n[ContentfulLocation] Lat:\n 52.51627\n , Long:\n 13.3777
\n\n\nIf several languages coalesce, the grammar of the resulting language is\n more simple and regular than that of the individual languages.
\n
The new common language will be more simple and regular than the existing\n European languages. It will be as simple as Occidental; in fact, it will be\n
\n\n
\n
\n
\n
"
@@ -37,7 +37,7 @@ module.exports = {
"1": "Rich Text: Basic
\nThe European languages
\nare members of the same family. Their separate
- \n
- \n
science
\n \n - \n
music
\n \n - \n
sport
\n \n - \n
etc
\n \n
Europe uses the same vocabulary.
\n\n
The languages only differ in:
\n- \n
- \n
their grammar
\n \n - \n
their pronunciation
\n \n - \n
their most common words
\n \n
Everyone realizes why a new common language would be desirable: one could\n refuse to pay expensive translators.
\n{\n \"userId\": 1,\n \"id\": 1,\n \"title\": \"delectus aut autem\",\n \"completed\": false\n }
To achieve this, it would be necessary to have uniform grammar,\n pronunciation and more common words.
\n\n\nIf several languages coalesce, the grammar of the resulting language is\n more simple and regular than that of the individual languages.
\n
The new common language will be more simple and regular than the existing\n European languages. It will be as simple as Occidental; in fact, it will be\n
\n\n
\n
\n
"
},
"rich-text: Embedded Asset": {
- "1": "Rich Text: Embedded Entry
\nEmbedded Entry
\n[ContentfulText]\n The quick brown fox jumps over the lazy dog.
\n \n \n\n
\n
\n
"
+ "1": "Rich Text: Embedded asset
\nEmbedded Asset
\n \n \n \n \n![\"\"\n](\"//images.ctfassets.net/k8iqpp6u0ior/3BSI9CgDdAn1JchXmY5IJi/f97a2185b3395591b98008647ad6fd3c/camylla-battani-AoqgGAqrLpU-unsplash.jpg?w=200&q=50\"\n)
\n \n
\n
\n
"
},
"rich-text: Embedded Entry With Deep Reference Loop": {
"1": "Rich Text: Embedded asset
\nEmbedded Asset
\n \n \n \n \n![\"\"\n](\"https://images.ctfassets.net/k8iqpp6u0ior/3BSI9CgDdAn1JchXmY5IJi/f97a2185b3395591b98008647ad6fd3c/camylla-battani-AoqgGAqrLpU-unsplash.jpg?w=200&q=50\"\n)
\n \n
\n
\n
"
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 c6b9148e77a9a..e8a999aa5ac0a 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
@@ -110,7 +110,9 @@ function pageTitleAndDataAssertion(config) {
function runTests(config) {
preTestSetup(config)
- cy.visit(`/query-data-caches/${config.slug}/page-A/`).waitForRouteChange()
+ cy.visit(`/query-data-caches/${config.slug}/page-A/`, {
+ failOnStatusCode: config.initialPage !== `404`,
+ }).waitForRouteChange()
setupForAssertingNotReloading()
diff --git a/e2e-tests/development-runtime/cypress/integration/ssr.js b/e2e-tests/development-runtime/cypress/integration/ssr.js
new file mode 100644
index 0000000000000..00dc2236c4fd4
--- /dev/null
+++ b/e2e-tests/development-runtime/cypress/integration/ssr.js
@@ -0,0 +1,108 @@
+const staticPath = `/ssr/static-path/`
+const paramPath = `/ssr/param-path/`
+const wildcardPath = `/ssr/wildcard-path/`
+
+describe(`Static path ('${staticPath}')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(staticPath).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(staticPath + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+
+ it(`Client navigation to same path with different query params`, () => {
+ cy.visit(staticPath).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath + `?foo=baz`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"baz"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+})
+
+describe(`Param path ('${paramPath}:param')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(paramPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(paramPath + `foo/` + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ })
+
+ it(`Client navigation to same param path with different query params and url params`, () => {
+ cy.visit(paramPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `foo/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `baz/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"baz"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `baz/`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"baz"}`)
+ })
+})
+
+describe(`Wildcard path ('${wildcardPath}*')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(wildcardPath + `foo/nested/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo/nested"}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(wildcardPath + `foo/nested/` + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo/nested"}`)
+ })
+
+ it(`Client navigation to same param path with different query params and url params`, () => {
+ cy.visit(wildcardPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `foo/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `baz/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"baz"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `baz/`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"baz"}`)
+ })
+})
diff --git a/e2e-tests/development-runtime/src/pages/ssr/param-path/[param].js b/e2e-tests/development-runtime/src/pages/ssr/param-path/[param].js
new file mode 100644
index 0000000000000..af860ab139565
--- /dev/null
+++ b/e2e-tests/development-runtime/src/pages/ssr/param-path/[param].js
@@ -0,0 +1,22 @@
+import React from "react"
+
+export default function Params({ serverData }) {
+ return (
+ Rich Text: Embedded entry with deep reference loop
\nEmbedded entry with deep reference loop
\n[ContentfulReference]\n Content Reference: Many (2nd level loop)\n : [\n Number: Integer, Text: Short, Content Reference: One (Loop A ->\n B)\n ]
\n \n \n\n
+
+ )
+}
+
+export function getServerData(arg) {
+ return {
+ props: {
+ arg,
+ },
+ }
+}
diff --git a/e2e-tests/development-runtime/src/pages/ssr/static-path.js b/e2e-tests/development-runtime/src/pages/ssr/static-path.js
new file mode 100644
index 0000000000000..32c669c4337c9
--- /dev/null
+++ b/e2e-tests/development-runtime/src/pages/ssr/static-path.js
@@ -0,0 +1,29 @@
+import React from "react"
+import path from "path"
+import * as fs from "fs"
+
+export default function StaticPath({ serverData }) {
+ return (
+ Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+
+
+ )
+}
+
+export function getServerData(arg) {
+ const pkgJSON = JSON.parse(
+ fs.readFileSync(path.join(__dirname, "../../../package.json"), "utf8")
+ )
+
+ return {
+ props: {
+ version: pkgJSON.version,
+ arg,
+ },
+ }
+}
diff --git a/e2e-tests/development-runtime/src/pages/ssr/wildcard-path/[...wildcard].js b/e2e-tests/development-runtime/src/pages/ssr/wildcard-path/[...wildcard].js
new file mode 100644
index 0000000000000..9af5b2c9e2f71
--- /dev/null
+++ b/e2e-tests/development-runtime/src/pages/ssr/wildcard-path/[...wildcard].js
@@ -0,0 +1,22 @@
+import React from "react"
+
+export default function Wildcard({ serverData }) {
+ return (
+ Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+
+
+ )
+}
+
+export function getServerData(arg) {
+ return {
+ props: {
+ arg,
+ },
+ }
+}
diff --git a/e2e-tests/production-runtime/cypress/integration/redirects.js b/e2e-tests/production-runtime/cypress/integration/redirects.js
index 49229e27fa8dc..82e83350723ca 100644
--- a/e2e-tests/production-runtime/cypress/integration/redirects.js
+++ b/e2e-tests/production-runtime/cypress/integration/redirects.js
@@ -75,7 +75,7 @@ describe(`Redirects`, () => {
failOnStatusCode: false,
}).waitForRouteChange()
- cy.location(`pathname`).should(`equal`, `/redirect-search-hash/`)
+ cy.location(`pathname`).should(`equal`, `/redirect-search-hash`)
cy.location(`hash`).should(`equal`, `#anchor`)
cy.location(`search`).should(`equal`, ``)
})
@@ -96,7 +96,7 @@ describe(`Redirects`, () => {
failOnStatusCode: false,
}).waitForRouteChange()
- cy.location(`pathname`).should(`equal`, `/redirect-search-hash/`)
+ cy.location(`pathname`).should(`equal`, `/redirect-search-hash`)
cy.location(`hash`).should(`equal`, ``)
cy.location(`search`).should(`equal`, `?query_param=hello`)
})
@@ -117,7 +117,7 @@ describe(`Redirects`, () => {
failOnStatusCode: false,
}).waitForRouteChange()
- cy.location(`pathname`).should(`equal`, `/redirect-search-hash/`)
+ cy.location(`pathname`).should(`equal`, `/redirect-search-hash`)
cy.location(`hash`).should(`equal`, `#anchor`)
cy.location(`search`).should(`equal`, `?query_param=hello`)
})
diff --git a/e2e-tests/production-runtime/cypress/integration/ssr.js b/e2e-tests/production-runtime/cypress/integration/ssr.js
new file mode 100644
index 0000000000000..f191a0089cce9
--- /dev/null
+++ b/e2e-tests/production-runtime/cypress/integration/ssr.js
@@ -0,0 +1,134 @@
+const staticPath = `/ssr/static-path/`
+const paramPath = `/ssr/param-path/`
+const wildcardPath = `/ssr/wildcard-path/`
+
+describe(`Static path ('${staticPath}')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(staticPath).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(staticPath + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+
+ it(`Client navigation to same path with different query params`, () => {
+ cy.visit(staticPath).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath + `?foo=baz`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"baz"}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ cy.window()
+ .then(win => win.___navigate(staticPath))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{}`)
+ })
+})
+
+describe(`Param path ('${paramPath}:param')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(paramPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(paramPath + `foo/` + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ })
+
+ it(`Client navigation to same param path with different query params and url params`, () => {
+ cy.visit(paramPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `foo/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `baz/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"param":"baz"}`)
+ cy.window()
+ .then(win => win.___navigate(paramPath + `baz/`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"param":"baz"}`)
+ })
+})
+
+describe(`Wildcard path ('${wildcardPath}*')`, () => {
+ it(`Direct visit no query params`, () => {
+ cy.visit(wildcardPath + `foo/nested/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo/nested"}`)
+ })
+
+ it(`Direct visit with query params`, () => {
+ cy.visit(wildcardPath + `foo/nested/` + `?foo=bar`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo/nested"}`)
+ })
+
+ it(`Client navigation to same param path with different query params and url params`, () => {
+ cy.visit(wildcardPath + `foo/`).waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `foo/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"foo"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `baz/` + `?foo=bar`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{"foo":"bar"}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"baz"}`)
+ cy.window()
+ .then(win => win.___navigate(wildcardPath + `baz/`))
+ .waitForRouteChange()
+ cy.getTestElement(`query`).contains(`{}`)
+ cy.getTestElement(`params`).contains(`{"wildcard":"baz"}`)
+ })
+})
+
+describe(`500 status`, () => {
+ const errorPath = `/ssr/error-path/`
+
+ it(`Display 500 page on direct navigation`, () => {
+ cy.visit(errorPath, { failOnStatusCode: false }).waitForRouteChange()
+
+ cy.location(`pathname`)
+ .should(`equal`, errorPath)
+ .getTestElement(`500`)
+ .should(`exist`)
+ })
+
+ it(`Display 500 page on client navigation`, () => {
+ cy.visit(`/`).waitForRouteChange()
+
+ cy.window()
+ .then(win => win.___navigate(errorPath))
+ .waitForRouteChange()
+
+ cy.location(`pathname`)
+ .should(`equal`, errorPath)
+ .getTestElement(`500`)
+ .should(`exist`)
+ })
+})
diff --git a/e2e-tests/production-runtime/src/pages/500.js b/e2e-tests/production-runtime/src/pages/500.js
new file mode 100644
index 0000000000000..ef502460313d8
--- /dev/null
+++ b/e2e-tests/production-runtime/src/pages/500.js
@@ -0,0 +1,17 @@
+import * as React from "react"
+import { Link } from "gatsby"
+
+import Layout from "../components/layout"
+
+const InternalServerErrorPage = () => (
+ Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+ INTERNAL SERVER ERROR
+Page could not be displayed
+500+ + Go to Index + +
+
+ )
+}
+
+export function getServerData() {
+ throw new Error(`Some runtime error`)
+}
diff --git a/e2e-tests/production-runtime/src/pages/ssr/param-path/[param].js b/e2e-tests/production-runtime/src/pages/ssr/param-path/[param].js
new file mode 100644
index 0000000000000..af860ab139565
--- /dev/null
+++ b/e2e-tests/production-runtime/src/pages/ssr/param-path/[param].js
@@ -0,0 +1,22 @@
+import React from "react"
+
+export default function Params({ serverData }) {
+ return (
+ This will never render
+
+
+ )
+}
+
+export function getServerData(arg) {
+ return {
+ props: {
+ arg,
+ },
+ }
+}
diff --git a/e2e-tests/production-runtime/src/pages/ssr/static-path.js b/e2e-tests/production-runtime/src/pages/ssr/static-path.js
new file mode 100644
index 0000000000000..ed3265bef789f
--- /dev/null
+++ b/e2e-tests/production-runtime/src/pages/ssr/static-path.js
@@ -0,0 +1,22 @@
+import React from "react"
+
+export default function StaticPath({ serverData }) {
+ return (
+ Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+
+
+ )
+}
+
+export function getServerData(arg) {
+ return {
+ props: {
+ arg,
+ },
+ }
+}
diff --git a/e2e-tests/production-runtime/src/pages/ssr/wildcard-path/[...wildcard].js b/e2e-tests/production-runtime/src/pages/ssr/wildcard-path/[...wildcard].js
new file mode 100644
index 0000000000000..9af5b2c9e2f71
--- /dev/null
+++ b/e2e-tests/production-runtime/src/pages/ssr/wildcard-path/[...wildcard].js
@@ -0,0 +1,22 @@
+import React from "react"
+
+export default function Wildcard({ serverData }) {
+ return (
+ Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+
+
+ )
+}
+
+export function getServerData(arg) {
+ return {
+ props: {
+ arg,
+ },
+ }
+}
diff --git a/examples/README.md b/examples/README.md
index 4420e0206356f..c5a6e0db56c55 100644
--- a/examples/README.md
+++ b/examples/README.md
@@ -20,3 +20,16 @@ Complex/complete websites are for studying how to build more complex websites.
- Notifications setup to ping PRs on success/failure of build
- For `using-x` websites, link to the site from the plugin README and to the
plugin(s) from the website.
+
+## Building all the example websites
+
+There's also a bash script in this folder called `build-all-examples.sh`, which automates the process of changing into each example folder, running `npm i`, and running `gatsby build`.
+
+To execute this script, run the following commands from the terminal:
+
+```sh
+cd examples
+./build-all-examples.sh > build-results.txt
+```
+
+🚨 WARNING: This script takes a LONG time to run. (Hours.)
diff --git a/examples/build-all-examples.sh b/examples/build-all-examples.sh
new file mode 100755
index 0000000000000..10450da9b53e8
--- /dev/null
+++ b/examples/build-all-examples.sh
@@ -0,0 +1,53 @@
+#!/usr/bin/env bash
+
+# 🚨 WARNING: This script takes a LONG time to run. (Hours.)
+
+# To use this script, first run the following from the command line:
+# cd examples
+# ./build-all-examples.sh > build-results.txt
+
+# Output will be put into a new file at examples/build-results.txt
+
+# NOTE: Some of the builds will fail because the folder structure
+# for that example is different. e.g., examples/creating-source-plugins/
+# contains multiple Gatsby sites, each in their own folder.
+#
+# This script won't catch all those edge cases. It's mainly an attempt
+# to handle all the easy cases, while identifying individual failing
+# examples that need to be investigated manually.
+
+# For each directory in examples/
+for exampleDirectory in ./*/; do
+ # Debugging? Uncomment conditional below to test only 2 examples
+ # Expected behavior:
+ # - creating-source-plugins fails (since folder contains nested Gatsby sites)
+ # - client-only-paths succeeds
+ #
+ # if [[ $exampleDirectory != "./creating-source-plugins/" && $exampleDirectory != "./client-only-paths/" ]]; then
+ # continue
+ # fi
+
+ cd $exampleDirectory
+ echo "👀 CHECKING: $exampleDirectory"
+
+ echo "Installing $exampleDirectory..."
+ if npm install --no-save > /dev/null 2>&1; then
+ # --no-save flag prevents empty newline from being added to the end of package.json
+ echo "Successfully installed: $exampleDirectory"
+ else
+ echo "🚨 ERROR installing: $exampleDirectory"
+ cd ..
+ continue
+ fi
+
+ echo "Building $exampleDirectory..."
+ if gatsby build > /dev/null 2>&1; then
+ echo "✅ SUCCESS building: $exampleDirectory"
+ else
+ echo "🚨 ERROR building: $exampleDirectory"
+ fi
+
+ # Move back into the examples/ directory
+ cd ..
+
+done
diff --git a/integration-tests/artifacts/gatsby-config.js b/integration-tests/artifacts/gatsby-config.js
index e2b647bcbfc76..257509b39ed85 100644
--- a/integration-tests/artifacts/gatsby-config.js
+++ b/integration-tests/artifacts/gatsby-config.js
@@ -6,8 +6,5 @@ module.exports = {
github: `sidharthachatterjee`,
moreInfo: `Sid is amazing`,
},
- flags: {
- PRESERVE_WEBPACK_CACHE: true,
- },
plugins: [`gatsby-plugin-webpack-1`, `gatsby-plugin-webpack-2`],
}
diff --git a/integration-tests/functions/__tests__/__snapshots__/functions-dev.js.snap b/integration-tests/functions/__tests__/__snapshots__/functions-dev.js.snap
index 8a67d275d8f84..ff56c6b025dde 100644
--- a/integration-tests/functions/__tests__/__snapshots__/functions-dev.js.snap
+++ b/integration-tests/functions/__tests__/__snapshots__/functions-dev.js.snap
@@ -1,5 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`develop dynamic routes param routes 1`] = `
+Object {
+ "super": "additional",
+ "userId": "23",
+}
+`;
+
+exports[`develop dynamic routes unnamed wildcard routes 1`] = `
+Object {
+ "*": "super",
+ "0": "super",
+}
+`;
+
exports[`develop functions can parse different ways of sending data file in multipart/form 1`] = `
Array [
Object {
@@ -90,35 +104,22 @@ Object {
}
`;
-exports[`develop routing dynamic routes 1`] = `
-Object {
- "super": "additional",
- "userId": "23",
-}
-`;
-
-exports[`develop routing dynamic routes 2`] = `
-Object {
- "0": "super",
-}
-`;
-
-exports[`develop routing routes with special characters 1`] = `"I-Am-Capitalized.js"`;
+exports[`develop routes with special characters 1`] = `"I-Am-Capitalized.js"`;
-exports[`develop routing routes with special characters 2`] = `"some whitespace.js"`;
+exports[`develop routes with special characters 2`] = `"some whitespace.js"`;
-exports[`develop routing routes with special characters 3`] = `"with-äöü-umlaut.js"`;
+exports[`develop routes with special characters 3`] = `"with-äöü-umlaut.js"`;
-exports[`develop routing routes with special characters 4`] = `"some-àè-french.js"`;
+exports[`develop routes with special characters 4`] = `"some-àè-french.js"`;
-exports[`develop routing routes with special characters 5`] = `"some-אודות.js"`;
+exports[`develop routes with special characters 5`] = `"some-אודות.js"`;
-exports[`develop routing secondary-level API 1`] = `"I am at a secondary-level"`;
+exports[`develop secondary-level API 1`] = `"I am at a secondary-level"`;
-exports[`develop routing secondary-level API 2`] = `"I am another sub-directory function"`;
+exports[`develop secondary-level API 2`] = `"I am another sub-directory function"`;
-exports[`develop routing secondary-level API with index.js 1`] = `"I am an index.js in a sub-directory!"`;
+exports[`develop secondary-level API with index.js 1`] = `"I am an index.js in a sub-directory!"`;
-exports[`develop routing top-level API 1`] = `"I am at the top-level"`;
+exports[`develop top-level API 1`] = `"I am at the top-level"`;
exports[`develop typescript typescript functions work 1`] = `"I am typescript"`;
diff --git a/integration-tests/functions/__tests__/__snapshots__/functions-prod.js.snap b/integration-tests/functions/__tests__/__snapshots__/functions-prod.js.snap
index d46bdd617bc45..72ee383760b68 100644
--- a/integration-tests/functions/__tests__/__snapshots__/functions-prod.js.snap
+++ b/integration-tests/functions/__tests__/__snapshots__/functions-prod.js.snap
@@ -1,5 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`production dynamic routes param routes 1`] = `
+Object {
+ "super": "additional",
+ "userId": "23",
+}
+`;
+
+exports[`production dynamic routes unnamed wildcard routes 1`] = `
+Object {
+ "*": "super",
+ "0": "super",
+}
+`;
+
exports[`production functions can parse different ways of sending data file in multipart/form 1`] = `
Array [
Object {
@@ -86,35 +100,22 @@ Object {
}
`;
-exports[`production routing dynamic routes 1`] = `
-Object {
- "super": "additional",
- "userId": "23",
-}
-`;
-
-exports[`production routing dynamic routes 2`] = `
-Object {
- "0": "super",
-}
-`;
-
-exports[`production routing routes with special characters 1`] = `"I-Am-Capitalized.js"`;
+exports[`production routes with special characters 1`] = `"I-Am-Capitalized.js"`;
-exports[`production routing routes with special characters 2`] = `"some whitespace.js"`;
+exports[`production routes with special characters 2`] = `"some whitespace.js"`;
-exports[`production routing routes with special characters 3`] = `"with-äöü-umlaut.js"`;
+exports[`production routes with special characters 3`] = `"with-äöü-umlaut.js"`;
-exports[`production routing routes with special characters 4`] = `"some-àè-french.js"`;
+exports[`production routes with special characters 4`] = `"some-àè-french.js"`;
-exports[`production routing routes with special characters 5`] = `"some-אודות.js"`;
+exports[`production routes with special characters 5`] = `"some-אודות.js"`;
-exports[`production routing secondary-level API 1`] = `"I am at a secondary-level"`;
+exports[`production secondary-level API 1`] = `"I am at a secondary-level"`;
-exports[`production routing secondary-level API 2`] = `"I am another sub-directory function"`;
+exports[`production secondary-level API 2`] = `"I am another sub-directory function"`;
-exports[`production routing secondary-level API with index.js 1`] = `"I am an index.js in a sub-directory!"`;
+exports[`production secondary-level API with index.js 1`] = `"I am an index.js in a sub-directory!"`;
-exports[`production routing top-level API 1`] = `"I am at the top-level"`;
+exports[`production top-level API 1`] = `"I am at the top-level"`;
exports[`production typescript typescript functions work 1`] = `"I am typescript"`;
diff --git a/integration-tests/functions/gatsby-config.js b/integration-tests/functions/gatsby-config.js
index 445d1dbc7e60c..8436e938e9234 100644
--- a/integration-tests/functions/gatsby-config.js
+++ b/integration-tests/functions/gatsby-config.js
@@ -1,6 +1,5 @@
module.exports = {
flags: {
- FUNCTIONS: true,
DEV_SSR: true,
},
siteMetadata: {
diff --git a/integration-tests/functions/src/api/named-wildcard/[...foo].js b/integration-tests/functions/src/api/named-wildcard/[...foo].js
new file mode 100644
index 0000000000000..c585268295a4e
--- /dev/null
+++ b/integration-tests/functions/src/api/named-wildcard/[...foo].js
@@ -0,0 +1,3 @@
+export default function (req, res) {
+ res.json(req.params)
+}
diff --git a/integration-tests/functions/test-helpers.js b/integration-tests/functions/test-helpers.js
index 2951738b6f440..665697864460d 100644
--- a/integration-tests/functions/test-helpers.js
+++ b/integration-tests/functions/test-helpers.js
@@ -7,63 +7,79 @@ const FormData = require("form-data")
export function runTests(env, host) {
describe(env, () => {
- describe(`routing`, () => {
- test(`top-level API`, async () => {
- const result = await fetch(`${host}/api/top-level`).then(res =>
- res.text()
- )
+ test(`top-level API`, async () => {
+ const result = await fetch(`${host}/api/top-level`).then(res =>
+ res.text()
+ )
- expect(result).toMatchSnapshot()
- })
- test(`secondary-level API`, async () => {
- const result = await fetch(
- `${host}/api/a-directory/function`
- ).then(res => res.text())
+ expect(result).toMatchSnapshot()
+ })
+ test(`secondary-level API`, async () => {
+ const result = await fetch(`${host}/api/a-directory/function`).then(res =>
+ res.text()
+ )
- expect(result).toMatchSnapshot()
- })
- test(`secondary-level API with index.js`, async () => {
- const result = await fetch(`${host}/api/a-directory`).then(res =>
- res.text()
- )
+ expect(result).toMatchSnapshot()
+ })
+ test(`secondary-level API with index.js`, async () => {
+ const result = await fetch(`${host}/api/a-directory`).then(res =>
+ res.text()
+ )
- expect(result).toMatchSnapshot()
- })
- test(`secondary-level API`, async () => {
- const result = await fetch(`${host}/api/dir/function`).then(res =>
- res.text()
- )
+ expect(result).toMatchSnapshot()
+ })
+ test(`secondary-level API`, async () => {
+ const result = await fetch(`${host}/api/dir/function`).then(res =>
+ res.text()
+ )
+
+ expect(result).toMatchSnapshot()
+ })
+
+ test(`routes with special characters`, async () => {
+ const routes = [
+ `${host}/api/I-Am-Capitalized`,
+ `${host}/api/some whitespace`,
+ `${host}/api/with-äöü-umlaut`,
+ `${host}/api/some-àè-french`,
+ encodeURI(`${host}/api/some-אודות`),
+ ]
+
+ for (const route of routes) {
+ const result = await fetch(route).then(res => res.text())
expect(result).toMatchSnapshot()
- })
- test(`routes with special characters`, async () => {
- const routes = [
- `${host}/api/I-Am-Capitalized`,
- `${host}/api/some whitespace`,
- `${host}/api/with-äöü-umlaut`,
- `${host}/api/some-àè-french`,
- encodeURI(`${host}/api/some-אודות`),
- ]
+ }
+ })
+
+ describe(`dynamic routes`, () => {
+ test(`param routes`, async () => {
+ const routes = [`${host}/api/users/23/additional`]
for (const route of routes) {
- const result = await fetch(route).then(res => res.text())
+ const result = await fetch(route).then(res => res.json())
expect(result).toMatchSnapshot()
}
})
-
- test(`dynamic routes`, async () => {
- const routes = [
- `${host}/api/users/23/additional`,
- `${host}/api/dir/super`,
- ]
-
+ test(`unnamed wildcard routes`, async () => {
+ const routes = [`${host}/api/dir/super`]
for (const route of routes) {
const result = await fetch(route).then(res => res.json())
expect(result).toMatchSnapshot()
}
})
+ test(`named wildcard routes`, async () => {
+ const route = `${host}/api/named-wildcard/super`
+ const result = await fetch(route).then(res => res.json())
+
+ expect(result).toMatchInlineSnapshot(`
+ Object {
+ "foo": "super",
+ }
+ `)
+ })
})
describe(`environment variables`, () => {
diff --git a/integration-tests/gatsby-cli/__tests__/build.js b/integration-tests/gatsby-cli/__tests__/build.js
index 724150a93662a..e31a54dee070a 100644
--- a/integration-tests/gatsby-cli/__tests__/build.js
+++ b/integration-tests/gatsby-cli/__tests__/build.js
@@ -25,7 +25,6 @@ describe(`gatsby build`, () => {
logs.should.contain(`success createPages`)
logs.should.contain(`success createPagesStatefully`)
logs.should.contain(`success onPreExtractQueries`)
- logs.should.contain(`success update schema`)
logs.should.contain(`success extract queries from components`)
logs.should.contain(`success write out requires`)
logs.should.contain(`success write out redirect data`)
diff --git a/integration-tests/gatsby-cli/__tests__/develop.js b/integration-tests/gatsby-cli/__tests__/develop.js
index 47e62188fc504..db41335abe2f7 100644
--- a/integration-tests/gatsby-cli/__tests__/develop.js
+++ b/integration-tests/gatsby-cli/__tests__/develop.js
@@ -39,7 +39,6 @@ describe(`gatsby develop`, () => {
logs.should.contain(`success createPages`)
logs.should.contain(`success createPagesStatefully`)
logs.should.contain(`success onPreExtractQueries`)
- logs.should.contain(`success update schema`)
logs.should.contain(`success extract queries from components`)
logs.should.contain(`success write out requires`)
logs.should.contain(`success write out redirect data`)
diff --git a/integration-tests/gatsby-cli/__tests__/repl.js b/integration-tests/gatsby-cli/__tests__/repl.js
index 203345e364c49..9eec28120ea7f 100644
--- a/integration-tests/gatsby-cli/__tests__/repl.js
+++ b/integration-tests/gatsby-cli/__tests__/repl.js
@@ -34,7 +34,6 @@ describe(`gatsby repl`, () => {
logs.should.contain(`success createPages`)
logs.should.contain(`success createPagesStatefully`)
logs.should.contain(`success onPreExtractQueries`)
- logs.should.contain(`success update schema`)
logs.should.contain(`success extract queries from components`)
logs.should.contain(`success write out redirect data`)
logs.should.contain(`success onPostBootstrap`)
diff --git a/integration-tests/gatsby-source-wordpress/__tests__/__snapshots__/index.js.snap b/integration-tests/gatsby-source-wordpress/__tests__/__snapshots__/index.js.snap
index 28df70c637a56..3a3037af00f00 100644
--- a/integration-tests/gatsby-source-wordpress/__tests__/__snapshots__/index.js.snap
+++ b/integration-tests/gatsby-source-wordpress/__tests__/__snapshots__/index.js.snap
@@ -1,53 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`[gatsby-source-wordpress] Run tests on develop build Gatsby image processing transforms inline-html images properly 1`] = `
-"Query
+{JSON.stringify(serverData?.arg?.query)}
+ Params
+{JSON.stringify(serverData?.arg?.params)}
+ Debug
+{JSON.stringify({ serverData }, null, 2)}
+ Wysiwyh Editor Field test content.
--
H1
--" -`; - exports[`[gatsby-source-wordpress] Run tests on develop build data resolution resolves correct number of nodes 1`] = ` Array [ Object { diff --git a/integration-tests/gatsby-source-wordpress/gatsby-config.js b/integration-tests/gatsby-source-wordpress/gatsby-config.js index 7c1f214ab9caf..17166e55442f5 100644 --- a/integration-tests/gatsby-source-wordpress/gatsby-config.js +++ b/integration-tests/gatsby-source-wordpress/gatsby-config.js @@ -65,13 +65,6 @@ const wpPluginOptions = !process.env.DEFAULT_PLUGIN_OPTIONS 50 : // and we don't actually need more than 1000 in production 1000, - - beforeChangeNode: ({ remoteNode }) => { - console.log(`Hi from an inline fn!`) - remoteNode.beforeChangeNodeTest = `TEST-${remoteNode.id}` - - return remoteNode - }, }, // excluding this because it causes Gatsby to throw errors BlockEditorContentNode: { exclude: true }, diff --git a/integration-tests/gatsby-source-wordpress/package.json b/integration-tests/gatsby-source-wordpress/package.json index cafc0b6f5ebb6..ae4d9268f2430 100644 --- a/integration-tests/gatsby-source-wordpress/package.json +++ b/integration-tests/gatsby-source-wordpress/package.json @@ -17,6 +17,7 @@ "gatsby-source-filesystem": "next", "gatsby-source-wordpress": "next", "gatsby-transformer-sharp": "next", + "gatsby-plugin-image": "next", "react": "^17.0.2", "react-dom": "^17.0.2" }, diff --git a/integration-tests/gatsby-source-wordpress/test-fns/data-resolution.js b/integration-tests/gatsby-source-wordpress/test-fns/data-resolution.js index 6696ca4e164ad..ee7736045c3d4 100644 --- a/integration-tests/gatsby-source-wordpress/test-fns/data-resolution.js +++ b/integration-tests/gatsby-source-wordpress/test-fns/data-resolution.js @@ -231,14 +231,6 @@ describe(`data resolution`, () => { beforeChangeNodeTest } } - # inline fn in gatsby-config.js - # support for this will be removed in future versions - allWpPost { - nodes { - id - beforeChangeNodeTest - } - } } `, }) @@ -246,9 +238,6 @@ describe(`data resolution`, () => { result.data.allWpPage.nodes.forEach(node => { expect(node.beforeChangeNodeTest).toBe(`TEST-${node.id}`) }) - result.data.allWpPost.nodes.forEach(node => { - expect(node.beforeChangeNodeTest).toBe(`TEST-${node.id}`) - }) }) it(`resolves root fields`, async () => { diff --git a/integration-tests/gatsby-source-wordpress/test-fns/gatsby-image.js b/integration-tests/gatsby-source-wordpress/test-fns/gatsby-image.js index dd6a7d577f3f5..d36d488204e2d 100644 --- a/integration-tests/gatsby-source-wordpress/test-fns/gatsby-image.js +++ b/integration-tests/gatsby-source-wordpress/test-fns/gatsby-image.js @@ -5,68 +5,25 @@ const { const execall = require("execall") const countGatsbyImgs = string => - // divide by 2 because we now have two classes gatsby-image-wrapper and inline-gatsby-image-wrapper - execall(/gatsby-image-wrapper/gim, string).length / 2 + execall(/[^-]gatsby-image-wrapper[^-]/gim, string).length describe(`Gatsby image processing`, () => { it(`transforms inline-html images properly`, async () => { const { - data: { - // wpPage, - // gute, - // editedInline, - // editedMediaLibrary, - acfPage, - // httpProtocolPage, - }, + data: { acfPage }, } = await fetchGraphql({ url: `http://localhost:8000/__graphql`, query: /* GraphQL */ ` { - # Inline gatsby-image Gutenberg test #8964 - # wpPage(id: { eq: "cG9zdDo4OTY0" }) { - # content - # } - # edited Inline gatsby-image test - # editedInline: wpPage(databaseId: { eq: 9208 }) { - # content - # } - # edited via media library Inline gatsby-image test - # editedMediaLibrary: wpPage(databaseId: { eq: 9219 }) { - # content - # } - # inline html ACF test acfPage: wpPage(databaseId: { eq: 7646 }) { acfPageFields { wysiwygEditorField } } - # Page with img src hardcoded to http isntead of https - # httpProtocolPage: wpPage(databaseId: { eq: 10513 }) { - # content - # } } `, }) - - // expect(wpPage.content).toBeTruthy() - // expect(countGatsbyImgs(wpPage.content)).toBe(2) - // expect(wpPage.content).toMatchSnapshot() - - // expect(editedInline.content).toBeTruthy() - // expect(countGatsbyImgs(editedInline.content)).toBe(1) - // expect(editedInline.content).toMatchSnapshot() - - // expect(editedMediaLibrary.content).toBeTruthy() - // expect(countGatsbyImgs(editedMediaLibrary.content)).toBe(1) - // expect(editedMediaLibrary.content).toMatchSnapshot() - expect(acfPage.acfPageFields.wysiwygEditorField).toBeTruthy() expect(countGatsbyImgs(acfPage.acfPageFields.wysiwygEditorField)).toBe(2) - expect(acfPage.acfPageFields.wysiwygEditorField).toMatchSnapshot() - - // expect(httpProtocolPage.content).toBeTruthy() - // expect(countGatsbyImgs(httpProtocolPage.content)).toBe(1) - // expect(httpProtocolPage.content).toMatchSnapshot() }) }) diff --git a/integration-tests/long-term-caching/__tests__/long-term-caching.js b/integration-tests/long-term-caching/__tests__/long-term-caching.js index d66098e4a2986..1325237caa23f 100644 --- a/integration-tests/long-term-caching/__tests__/long-term-caching.js +++ b/integration-tests/long-term-caching/__tests__/long-term-caching.js @@ -59,7 +59,8 @@ describe(`long term caching`, () => { const indexPath = `${rootPath}/src/pages/index.js` const data = await readFile(indexPath, `utf8`) - const import1 = `import gray from "gray-percentage"` + // unused imports are removed, so we need to use it somehow + const import1 = `import gray from "gray-percentage"\nconsole.log(gray)` const modifiedData = `${import1}\n${data}` await writeFile(`${pagesPath}/index.js`, modifiedData) diff --git a/package.json b/package.json index f8c69fd499652..80e10b9b97c92 100644 --- a/package.json +++ b/package.json @@ -26,8 +26,8 @@ "@types/signal-exit": "^3.0.0", "@types/stack-trace": "^0.0.29", "@types/webpack-merge": "^4.1.5", - "@typescript-eslint/eslint-plugin": "^4.29.3", - "@typescript-eslint/parser": "^4.29.3", + "@typescript-eslint/eslint-plugin": "^4.33.0", + "@typescript-eslint/parser": "^4.33.0", "babel-jest": "^24.9.0", "chalk": "^4.1.2", "chokidar": "^3.5.2", @@ -39,11 +39,11 @@ "eslint-config-google": "^0.14.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-filenames": "^1.3.2", - "eslint-plugin-flowtype": "^5.9.2", + "eslint-plugin-flowtype": "^6.1.0", "eslint-plugin-import": "^2.24.2", "eslint-plugin-jsx-a11y": "^6.4.1", - "eslint-plugin-prettier": "^3.4.1", - "eslint-plugin-react": "^7.25.1", + "eslint-plugin-prettier": "^4.0.0", + "eslint-plugin-react": "^7.26.1", "fs-extra": "^10.0.0", "glob": "^7.1.7", "husky": "3.1.0", @@ -63,7 +63,7 @@ "npm-packlist": "^2.1.5", "npm-run-all": "4.1.5", "plop": "^1.9.1", - "prettier": "2.3.2", + "prettier": "2.4.1", "remark": "^13.0.0", "remark-cli": "^9.0.0", "remark-frontmatter": "^3.0.0", @@ -87,7 +87,7 @@ "rimraf": "^3.0.2", "svgo": "1.3.2", "ts-jest": "^22", - "typescript": "^4.3.5", + "typescript": "^4.4.3", "unified": "^9.2.0", "yargs": "^15.4.1" }, @@ -130,7 +130,7 @@ "lerna": "lerna", "lerna-prepare": "lerna run prepare", "lint": "npm-run-all --continue-on-error -p lint:code lint:docs lint:other", - "lint:code": "eslint --ext .js,.jsx,.ts,.tsx .", + "lint:code": "eslint --ext .js,.jsx,.ts,.tsx --quiet .", "lint:docs": "remark docs/{contributing,docs,tutorial}", "lint:other": "npm run prettier -- --check", "lint:scripts": "sh scripts/lint-shell-scripts.sh", diff --git a/packages/babel-plugin-remove-graphql-queries/package.json b/packages/babel-plugin-remove-graphql-queries/package.json index 608965f295cba..8ff87b7703735 100644 --- a/packages/babel-plugin-remove-graphql-queries/package.json +++ b/packages/babel-plugin-remove-graphql-queries/package.json @@ -1,6 +1,6 @@ { "name": "babel-plugin-remove-graphql-queries", - "version": "4.0.0-zz-next.1", + "version": "4.0.0-zz-next.3", "author": "Jason Quense
![\\"\\"](\\"/static/72f3bac64c682555d9ad2ecceaffe51e/ab49a/1001-5616%C3%973744.jpg)
![\\"\\"](\\"/static/512103aa3c375068e3cb8426fe74d180/76112/1003-1181%C3%971772.jpg)
Example: A screenshot made on a retina screen with a resolution of 144 (e.g. Macbook) and a width of 100px, will be rendered at 50px. | -| `wrapperStyle` | | Add custom styles to the div wrapping the responsive images. Use regular CSS syntax, e.g. `margin-bottom:10px; background: red;` | -| `backgroundColor` | `white` | Set the background color of the image to match the background of your design | -| `withWebp` | `false` | Additionally generate WebP versions alongside your chosen file format. They are added as a srcset with the appropriate mimetype and will be loaded in browsers that support the format. | -| `loading` | `lazy` | Set the browser's native lazy loading attribute. One of `lazy`, `eager` or `auto`. | +| Name | Default | Description | +| ---------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `maxWidth` | `650` | The `maxWidth` in pixels of the `div` where the markdown will be displayed. This value is used when deciding what the width of the various responsive thumbnails should be. | +| `linkImagesToOriginal` | `true` | Add a link to each image to the original image. Sometimes people want to see a full-sized version of an image e.g. to see extra detail on a part of the image and this is a convenient and common pattern for enabling this. Set this option to false to disable this behavior. | +| `showCaptions` | `false` | Add a caption to each image with the contents of the title attribute, when this is not empty. Set this option to true to enable this behavior. | +| `wrapperStyle` | | Add custom styles to the div wrapping the responsive images. Use regular CSS syntax, e.g. `margin-bottom:10px; background: red;` | +| `backgroundColor` | `white` | Set the background color of the image to match the background of your design | +| `withWebp` | `false` | Additionally generate WebP versions alongside your chosen file format. They are added as a srcset with the appropriate mimetype and will be loaded in browsers that support the format. | +| `loading` | `lazy` | Set the browser's native lazy loading attribute. One of `lazy`, `eager` or `auto`. | ## Troubleshooting diff --git a/packages/gatsby-remark-images-contentful/package.json b/packages/gatsby-remark-images-contentful/package.json index 475891fed6368..4560ae2bfb0f7 100644 --- a/packages/gatsby-remark-images-contentful/package.json +++ b/packages/gatsby-remark-images-contentful/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-remark-images-contentful", - "version": "5.0.0-zz-next.1", + "version": "5.0.0-zz-next.4", "description": "Process Images in Contentful markdown so they can use the images API.", "main": "index.js", "scripts": { @@ -22,13 +22,13 @@ "is-relative-url": "^3.0.0", "lodash": "^4.17.21", "semver": "^7.3.5", - "sharp": "^0.29.0", + "sharp": "^0.29.1", "unist-util-select": "^3.0.4" }, "devDependencies": { "@babel/cli": "^7.15.4", "@babel/core": "^7.15.5", - "babel-preset-gatsby-package": "^2.0.0-zz-next.1", + "babel-preset-gatsby-package": "^2.0.0-zz-next.2", "cross-env": "^7.0.3" }, "keywords": [ diff --git a/packages/gatsby-remark-images-contentful/src/utils/index.js b/packages/gatsby-remark-images-contentful/src/utils/index.js index 3a3d65c3ce039..5a23c0c5d7858 100644 --- a/packages/gatsby-remark-images-contentful/src/utils/index.js +++ b/packages/gatsby-remark-images-contentful/src/utils/index.js @@ -30,14 +30,10 @@ const buildResponsiveSizes = async ( ) const { width, height, density } = metadata - const { sizeByPixelDensity, maxWidth, sizes } = options + const { maxWidth, sizes } = options const aspectRatio = width / height - const pixelRatio = - sizeByPixelDensity && typeof density === `number` && density > 0 - ? density / 72 - : 1 - const presentationWidth = Math.min(maxWidth, Math.round(width / pixelRatio)) + const presentationWidth = Math.min(maxWidth, width) const presentationHeight = Math.round(presentationWidth * (height / width)) const sizesQuery = sizes || `(max-width: ${presentationWidth}px) 100vw, ${presentationWidth}px` diff --git a/packages/gatsby-remark-images/README.md b/packages/gatsby-remark-images/README.md index 4e3a85f1a2093..bb2bbe7c1d288 100644 --- a/packages/gatsby-remark-images/README.md +++ b/packages/gatsby-remark-images/README.md @@ -65,7 +65,6 @@ a reserved keyword `GATSBY_EMPTY_ALT` can be used. | `linkImagesToOriginal` | `true` | Add a link to each image to the original image. Sometimes people want to see a full-sized version of an image e.g. to see extra detail on a part of the image and this is a convenient and common pattern for enabling this. Set this option to `false` to disable this behavior. | | `showCaptions` | `false` | Add a caption to each image with the contents of the title attribute, when this is not empty. If the title attribute is empty but the alt attribute is not, it will be used instead. Set this option to true to enable this behavior. You can also pass an array instead to specify which value should be used for the caption — for example, passing `['alt', 'title']` would use the alt attribute first, and then the title. When this is set to `true` it is the same as passing `['title', 'alt']`. If you just want to use the title (and omit captions for images that have alt attributes but no title), pass `['title']`. | | `markdownCaptions` | `false` | Parse the caption as markdown instead of raw text. Ignored if `showCaptions` is `false`. | -| `sizeByPixelDensity` | `false` | [deprecated] Pixel density is only used in vector images, which Gatsby’s implementation of Sharp doesn’t support. This option is currently a no-op and will be removed in the next major version of Gatsby. | | `wrapperStyle` | | Add custom styles to the div wrapping the responsive images. Use the syntax for the style attribute e.g. `margin-bottom:10px; background: red;` or a function returning a style string which receives the information about the image you can use to dynamically set styles based on the `aspectRatio` for example. | | `backgroundColor` | `white` | Set the background color of the image to match the background image of your design.
**Note:**
- set this option to `transparent` for a transparent image background.
- set this option to `none` to completely remove the image background. | | `quality` | `50` | The quality level of the generated files. | diff --git a/packages/gatsby-remark-images/package.json b/packages/gatsby-remark-images/package.json index 1fc8a11379766..10876708da1ca 100644 --- a/packages/gatsby-remark-images/package.json +++ b/packages/gatsby-remark-images/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-remark-images", "description": "Processes images in markdown so they can be used in the production build.", - "version": "6.0.0-zz-next.1", + "version": "6.0.0-zz-next.4", "author": "Kyle Mathews
{bodyRichText && renderRichText(richTextField, options)}
+ return {bodyRichText && renderRichText(bodyRichText, options)}
}
```
+**Note:** The `contentful_id` field must be queried on rich-text references in order for the `renderNode` to receive the correct data.
+
### Embedding an image in a Rich Text field
**Import**
diff --git a/packages/gatsby-source-contentful/package.json b/packages/gatsby-source-contentful/package.json
index 884df53e6789e..b95cdfa88ae54 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": "6.0.0-zz-next.1",
+ "version": "6.0.0-zz-next.5",
"author": "Marcus Ericsson ${JSON.stringify(
+ gatsbyImageHydrationData
+ )}`
+ }
// need to remove the JSON stringify quotes around our image since we're
// threading this JSON string back into a larger JSON object string
+ const gatsbyImageStringJSON = JSON.stringify(gatsbyImageStringRaw)
const gatsbyImageString = gatsbyImageStringJSON.substring(
1,
gatsbyImageStringJSON.length - 1
diff --git a/packages/gatsby-source-wordpress/src/utils/run-steps.ts b/packages/gatsby-source-wordpress/src/utils/run-steps.ts
index 26814fad144a0..84ac24f280536 100644
--- a/packages/gatsby-source-wordpress/src/utils/run-steps.ts
+++ b/packages/gatsby-source-wordpress/src/utils/run-steps.ts
@@ -72,6 +72,42 @@ const runSteps = async (
}
}
+/**
+ * Takes in a pipe delimited string of Gatsby Node API names and returns the first supported API name as a string
+ *
+ * Example input: "onPluginInit|unstable_onPluginInit"
+ * Example output: "unstable_onPluginInit"
+ */
+const findApiName = (initialApiNameString: string): string => {
+ if (!initialApiNameString.includes(`|`)) {
+ return initialApiNameString
+ }
+
+ const potentialApiNames = initialApiNameString.split(`|`)
+
+ try {
+ const { isGatsbyNodeLifecycleSupported } = require(`gatsby-plugin-utils`)
+
+ for (const apiName of potentialApiNames) {
+ if (isGatsbyNodeLifecycleSupported(apiName)) {
+ return apiName
+ }
+ }
+ } catch (e) {
+ console.error(
+ `Could not check if Gatsby supports node API's [${potentialApiNames.join(
+ `, `
+ )}]. Trying to use the first available API name (${potentialApiNames[0]})`
+ )
+
+ return potentialApiNames[0]
+ }
+
+ throw new Error(
+ `Couldn't find any supported Gatsby Node API's in ${initialApiNameString}`
+ )
+}
+
const runApiSteps =
(steps: Array, apiName: string) =>
async (
@@ -85,12 +121,14 @@ const runApisInSteps = (nodeApis: {
}): { [apiName: string]: Promise | void } =>
Object.entries(nodeApis).reduce(
(gatsbyNodeExportObject, [apiName, apiSteps]) => {
+ const normalizedApiName = findApiName(apiName)
+
return {
...gatsbyNodeExportObject,
- [apiName]:
+ [normalizedApiName]:
typeof apiSteps === `function`
? apiSteps
- : runApiSteps(apiSteps, apiName),
+ : runApiSteps(apiSteps, normalizedApiName),
}
},
{}
diff --git a/packages/gatsby-source-wordpress/style.css b/packages/gatsby-source-wordpress/style.css
deleted file mode 100644
index c96b2b814dae0..0000000000000
--- a/packages/gatsby-source-wordpress/style.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.inline-gatsby-image-wrapper,
-.inline-gatsby-image-wrapper span {
- display: inline-block;
-}
diff --git a/packages/gatsby-source-wordpress/tsconfig.json b/packages/gatsby-source-wordpress/tsconfig.json
index 4f71aed7d8842..db20ac0d1dfe4 100644
--- a/packages/gatsby-source-wordpress/tsconfig.json
+++ b/packages/gatsby-source-wordpress/tsconfig.json
@@ -5,8 +5,9 @@
"~/*": ["*"]
},
"lib": ["ESNext", "DOM"],
- "target": "ES6",
+ "target": "ESNext",
"moduleResolution": "node",
+ "module": "ESNext",
"allowSyntheticDefaultImports": true,
"skipLibCheck": true
},
diff --git a/packages/gatsby-telemetry/package.json b/packages/gatsby-telemetry/package.json
index 5dd8e4a76eb0f..70de73a5fcc5b 100644
--- a/packages/gatsby-telemetry/package.json
+++ b/packages/gatsby-telemetry/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-telemetry",
"description": "Gatsby Telemetry",
- "version": "3.0.0-zz-next.1",
+ "version": "3.0.0-zz-next.3",
"author": "Jarmo Isotalo ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -15,24 +15,23 @@
"boxen": "^4.2.0",
"configstore": "^5.0.1",
"fs-extra": "^10.0.0",
- "gatsby-core-utils": "^3.0.0-zz-next.1",
+ "gatsby-core-utils": "^3.0.0-zz-next.3",
"git-up": "^4.0.5",
"is-docker": "^2.2.1",
"lodash": "^4.17.21",
- "node-fetch": "^2.6.1",
- "uuid": "3.4.0"
+ "node-fetch": "^2.6.1"
},
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
"babel-jest": "^24.9.0",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"jest": "^24.9.0",
"jest-cli": "^24.9.0",
"jest-junit": "^6.4.0",
"rimraf": "^3.0.2",
- "typescript": "^4.3.5"
+ "typescript": "^4.4.3"
},
"files": [
"lib/",
diff --git a/packages/gatsby-telemetry/src/__tests__/telemetry.ts b/packages/gatsby-telemetry/src/__tests__/telemetry.ts
index 968b8b8cab964..6bf57b5c5ba5c 100644
--- a/packages/gatsby-telemetry/src/__tests__/telemetry.ts
+++ b/packages/gatsby-telemetry/src/__tests__/telemetry.ts
@@ -1,10 +1,13 @@
-jest.mock(`../event-storage`)
import { EventStorage } from "../event-storage"
import { AnalyticsTracker } from "../telemetry"
import * as fs from "fs-extra"
import * as os from "os"
import * as path from "path"
-import uuidv4 from "uuid/v4"
+import { uuid } from "gatsby-core-utils"
+
+const uuidv4 = uuid.v4
+
+jest.mock(`../event-storage`)
let telemetry
beforeEach(() => {
diff --git a/packages/gatsby-telemetry/src/in-memory-store.ts b/packages/gatsby-telemetry/src/in-memory-store.ts
index ec4ead3fc611c..c69841021310e 100644
--- a/packages/gatsby-telemetry/src/in-memory-store.ts
+++ b/packages/gatsby-telemetry/src/in-memory-store.ts
@@ -1,4 +1,4 @@
-import uuidv4 from "uuid/v4"
+import { uuid } from "gatsby-core-utils"
import os from "os"
import { join } from "path"
@@ -13,7 +13,7 @@ export class InMemoryConfigStore {
createBaseConfig(): Record {
return {
"telemetry.enabled": true,
- "telemetry.machineId": `not-a-machine-id-${uuidv4()}`,
+ "telemetry.machineId": `not-a-machine-id-${uuid.v4()}`,
}
}
diff --git a/packages/gatsby-telemetry/src/telemetry.ts b/packages/gatsby-telemetry/src/telemetry.ts
index 7b875aabe90bd..0ccbc85fc0885 100644
--- a/packages/gatsby-telemetry/src/telemetry.ts
+++ b/packages/gatsby-telemetry/src/telemetry.ts
@@ -1,4 +1,3 @@
-import uuidv4 from "uuid/v4"
import * as fs from "fs-extra"
import os from "os"
import {
@@ -6,6 +5,7 @@ import {
getCIName,
createContentDigest,
getTermProgram,
+ uuid,
} from "gatsby-core-utils"
import {
getRepositoryId as _getRepositoryId,
@@ -20,7 +20,7 @@ import { getDependencies } from "./get-dependencies"
import isDocker from "is-docker"
import lodash from "lodash"
-const typedUUIDv4 = uuidv4 as () => string
+const typedUUIDv4 = uuid.v4 as () => string
const finalEventRegex = /(END|STOP)$/
const dbEngine = `redux`
@@ -181,7 +181,7 @@ export class AnalyticsTracker {
if (inherited) {
p.gatsbyTelemetrySessionId = inherited
} else {
- p.gatsbyTelemetrySessionId = uuidv4()
+ p.gatsbyTelemetrySessionId = uuid.v4()
process.env.INTERNAL_GATSBY_TELEMETRY_SESSION_ID =
p.gatsbyTelemetrySessionId
}
diff --git a/packages/gatsby-transformer-asciidoc/package.json b/packages/gatsby-transformer-asciidoc/package.json
index 5ced40035d3c0..0ab4cadee8a60 100644
--- a/packages/gatsby-transformer-asciidoc/package.json
+++ b/packages/gatsby-transformer-asciidoc/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-asciidoc",
"description": "Gatsby transformer plugin for Asciidocs using the Asciidoctor.js library",
- "version": "3.0.0-zz-next.1",
+ "version": "3.0.0-zz-next.2",
"author": "Daniel Oliver ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -13,7 +13,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"lodash": "^4.17.21"
},
diff --git a/packages/gatsby-transformer-csv/package.json b/packages/gatsby-transformer-csv/package.json
index 8b668465252ed..9776409804872 100644
--- a/packages/gatsby-transformer-csv/package.json
+++ b/packages/gatsby-transformer-csv/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-csv",
"description": "Gatsby transformer plugin for CSV files",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Sonal Saldanha ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -13,7 +13,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"json2csv": "^5.0.6"
},
diff --git a/packages/gatsby-transformer-documentationjs/package.json b/packages/gatsby-transformer-documentationjs/package.json
index 3d92b400d2111..a543016bea271 100644
--- a/packages/gatsby-transformer-documentationjs/package.json
+++ b/packages/gatsby-transformer-documentationjs/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-documentationjs",
"description": "Gatsby transformer plugin which uses Documentation.js to extract JavaScript documentation",
- "version": "6.0.0-zz-next.1",
+ "version": "6.0.0-zz-next.2",
"author": "Kyle Mathews",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,7 +14,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-documentationjs#readme",
diff --git a/packages/gatsby-transformer-excel/package.json b/packages/gatsby-transformer-excel/package.json
index a4346d56d79f5..367782efc3329 100644
--- a/packages/gatsby-transformer-excel/package.json
+++ b/packages/gatsby-transformer-excel/package.json
@@ -1,19 +1,19 @@
{
"name": "gatsby-transformer-excel",
"description": "Gatsby transformer plugin for Excel spreadsheets",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.3",
"author": "SheetJS ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
},
"dependencies": {
"@babel/runtime": "^7.15.4",
- "xlsx": "^0.17.0"
+ "xlsx": "^0.17.1"
},
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-excel#readme",
diff --git a/packages/gatsby-transformer-hjson/package.json b/packages/gatsby-transformer-hjson/package.json
index e491e5b839352..1a81e83f77943 100644
--- a/packages/gatsby-transformer-hjson/package.json
+++ b/packages/gatsby-transformer-hjson/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-hjson",
"description": "Gatsby transformer plugin for HJSON files",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Remi Barraquand ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,7 +14,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-hjson#readme",
diff --git a/packages/gatsby-transformer-javascript-frontmatter/package.json b/packages/gatsby-transformer-javascript-frontmatter/package.json
index 0c47e38c86d92..5bfbe6fb5ef5a 100644
--- a/packages/gatsby-transformer-javascript-frontmatter/package.json
+++ b/packages/gatsby-transformer-javascript-frontmatter/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-javascript-frontmatter",
"description": "Gatsby transformer plugin for JavaScript to extract exports.frontmatter statically.",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Jacob Bolda ",
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-javascript-frontmatter#readme",
"dependencies": {
@@ -13,7 +13,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"keywords": [
diff --git a/packages/gatsby-transformer-javascript-static-exports/package.json b/packages/gatsby-transformer-javascript-static-exports/package.json
index 60aa331548f25..8e29b1fb8cc3f 100644
--- a/packages/gatsby-transformer-javascript-static-exports/package.json
+++ b/packages/gatsby-transformer-javascript-static-exports/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-javascript-static-exports",
"description": "Gatsby transformer plugin for JavaScript to extract exports.data statically.",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Jacob Bolda ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -15,7 +15,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-javascript-static-exports#readme",
diff --git a/packages/gatsby-transformer-json/README.md b/packages/gatsby-transformer-json/README.md
index a08ad6f346485..212c1f49469f3 100644
--- a/packages/gatsby-transformer-json/README.md
+++ b/packages/gatsby-transformer-json/README.md
@@ -7,7 +7,7 @@ arrays of objects and single objects.
`npm install gatsby-transformer-json`
-If you want to transform json files, you also need to have `gatsby-source-filesystem` installed and configured so it
+If you want to transform JSON files, you also need to have `gatsby-source-filesystem` installed and configured so it
points to your files.
## How to use
@@ -255,3 +255,7 @@ If you can rewrite your data with objects, you should be good to go:
```
Else, if your data doesn't have a consistent schema, like [TopoJSON files](https://en.wikipedia.org/wiki/GeoJSON#TopoJSON), or you can't rewrite it, consider placing the JSON file inside the [`static` folder](/docs/static-folder/#when-to-use-the-static-folder) and use the dynamic import syntax (`import('/static/myjson.json')`) within the `componentDidMount` lifecycle or the `useEffect` hook.
+
+### `id` and `jsonId` key
+
+If your data contains an `id` key the transformer will automatically convert this key to `jsonId` as `id` is a reserved internal keyword for Gatsby.
diff --git a/packages/gatsby-transformer-json/package.json b/packages/gatsby-transformer-json/package.json
index 8f4d0c99d5650..2d370d3b79242 100644
--- a/packages/gatsby-transformer-json/package.json
+++ b/packages/gatsby-transformer-json/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-json",
"description": "Gatsby transformer plugin for JSON files",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Kyle Mathews ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -13,7 +13,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-json#readme",
diff --git a/packages/gatsby-transformer-json/src/__tests__/__snapshots__/gatsby-node.js.snap b/packages/gatsby-transformer-json/src/__tests__/__snapshots__/gatsby-node.js.snap
index 1a73e5909bc94..50f42e8ac1ce7 100644
--- a/packages/gatsby-transformer-json/src/__tests__/__snapshots__/gatsby-node.js.snap
+++ b/packages/gatsby-transformer-json/src/__tests__/__snapshots__/gatsby-node.js.snap
@@ -1,56 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Process JSON nodes correctly coerces an id field to always be a String 1`] = `
-Array [
- Array [
- Object {
- "blue": true,
- "children": Array [],
- "funny": "yup",
- "id": "12345",
- "internal": Object {
- "contentDigest": "contentDigest",
- "type": "FooJson",
- },
- "parent": "whatever",
- },
- ],
-]
-`;
-
-exports[`Process JSON nodes correctly coerces an id field to always be a String 2`] = `
-Array [
- Array [
- Object {
- "child": Object {
- "blue": true,
- "children": Array [],
- "funny": "yup",
- "id": "12345",
- "internal": Object {
- "contentDigest": "contentDigest",
- "type": "FooJson",
- },
- "parent": "whatever",
- },
- "parent": Object {
- "children": Array [],
- "content": "{\\"id\\":12345,\\"blue\\":true,\\"funny\\":\\"yup\\"}",
- "dir": "/foo/",
- "id": "whatever",
- "internal": Object {
- "contentDigest": "whatever",
- "mediaType": "application/json",
- "type": "File",
- },
- "name": "nodeName",
- "parent": null,
- },
- },
- ],
-]
-`;
-
exports[`Process JSON nodes correctly correctly creates a node from JSON which is a single object 1`] = `
Array [
Array [
@@ -58,11 +7,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "FooJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
],
@@ -77,11 +27,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "FooJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
"parent": Object {
@@ -109,11 +60,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NotFileJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
],
@@ -128,11 +80,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NotFileJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
"parent": Object {
@@ -158,11 +111,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NodeNameJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
],
@@ -190,11 +144,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NodeNameJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
"parent": Object {
@@ -250,11 +205,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NotFileJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
],
@@ -282,11 +238,12 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "foo",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "NotFileJson",
},
+ "jsonId": "foo",
"parent": "whatever",
},
"parent": Object {
@@ -330,3 +287,56 @@ Array [
],
]
`;
+
+exports[`Process JSON nodes correctly creates a jsonId key if id was given 1`] = `
+Array [
+ Array [
+ Object {
+ "blue": true,
+ "children": Array [],
+ "funny": "yup",
+ "id": "uuid-from-gatsby",
+ "internal": Object {
+ "contentDigest": "contentDigest",
+ "type": "FooJson",
+ },
+ "jsonId": "123",
+ "parent": "whatever",
+ },
+ ],
+]
+`;
+
+exports[`Process JSON nodes correctly creates a jsonId key if id was given 2`] = `
+Array [
+ Array [
+ Object {
+ "child": Object {
+ "blue": true,
+ "children": Array [],
+ "funny": "yup",
+ "id": "uuid-from-gatsby",
+ "internal": Object {
+ "contentDigest": "contentDigest",
+ "type": "FooJson",
+ },
+ "jsonId": "123",
+ "parent": "whatever",
+ },
+ "parent": Object {
+ "children": Array [],
+ "content": "{\\"id\\":\\"123\\",\\"blue\\":true,\\"funny\\":\\"yup\\"}",
+ "dir": "/foo/",
+ "id": "whatever",
+ "internal": Object {
+ "contentDigest": "whatever",
+ "mediaType": "application/json",
+ "type": "File",
+ },
+ "name": "nodeName",
+ "parent": null,
+ },
+ },
+ ],
+]
+`;
diff --git a/packages/gatsby-transformer-json/src/__tests__/gatsby-node.js b/packages/gatsby-transformer-json/src/__tests__/gatsby-node.js
index 00d3b555fe5ca..9f9c9558c590b 100644
--- a/packages/gatsby-transformer-json/src/__tests__/gatsby-node.js
+++ b/packages/gatsby-transformer-json/src/__tests__/gatsby-node.js
@@ -93,8 +93,8 @@ describe(`Process JSON nodes correctly`, () => {
})
})
- it(`coerces an id field to always be a String`, async () => {
- const data = { id: 12345, blue: true, funny: `yup` }
+ it(`creates a jsonId key if id was given`, async () => {
+ const data = { id: `123`, blue: true, funny: `yup` }
const node = {
...baseFileNode,
content: JSON.stringify(data),
diff --git a/packages/gatsby-transformer-json/src/gatsby-node.js b/packages/gatsby-transformer-json/src/gatsby-node.js
index b69fc66a03170..69f00962744c9 100644
--- a/packages/gatsby-transformer-json/src/gatsby-node.js
+++ b/packages/gatsby-transformer-json/src/gatsby-node.js
@@ -39,6 +39,9 @@ async function onCreateNode(
type,
},
}
+ if (obj.id) {
+ jsonNode[`jsonId`] = obj.id
+ }
createNode(jsonNode)
createParentChildLink({ parent: node, child: jsonNode })
}
@@ -60,16 +63,14 @@ async function onCreateNode(
parsedContent.forEach((obj, i) => {
transformObject(
obj,
- obj.id ? String(obj.id) : createNodeId(`${node.id} [${i}] >>> JSON`),
+ createNodeId(`${node.id} [${i}] >>> JSON`),
getType({ node, object: obj, isArray: true })
)
})
} else if (_.isPlainObject(parsedContent)) {
transformObject(
parsedContent,
- parsedContent.id
- ? String(parsedContent.id)
- : createNodeId(`${node.id} >>> JSON`),
+ createNodeId(`${node.id} >>> JSON`),
getType({ node, object: parsedContent, isArray: false })
)
}
diff --git a/packages/gatsby-transformer-pdf/package.json b/packages/gatsby-transformer-pdf/package.json
index c9883f90829e2..bb7bcb54fb351 100644
--- a/packages/gatsby-transformer-pdf/package.json
+++ b/packages/gatsby-transformer-pdf/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-pdf",
"description": "Gatsby transformer plugin for pdf files",
- "version": "3.0.0-zz-next.1",
+ "version": "3.0.0-zz-next.2",
"author": "Alex Munoz ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,7 +14,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-pdf#readme",
diff --git a/packages/gatsby-transformer-react-docgen/package.json b/packages/gatsby-transformer-react-docgen/package.json
index 2c57326e6f27c..5e8f5352a6c74 100644
--- a/packages/gatsby-transformer-react-docgen/package.json
+++ b/packages/gatsby-transformer-react-docgen/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-react-docgen",
"description": "Expose React component metadata and prop information as GraphQL types",
- "version": "7.0.0-zz-next.1",
+ "version": "7.0.0-zz-next.2",
"author": "Jason Quense ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -17,7 +17,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"lodash": "^4.17.21"
},
diff --git a/packages/gatsby-transformer-remark/README.md b/packages/gatsby-transformer-remark/README.md
index ce8158e15db1b..6c012fe738ebe 100644
--- a/packages/gatsby-transformer-remark/README.md
+++ b/packages/gatsby-transformer-remark/README.md
@@ -1,6 +1,6 @@
# gatsby-transformer-remark
-Parses Markdown files using [Remark](http://remark.js.org/).
+Parses Markdown files using [remark](http://remark.js.org/).
## Install
@@ -32,7 +32,7 @@ plugins:
- `options.gfm`
A full explanation of how to use markdown in Gatsby can be found here:
-[Creating a Blog with Gatsby](https://www.gatsbyjs.org/blog/2017-07-19-creating-a-blog-with-gatsby/)
+[Adding Markdown Pages](https://www.gatsbyjs.com/docs/how-to/routing/adding-markdown-pages/)
There are many Gatsby Remark plugins which you can install to customize how Markdown is processed. Many of them are demoed at https://using-remark.gatsbyjs.org/. See also the [source code for using-remark](https://github.com/gatsbyjs/gatsby/tree/master/examples/using-remark).
@@ -40,13 +40,12 @@ There are many Gatsby Remark plugins which you can install to customize how Mark
It recognizes files with the following extensions as Markdown:
-- md
-- markdown
+- `md`
+- `markdown`
Each Markdown file is parsed into a node of type `MarkdownRemark`.
-All frontmatter fields are converted into GraphQL fields. TODO link to docs on
-auto-inferring types/fields.
+All frontmatter fields are converted into GraphQL fields through [inference](https://www.gatsbyjs.com/docs/glossary/#inference).
This plugin adds additional fields to the `MarkdownRemark` GraphQL type
including `html`, `excerpt`, `headings`, etc. Other Gatsby plugins can also add
@@ -93,9 +92,9 @@ Using the following GraphQL query you'll be able to get the table of contents
}
```
-### Configuring the tableOfContents
+### Configuring the `tableOfContents`
-By default, `absolute` is set to false, generating a relative path. If you'd like to generate an absolute path, pass `absolute: true`. In that case, be sure to pass the `pathToSlugField` parameter, often `fields.slug`, to create absolute URLs. **Note** that providing a non-existent field will cause the result to be null. To alter the default values for tableOfContents generation, include values for `heading` (string) and/or `maxDepth` (number 1 to 6) in GraphQL query. If a value for `heading` is given, the first heading that matches will be omitted and the toc is generated from the next heading of the same depth onwards. Value for `maxDepth` sets the maximum depth of the toc (i.e. if a maxDepth of 3 is set, only h1 to h3 headings will appear in the toc).
+By default, `absolute` is set to `false`, generating a relative path. If you'd like to generate an absolute path, pass `absolute: true`. In that case, be sure to pass the `pathToSlugField` parameter, often `fields.slug`, to create absolute URLs. **Note** that providing a non-existent field will cause the result to be `null`. To alter the default values for `tableOfContents` generation, include values for `heading` (string) and/or `maxDepth` (number 1 to 6) in GraphQL query. If a value for `heading` is given, the first heading that matches will be omitted and the ToC is generated from the next heading of the same depth onwards. Value for `maxDepth` sets the maximum depth of the toc (i.e. if a maxDepth of 3 is set, only h1 to h3 headings will appear in the toc).
```graphql
{
@@ -119,7 +118,7 @@ By default, `absolute` is set to false, generating a relative path. If you'd lik
}
```
-To pass default options to the plugin generating the tableOfContents, configure it in gatsby-config.js as shown below. The options shown below are the defaults used by the plugin.
+To pass default options to the plugin generating the `tableOfContents`, configure it in `gatsby-config.js` as shown below. The options shown below are the defaults used by the plugin.
```javascript
// In your gatsby-config.js
@@ -171,7 +170,7 @@ By default, Gatsby will return excerpts as plain text. This might be useful for
}
```
-It's also possible to ask Gatsby to return excerpts formatted as HTML. You might use this if you have a blog post whose excerpt contains markdown content--e.g. header, link, etc.--and you want these links to render as HTML.
+It's also possible to ask Gatsby to return excerpts formatted as HTML. You might use this if you have a blog post whose excerpt contains markdown content -- e.g. header, link, etc. -- and you want these links to render as HTML.
```graphql
{
@@ -199,9 +198,9 @@ You can also get excerpts in Markdown format.
}
```
-## gray-matter options
+## `gray-matter` options
-`gatsby-transformer-remark` uses [gray-matter](https://github.com/jonschlinkert/gray-matter) to parse markdown frontmatter, so you can specify any of the options mentioned [here](https://github.com/jonschlinkert/gray-matter#options) in the `gatsby-config.js` file.
+`gatsby-transformer-remark` uses [gray-matter](https://github.com/jonschlinkert/gray-matter) to parse Markdown frontmatter, so you can specify any of the options mentioned [here](https://github.com/jonschlinkert/gray-matter#options) in the `gatsby-config.js` file.
### Example: Excerpts
diff --git a/packages/gatsby-transformer-remark/package.json b/packages/gatsby-transformer-remark/package.json
index 4f184f026e85b..271ac9778b8cf 100644
--- a/packages/gatsby-transformer-remark/package.json
+++ b/packages/gatsby-transformer-remark/package.json
@@ -1,14 +1,14 @@
{
"name": "gatsby-transformer-remark",
"description": "Gatsby transformer plugin for Markdown using the Remark library and ecosystem",
- "version": "5.0.0-zz-next.1",
+ "version": "5.0.0-zz-next.3",
"author": "Kyle Mathews ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
},
"dependencies": {
"@babel/runtime": "^7.15.4",
- "gatsby-core-utils": "^3.0.0-zz-next.1",
+ "gatsby-core-utils": "^3.0.0-zz-next.3",
"gray-matter": "^4.0.2",
"hast-util-raw": "^6.0.2",
"hast-util-to-html": "^7.1.2",
@@ -33,9 +33,9 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
- "gatsby-plugin-utils": "^2.0.0-zz-next.1"
+ "gatsby-plugin-utils": "^2.0.0-zz-next.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-remark#readme",
"keywords": [
diff --git a/packages/gatsby-transformer-remark/src/gatsby-node.js b/packages/gatsby-transformer-remark/src/gatsby-node.js
index bfbb692b17838..7cd8b3c3d3451 100644
--- a/packages/gatsby-transformer-remark/src/gatsby-node.js
+++ b/packages/gatsby-transformer-remark/src/gatsby-node.js
@@ -9,10 +9,6 @@ exports.setFieldsOnGraphQLNodeType = require(`./extend-node-type`)
exports.pluginOptionsSchema = function ({ Joi }) {
return Joi.object({
- // Options `commonmark` and `pedantic` have no effect since gatsby-transformer-remark@4.0.0
- // TODO: remove in v5
- commonmark: Joi.any(),
- pedantic: Joi.any(),
footnotes: Joi.boolean().description(
`Activates Footnotes mode (default: true)`
),
diff --git a/packages/gatsby-transformer-screenshot/lambda/package.json b/packages/gatsby-transformer-screenshot/lambda/package.json
index b2ec0bd7671b2..39bc7c6dc1d93 100644
--- a/packages/gatsby-transformer-screenshot/lambda/package.json
+++ b/packages/gatsby-transformer-screenshot/lambda/package.json
@@ -5,7 +5,7 @@
"puppeteer-core": "^3.3.0"
},
"devDependencies": {
- "aws-sdk": "^2.980.0"
+ "aws-sdk": "^2.999.0"
},
"keywords": [],
"engines": {
diff --git a/packages/gatsby-transformer-screenshot/package.json b/packages/gatsby-transformer-screenshot/package.json
index b077a82a37ef5..2192cf7ecf4ff 100644
--- a/packages/gatsby-transformer-screenshot/package.json
+++ b/packages/gatsby-transformer-screenshot/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-screenshot",
"description": "Gatsby transformer plugin that uses AWS Lambda to take screenshots of websites",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.3",
"author": "David Beckley ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,7 +14,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-screenshot#readme",
diff --git a/packages/gatsby-transformer-sharp/package.json b/packages/gatsby-transformer-sharp/package.json
index fdc4f7ac69b59..a2846ab07b777 100644
--- a/packages/gatsby-transformer-sharp/package.json
+++ b/packages/gatsby-transformer-sharp/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-sharp",
"description": "Gatsby transformer plugin for images using Sharp",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.3",
"author": "Kyle Mathews ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,13 +14,13 @@
"potrace": "^2.1.8",
"probe-image-size": "^6.0.0",
"semver": "^7.3.5",
- "sharp": "^0.29.0"
+ "sharp": "^0.29.1"
},
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "@types/sharp": "^0.28.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "@types/sharp": "^0.29.2",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-sharp#readme",
diff --git a/packages/gatsby-transformer-sqip/.babelrc b/packages/gatsby-transformer-sqip/.babelrc
index 31043522b2321..ac0ad292bb087 100644
--- a/packages/gatsby-transformer-sqip/.babelrc
+++ b/packages/gatsby-transformer-sqip/.babelrc
@@ -1,3 +1,3 @@
{
- "presets": [["babel-preset-gatsby-package", { "browser": true }]]
+ "presets": [["babel-preset-gatsby-package"]]
}
diff --git a/packages/gatsby-transformer-sqip/CHANGELOG.md b/packages/gatsby-transformer-sqip/CHANGELOG.md
index 71c8ce2ebb305..fceeb8b2f32ac 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.
+### [3.14.1](https://github.com/gatsbyjs/gatsby/commits/gatsby-transformer-sqip@3.14.1/packages/gatsby-transformer-sqip) (2021-10-06)
+
+**Note:** Version bump only for package gatsby-transformer-sqip
+
## [3.14.0](https://github.com/gatsbyjs/gatsby/commits/gatsby-transformer-sqip@3.14.0/packages/gatsby-transformer-sqip) (2021-09-18)
[🧾 Release notes](https://www.gatsbyjs.com/docs/reference/release-notes/v3.14)
diff --git a/packages/gatsby-transformer-sqip/package.json b/packages/gatsby-transformer-sqip/package.json
index 0133a0318aecb..c3a66e7b7bde9 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": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.6",
"author": "Benedikt Rötsch ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -9,7 +9,7 @@
"dependencies": {
"@babel/runtime": "^7.15.4",
"fs-extra": "^10.0.0",
- "gatsby-plugin-sharp": "^4.0.0-zz-next.1",
+ "gatsby-plugin-sharp": "^4.0.0-zz-next.6",
"md5-file": "^5.0.0",
"mini-svg-data-uri": "^1.3.3",
"p-queue": "^6.6.2",
@@ -18,7 +18,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"debug": "^4.3.2"
},
diff --git a/packages/gatsby-transformer-sqip/src/extend-node-type.js b/packages/gatsby-transformer-sqip/src/extend-node-type.js
index 2c88f595d6b8b..a2ac87123e7d8 100644
--- a/packages/gatsby-transformer-sqip/src/extend-node-type.js
+++ b/packages/gatsby-transformer-sqip/src/extend-node-type.js
@@ -1,22 +1,22 @@
-const { resolve } = require(`path`)
-const md5File = require(`md5-file`)
-
-const {
- DuotoneGradientType,
- ImageCropFocusType,
-} = require(`gatsby-transformer-sharp/types`)
-const { queueImageResizing } = require(`gatsby-plugin-sharp`)
+const path = require(`path`)
const Debug = require(`debug`)
const fs = require(`fs-extra`)
+const sharp = require(`sharp`)
+const md5File = require(`md5-file`)
+
const {
GraphQLObjectType,
GraphQLString,
GraphQLInt,
GraphQLBoolean,
} = require(`gatsby/graphql`)
-const sharp = require(`sharp`)
-const { ensureDir } = require(`fs-extra`)
+const { queueImageResizing } = require(`gatsby-plugin-sharp`)
+const { fetchRemoteFile } = require(`gatsby-core-utils`)
+const {
+ DuotoneGradientType,
+ ImageCropFocusType,
+} = require(`gatsby-transformer-sharp/types`)
const generateSqip = require(`./generate-sqip`)
@@ -42,13 +42,13 @@ module.exports = async args => {
return {}
}
-async function sqipSharp({ cache, getNodeAndSavePathDependency, store }) {
+async function sqipSharp({ type, cache, getNodeAndSavePathDependency, store }) {
const program = store.getState().program
- const cacheDir = resolve(
+ const cacheDir = path.resolve(
`${program.directory}/node_modules/.cache/gatsby-transformer-sqip/`
)
- await ensureDir(cacheDir)
+ await fs.ensureDir(cacheDir)
return {
sqip: {
@@ -135,19 +135,17 @@ async function sqipSharp({ cache, getNodeAndSavePathDependency, store }) {
}
}
-async function sqipContentful({ cache, store, reporter }) {
+async function sqipContentful({ type, cache, store }) {
const {
schemes: { ImageResizingBehavior, ImageCropFocusType },
} = require(`gatsby-source-contentful`)
- const cacheImage = require(`gatsby-source-contentful/cache-image`)
-
const program = store.getState().program
- const cacheDir = resolve(
+ const cacheDir = path.resolve(
`${program.directory}/node_modules/.cache/gatsby-transformer-sqip/`
)
- await ensureDir(cacheDir)
+ await fs.ensureDir(cacheDir)
return {
sqip: {
@@ -192,7 +190,12 @@ async function sqipContentful({ cache, store, reporter }) {
},
async resolve(asset, fieldArgs) {
const {
- file: { contentType },
+ createUrl,
+ mimeTypeExtensions,
+ } = require(`gatsby-source-contentful/extend-node-type`)
+
+ const {
+ file: { contentType, url: imgUrl, fileName },
} = asset
if (!contentType.includes(`image/`)) {
@@ -223,7 +226,16 @@ async function sqipContentful({ cache, store, reporter }) {
background,
}
- const absolutePath = await cacheImage(store, asset, options, reporter)
+ const extension = mimeTypeExtensions.get(contentType)
+ const url = createUrl(imgUrl, options)
+ const name = path.basename(fileName, extension)
+
+ const absolutePath = await fetchRemoteFile({
+ url,
+ name,
+ cache,
+ ext: extension,
+ })
const contentDigest = await md5File(absolutePath)
diff --git a/packages/gatsby-transformer-toml/package.json b/packages/gatsby-transformer-toml/package.json
index 032201d060b73..67072b7dad874 100644
--- a/packages/gatsby-transformer-toml/package.json
+++ b/packages/gatsby-transformer-toml/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-toml",
"description": "Gatsby transformer plugin for toml",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Ruben Harutyunyan ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -14,7 +14,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-toml#readme",
diff --git a/packages/gatsby-transformer-xml/package.json b/packages/gatsby-transformer-xml/package.json
index c324f2b7fc1c4..0792066b4fccd 100644
--- a/packages/gatsby-transformer-xml/package.json
+++ b/packages/gatsby-transformer-xml/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-xml",
"description": "Gatsby plugin for parsing XML files. It supports also attributes",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Kyle Mathews ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -15,7 +15,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-xml#readme",
diff --git a/packages/gatsby-transformer-yaml/README.md b/packages/gatsby-transformer-yaml/README.md
index 6eca02e0b10ce..993a79ec44123 100644
--- a/packages/gatsby-transformer-yaml/README.md
+++ b/packages/gatsby-transformer-yaml/README.md
@@ -238,3 +238,9 @@ module.exports = {
}
}
```
+
+## Troubleshooting
+
+### `id` and `yamlId` key
+
+If your data contains an `id` key the transformer will automatically convert this key to `yamlId` as `id` is a reserved internal keyword for Gatsby.
diff --git a/packages/gatsby-transformer-yaml/package.json b/packages/gatsby-transformer-yaml/package.json
index d8750a8f61f8e..d5f6f3118ed03 100644
--- a/packages/gatsby-transformer-yaml/package.json
+++ b/packages/gatsby-transformer-yaml/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-transformer-yaml",
"description": "Gatsby transformer plugin for yaml",
- "version": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.2",
"author": "Kyle Mathews ",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -15,7 +15,7 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/core": "^7.15.5",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-transformer-yaml#readme",
diff --git a/packages/gatsby-transformer-yaml/src/__tests__/__snapshots__/gatsby-node.js.snap b/packages/gatsby-transformer-yaml/src/__tests__/__snapshots__/gatsby-node.js.snap
index c5afb63dc4de7..0368a176b73b4 100644
--- a/packages/gatsby-transformer-yaml/src/__tests__/__snapshots__/gatsby-node.js.snap
+++ b/packages/gatsby-transformer-yaml/src/__tests__/__snapshots__/gatsby-node.js.snap
@@ -313,12 +313,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "FooBarYaml",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -332,12 +333,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "FooBarYaml",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
@@ -368,12 +370,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "fixed",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -387,12 +390,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "fixed",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
@@ -423,12 +427,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "yup",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -442,12 +447,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "yup",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
@@ -772,12 +778,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "OtherYaml",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -791,12 +798,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "OtherYaml",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
@@ -825,12 +833,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "fixed",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -844,12 +853,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "fixed",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
@@ -878,12 +888,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "yup",
},
"parent": "whatever",
+ "yamlId": "some",
},
],
]
@@ -897,12 +908,13 @@ Array [
"blue": true,
"children": Array [],
"funny": "yup",
- "id": "some",
+ "id": "uuid-from-gatsby",
"internal": Object {
"contentDigest": "contentDigest",
"type": "yup",
},
"parent": "whatever",
+ "yamlId": "some",
},
"parent": Object {
"children": Array [],
diff --git a/packages/gatsby-transformer-yaml/src/gatsby-node.js b/packages/gatsby-transformer-yaml/src/gatsby-node.js
index 850d65277c5b1..2d9ca9064e9dc 100644
--- a/packages/gatsby-transformer-yaml/src/gatsby-node.js
+++ b/packages/gatsby-transformer-yaml/src/gatsby-node.js
@@ -39,6 +39,9 @@ async function onCreateNode(
type,
},
}
+ if (obj.id) {
+ yamlNode[`yamlId`] = obj.id
+ }
createNode(yamlNode)
createParentChildLink({ parent: node, child: yamlNode })
}
@@ -52,14 +55,14 @@ async function onCreateNode(
parsedContent.forEach((obj, i) => {
transformObject(
obj,
- obj.id ? obj.id : createNodeId(`${node.id} [${i}] >>> YAML`),
+ createNodeId(`${node.id} [${i}] >>> YAML`),
getType({ node, object: obj, isArray: true })
)
})
} else if (_.isPlainObject(parsedContent)) {
transformObject(
parsedContent,
- parsedContent.id ? parsedContent.id : createNodeId(`${node.id} >>> YAML`),
+ createNodeId(`${node.id} >>> YAML`),
getType({ node, object: parsedContent, isArray: false })
)
}
diff --git a/packages/gatsby-worker/package.json b/packages/gatsby-worker/package.json
index 14494724122b6..50694bcff7486 100644
--- a/packages/gatsby-worker/package.json
+++ b/packages/gatsby-worker/package.json
@@ -1,7 +1,7 @@
{
"name": "gatsby-worker",
"description": "Utility to create worker pools",
- "version": "1.0.0-zz-next.1",
+ "version": "1.0.0-zz-next.4",
"author": "Michal Piechowiak",
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -13,10 +13,10 @@
"devDependencies": {
"@babel/cli": "^7.15.4",
"@babel/register": "^7.15.3",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"cross-env": "^7.0.3",
"rimraf": "^3.0.2",
- "typescript": "^4.3.5"
+ "typescript": "^4.4.3"
},
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-worker#readme",
"keywords": [
diff --git a/packages/gatsby-worker/src/index.ts b/packages/gatsby-worker/src/index.ts
index e650f741fba0a..1d43864b93a72 100644
--- a/packages/gatsby-worker/src/index.ts
+++ b/packages/gatsby-worker/src/index.ts
@@ -38,18 +38,17 @@ type WrapReturnInArray = MaybeFunction extends (
? (...a: Parameters) => Array>
: never
-export type CreateWorkerPoolType = WorkerPool &
- {
- [FunctionName in keyof ExposedFunctions]: EnsureFunctionReturnsAPromise<
- ExposedFunctions[FunctionName]
+export type CreateWorkerPoolType = WorkerPool & {
+ [FunctionName in keyof ExposedFunctions]: EnsureFunctionReturnsAPromise<
+ ExposedFunctions[FunctionName]
+ >
+} & {
+ all: {
+ [FunctionName in keyof ExposedFunctions]: WrapReturnInArray<
+ EnsureFunctionReturnsAPromise
>
- } & {
- all: {
- [FunctionName in keyof ExposedFunctions]: WrapReturnInArray<
- EnsureFunctionReturnsAPromise
- >
- }
}
+}
const childWrapperPath = require.resolve(`./child`)
diff --git a/packages/gatsby/CHANGELOG.md b/packages/gatsby/CHANGELOG.md
index 95a632165b1d8..60bea8f6c8e13 100644
--- a/packages/gatsby/CHANGELOG.md
+++ b/packages/gatsby/CHANGELOG.md
@@ -3,6 +3,22 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+### [3.14.2](https://github.com/gatsbyjs/gatsby/commits/gatsby@3.14.2/packages/gatsby) (2021-10-06)
+
+#### Features
+
+- Don't crash the build process when in preview mode [#33184](https://github.com/gatsbyjs/gatsby/issues/33184) [#33433](https://github.com/gatsbyjs/gatsby/issues/33433) ([1604efb](https://github.com/gatsbyjs/gatsby/commit/1604efbdde97c138b11626923875ae118f7b5e67))
+
+#### Bug Fixes
+
+- postcss-svgo - remove plugin removeAttrs [#33266](https://github.com/gatsbyjs/gatsby/issues/33266) [#33434](https://github.com/gatsbyjs/gatsby/issues/33434) ([07f1990](https://github.com/gatsbyjs/gatsby/commit/07f1990f2d01b1c6b5def457d418294fafe3a5ea))
+
+### [3.14.1](https://github.com/gatsbyjs/gatsby/commits/gatsby@3.14.1/packages/gatsby) (2021-09-30)
+
+#### Bug Fixes
+
+- unblock event loop when running queries [#33338](https://github.com/gatsbyjs/gatsby/issues/33338) [#33342](https://github.com/gatsbyjs/gatsby/issues/33342) ([6840b5f](https://github.com/gatsbyjs/gatsby/commit/6840b5f3fbabbc4dd4e23e897759c9f92a204abd))
+
## [3.14.0](https://github.com/gatsbyjs/gatsby/commits/gatsby@3.14.0/packages/gatsby) (2021-09-18)
[🧾 Release notes](https://www.gatsbyjs.com/docs/reference/release-notes/v3.14)
diff --git a/packages/gatsby/cache-dir/__tests__/__snapshots__/dev-loader.js.snap b/packages/gatsby/cache-dir/__tests__/__snapshots__/dev-loader.js.snap
index b8e48f1681c55..5ba039d7796d9 100644
--- a/packages/gatsby/cache-dir/__tests__/__snapshots__/dev-loader.js.snap
+++ b/packages/gatsby/cache-dir/__tests__/__snapshots__/dev-loader.js.snap
@@ -8,6 +8,7 @@ Object {
},
"page": Object {
"componentChunkName": "chunk",
+ "getServerDataError": undefined,
"matchPath": undefined,
"path": "/mypage/",
"staticQueryHashes": Array [],
diff --git a/packages/gatsby/cache-dir/__tests__/__snapshots__/loader.js.snap b/packages/gatsby/cache-dir/__tests__/__snapshots__/loader.js.snap
index 362789b85695d..58192c541ddf4 100644
--- a/packages/gatsby/cache-dir/__tests__/__snapshots__/loader.js.snap
+++ b/packages/gatsby/cache-dir/__tests__/__snapshots__/loader.js.snap
@@ -8,6 +8,7 @@ Object {
},
"page": Object {
"componentChunkName": "chunk",
+ "getServerDataError": undefined,
"matchPath": undefined,
"path": "/mypage/",
"staticQueryHashes": Array [],
diff --git a/packages/gatsby/cache-dir/__tests__/dev-loader.js b/packages/gatsby/cache-dir/__tests__/dev-loader.js
index 2bf9d101daa82..d58098a5d28f7 100644
--- a/packages/gatsby/cache-dir/__tests__/dev-loader.js
+++ b/packages/gatsby/cache-dir/__tests__/dev-loader.js
@@ -205,12 +205,16 @@ describe(`Dev loader`, () => {
const expectation = {
status: `error`,
- pagePath: `/error-page`,
+ pagePath: `/500.html`,
+ internalServerError: true,
+ retries: 3,
}
+
expect(await devLoader.loadPageDataJson(`/error-page/`)).toEqual({
status: `error`,
pagePath: `/dev-404-page`,
retries: 3,
+ internalServerError: true,
})
expect(devLoader.pageDataDb.get(`/error-page`)).toEqual(expectation)
expect(xhrCount).toBe(1)
@@ -478,26 +482,32 @@ describe(`Dev loader`, () => {
describe(`prefetch`, () => {
const flushPromises = () => new Promise(resolve => setImmediate(resolve))
- it(`shouldn't prefetch when shouldPrefetch is false`, () => {
- const devLoader = new DevLoader(asyncRequires, [])
+ it(`shouldn't prefetch when shouldPrefetch is false`, async () => {
+ jest.useFakeTimers()
+ const devLoader = new DevLoader(null, [])
devLoader.shouldPrefetch = jest.fn(() => false)
devLoader.doPrefetch = jest.fn()
devLoader.apiRunner = jest.fn()
+ const prefetchPromise = devLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
- expect(devLoader.prefetch(`/mypath/`)).toBe(false)
+ expect(await prefetchPromise).toBe(false)
expect(devLoader.shouldPrefetch).toHaveBeenCalledWith(`/mypath/`)
expect(devLoader.apiRunner).not.toHaveBeenCalled()
expect(devLoader.doPrefetch).not.toHaveBeenCalled()
})
- it(`should trigger custom prefetch logic when core is disabled`, () => {
- const devLoader = new DevLoader(asyncRequires, [])
+ it(`should trigger custom prefetch logic when core is disabled`, async () => {
+ jest.useFakeTimers()
+ const devLoader = new DevLoader(null, [])
devLoader.shouldPrefetch = jest.fn(() => true)
devLoader.doPrefetch = jest.fn()
devLoader.apiRunner = jest.fn()
devLoader.prefetchDisabled = true
- expect(devLoader.prefetch(`/mypath/`)).toBe(false)
+ const prefetchPromise = devLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
+ expect(await prefetchPromise).toBe(false)
expect(devLoader.shouldPrefetch).toHaveBeenCalledWith(`/mypath/`)
expect(devLoader.apiRunner).toHaveBeenCalledWith(`onPrefetchPathname`, {
pathname: `/mypath/`,
@@ -507,12 +517,14 @@ describe(`Dev loader`, () => {
it(`should prefetch when not yet triggered`, async () => {
jest.useFakeTimers()
- const devLoader = new DevLoader(asyncRequires, [])
+ const devLoader = new DevLoader(null, [])
devLoader.shouldPrefetch = jest.fn(() => true)
devLoader.apiRunner = jest.fn()
devLoader.doPrefetch = jest.fn(() => Promise.resolve({}))
+ const prefetchPromise = devLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
- expect(devLoader.prefetch(`/mypath/`)).toBe(true)
+ expect(await prefetchPromise).toBe(true)
// wait for doPrefetchPromise
await flushPromises()
@@ -528,30 +540,5 @@ describe(`Dev loader`, () => {
}
)
})
-
- it(`should only run apis once`, async () => {
- const devLoader = new DevLoader(asyncRequires, [])
- devLoader.shouldPrefetch = jest.fn(() => true)
- devLoader.apiRunner = jest.fn()
- devLoader.doPrefetch = jest.fn(() => Promise.resolve({}))
-
- expect(devLoader.prefetch(`/mypath/`)).toBe(true)
- expect(devLoader.prefetch(`/mypath/`)).toBe(true)
-
- // wait for doPrefetchPromise
- await flushPromises()
-
- expect(devLoader.apiRunner).toHaveBeenCalledTimes(2)
- expect(devLoader.apiRunner).toHaveBeenNthCalledWith(
- 1,
- `onPrefetchPathname`,
- expect.anything()
- )
- expect(devLoader.apiRunner).toHaveBeenNthCalledWith(
- 2,
- `onPostPrefetchPathname`,
- expect.anything()
- )
- })
})
})
diff --git a/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx b/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx
index 8d5841c614fbd..472617ee2b983 100644
--- a/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx
+++ b/packages/gatsby/cache-dir/__tests__/ensure-resources.tsx
@@ -22,6 +22,7 @@ describe(`EnsureResources`, () => {
it(`loads pages synchronously`, () => {
const location = {
pathname: `/`,
+ search: ``,
}
const { container } = render(
diff --git a/packages/gatsby/cache-dir/__tests__/loader.js b/packages/gatsby/cache-dir/__tests__/loader.js
index c2857c2312fd0..11b40db88284a 100644
--- a/packages/gatsby/cache-dir/__tests__/loader.js
+++ b/packages/gatsby/cache-dir/__tests__/loader.js
@@ -187,14 +187,16 @@ describe(`Production loader`, () => {
expect(xhrCount).toBe(2)
})
- it(`should return an error when status is 500`, async () => {
+ it(`should return an error when status is 500 and 500.html is not available`, async () => {
const prodLoader = new ProdLoader(null, [])
mockPageData(`/error-page`, 500)
const expectation = {
status: `error`,
- pagePath: `/error-page`,
+ pagePath: `/500.html`,
+ internalServerError: true,
+ retries: 3,
}
expect(await prodLoader.loadPageDataJson(`/error-page/`)).toEqual(
expectation
@@ -203,6 +205,34 @@ describe(`Production loader`, () => {
expect(xhrCount).toBe(1)
})
+ it(`should return an error when status is 500 and 500.html is available`, async () => {
+ const prodLoader = new ProdLoader(null, [])
+
+ mockPageData(`/error-page`, 500)
+ mockPageData(
+ `/500.html`,
+ 200,
+ {
+ path: `/500.html`,
+ },
+ true
+ )
+
+ const expectation = {
+ status: `success`,
+ pagePath: `/500.html`,
+ internalServerError: true,
+ payload: {
+ path: `/500.html`,
+ },
+ }
+ expect(await prodLoader.loadPageDataJson(`/error-page/`)).toEqual(
+ expectation
+ )
+ expect(prodLoader.pageDataDb.get(`/error-page`)).toEqual(expectation)
+ expect(xhrCount).toBe(2)
+ })
+
it(`should retry 3 times before returning an error`, async () => {
const prodLoader = new ProdLoader(null, [])
@@ -486,26 +516,32 @@ describe(`Production loader`, () => {
describe(`prefetch`, () => {
const flushPromises = () => new Promise(resolve => setImmediate(resolve))
- it(`shouldn't prefetch when shouldPrefetch is false`, () => {
+ it(`shouldn't prefetch when shouldPrefetch is false`, async () => {
+ jest.useFakeTimers()
const prodLoader = new ProdLoader(null, [])
prodLoader.shouldPrefetch = jest.fn(() => false)
prodLoader.doPrefetch = jest.fn()
prodLoader.apiRunner = jest.fn()
+ const prefetchPromise = prodLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
- expect(prodLoader.prefetch(`/mypath/`)).toBe(false)
+ expect(await prefetchPromise).toBe(false)
expect(prodLoader.shouldPrefetch).toHaveBeenCalledWith(`/mypath/`)
expect(prodLoader.apiRunner).not.toHaveBeenCalled()
expect(prodLoader.doPrefetch).not.toHaveBeenCalled()
})
- it(`should trigger custom prefetch logic when core is disabled`, () => {
+ it(`should trigger custom prefetch logic when core is disabled`, async () => {
+ jest.useFakeTimers()
const prodLoader = new ProdLoader(null, [])
prodLoader.shouldPrefetch = jest.fn(() => true)
prodLoader.doPrefetch = jest.fn()
prodLoader.apiRunner = jest.fn()
prodLoader.prefetchDisabled = true
- expect(prodLoader.prefetch(`/mypath/`)).toBe(false)
+ const prefetchPromise = prodLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
+ expect(await prefetchPromise).toBe(false)
expect(prodLoader.shouldPrefetch).toHaveBeenCalledWith(`/mypath/`)
expect(prodLoader.apiRunner).toHaveBeenCalledWith(`onPrefetchPathname`, {
pathname: `/mypath/`,
@@ -519,8 +555,10 @@ describe(`Production loader`, () => {
prodLoader.shouldPrefetch = jest.fn(() => true)
prodLoader.apiRunner = jest.fn()
prodLoader.doPrefetch = jest.fn(() => Promise.resolve({}))
+ const prefetchPromise = prodLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
- expect(prodLoader.prefetch(`/mypath/`)).toBe(true)
+ expect(await prefetchPromise).toBe(true)
// wait for doPrefetchPromise
await flushPromises()
@@ -538,13 +576,17 @@ describe(`Production loader`, () => {
})
it(`should only run apis once`, async () => {
+ jest.useFakeTimers()
const prodLoader = new ProdLoader(null, [])
prodLoader.shouldPrefetch = jest.fn(() => true)
prodLoader.apiRunner = jest.fn()
prodLoader.doPrefetch = jest.fn(() => Promise.resolve({}))
+ const prefetchPromise = prodLoader.prefetch(`/mypath/`)
+ const prefetchPromise2 = prodLoader.prefetch(`/mypath/`)
+ jest.runAllTimers()
- expect(prodLoader.prefetch(`/mypath/`)).toBe(true)
- expect(prodLoader.prefetch(`/mypath/`)).toBe(true)
+ expect(await prefetchPromise).toBe(true)
+ expect(await prefetchPromise2).toBe(true)
// wait for doPrefetchPromise
await flushPromises()
diff --git a/packages/gatsby/cache-dir/app.js b/packages/gatsby/cache-dir/app.js
index dfd7cae909877..45f439e57bfd7 100644
--- a/packages/gatsby/cache-dir/app.js
+++ b/packages/gatsby/cache-dir/app.js
@@ -174,7 +174,7 @@ apiRunnerAsync(`onClientEntry`).then(() => {
Promise.all([
loader.loadPage(`/dev-404-page/`),
loader.loadPage(`/404.html`),
- loader.loadPage(window.location.pathname),
+ loader.loadPage(window.location.pathname + window.location.search),
]).then(() => {
navigationInit()
diff --git a/packages/gatsby/cache-dir/dev-loader.js b/packages/gatsby/cache-dir/dev-loader.js
index ac8ba1ff302c2..b6c16104a7eab 100644
--- a/packages/gatsby/cache-dir/dev-loader.js
+++ b/packages/gatsby/cache-dir/dev-loader.js
@@ -14,9 +14,15 @@ function mergePageEntry(cachedPage, newPageData) {
...cachedPage,
payload: {
...cachedPage.payload,
- json: newPageData.result,
+ json: {
+ // For SSR, cachedPage may contain "data" and "serverData"
+ // But newPageData may contain only "data" or only "serverData" depending on what was updated
+ ...cachedPage.payload.json,
+ ...newPageData.result,
+ },
page: {
...cachedPage.payload.page,
+ getServerDataError: newPageData.getServerDataError,
staticQueryResults: newPageData.staticQueryResults,
},
},
@@ -54,6 +60,8 @@ class DevLoader extends BaseLoader {
this.handlePageQueryResultHotUpdate(msg)
} else if (msg.type === `stalePageData`) {
this.handleStalePageDataMessage(msg)
+ } else if (msg.type === `staleServerData`) {
+ this.handleStaleServerDataMessage(msg)
}
})
} else if (process.env.NODE_ENV !== `test`) {
@@ -114,10 +122,8 @@ class DevLoader extends BaseLoader {
}
}
- handlePageQueryResultHotUpdate(msg) {
- const newPageData = msg.payload.result
-
- const pageDataDbCacheKey = normalizePagePath(msg.payload.id)
+ updatePageData = (pagePath, newPageData) => {
+ const pageDataDbCacheKey = normalizePagePath(pagePath)
const cachedPageData = this.pageDataDb.get(pageDataDbCacheKey)?.payload
if (!isEqual(newPageData, cachedPageData)) {
@@ -161,42 +167,78 @@ class DevLoader extends BaseLoader {
}
})
}
+ return true
+ }
+ return false
+ }
+
+ markAsStale = dirtyQueryId => {
+ if (dirtyQueryId === `/dev-404-page/` || dirtyQueryId === `/404.html`) {
+ // those pages are not on demand so skipping
+ return
+ }
- ___emitter.emit(`pageQueryResult`, newPageData)
+ const normalizedId = normalizePagePath(dirtyQueryId)
+
+ // We can't just delete items in caches, because then
+ // using history.back() would show dev-404 page
+ // due to our special handling of it in root.js (loader.isPageNotFound check)
+ // so instead we mark it as stale and instruct loader's async methods
+ // to refetch resources if they are marked as stale
+
+ const cachedPageData = this.pageDataDb.get(normalizedId)
+ if (cachedPageData) {
+ // if we have page data in cache, mark it as stale
+ this.pageDataDb.set(normalizedId, {
+ ...cachedPageData,
+ stale: true,
+ })
+ }
+
+ const cachedPage = this.pageDb.get(normalizedId)
+ if (cachedPage) {
+ // if we have page data in cache, mark it as stale
+ this.pageDb.set(normalizedId, {
+ ...cachedPage,
+ payload: { ...cachedPage.payload, stale: true },
+ })
}
}
- handleStalePageDataMessage(msg) {
- msg.payload.stalePageDataPaths.forEach(dirtyQueryId => {
- if (dirtyQueryId === `/dev-404-page/` || dirtyQueryId === `/404.html`) {
- // those pages are not on demand so skipping
- return
- }
+ handlePageQueryResultHotUpdate(msg) {
+ const updated = this.updatePageData(msg.payload.id, msg.payload.result)
+ if (updated) {
+ ___emitter.emit(`pageQueryResult`, msg.payload.result)
+ }
+ }
- const normalizedId = normalizePagePath(dirtyQueryId)
+ handleStalePageDataMessage(msg) {
+ for (const dirtyQueryId of msg.payload.stalePageDataPaths) {
+ this.markAsStale(dirtyQueryId)
+ }
+ }
- // We can't just delete items in caches, because then
- // using history.back() would show dev-404 page
- // due to our special handling of it in root.js (loader.isPageNotFound check)
- // so instead we mark it as stale and instruct loader's async methods
- // to refetch resources if they are marked as stale
+ handleStaleServerDataMessage() {
+ const activePath = normalizePagePath(location.pathname)
- const cachedPageData = this.pageDataDb.get(normalizedId)
- if (cachedPageData) {
- // if we have page data in cache, mark it as stale
- this.pageDataDb.set(normalizedId, {
- ...cachedPageData,
- stale: true,
- })
+ // For now just invalidate every single page with serverData
+ for (const [key, value] of this.pageDataDb) {
+ if (value?.payload?.result?.serverData) {
+ this.markAsStale(key)
+ }
+ if (activePath === normalizePagePath(key)) {
+ this.reFetchServerData(activePath)
}
+ }
+ }
- const cachedPage = this.pageDb.get(normalizedId)
- if (cachedPage) {
- // if we have page data in cache, mark it as stale
- this.pageDb.set(normalizedId, {
- ...cachedPage,
- payload: { ...cachedPage.payload, stale: true },
- })
+ reFetchServerData(pagePath) {
+ this.fetchPageDataJson({ pagePath }).then(data => {
+ const updated = this.updatePageData(data.pagePath, data.payload)
+ // SSR could be slow, so we should only emit serverDataResult
+ // when still on the same page
+ if (updated && pagePath === normalizePagePath(location.pathname)) {
+ ___emitter.emit(`serverDataResult`, data.payload)
}
})
}
diff --git a/packages/gatsby/cache-dir/ensure-resources.js b/packages/gatsby/cache-dir/ensure-resources.js
index 80bbb8d8dcdf9..b1880c92b643b 100644
--- a/packages/gatsby/cache-dir/ensure-resources.js
+++ b/packages/gatsby/cache-dir/ensure-resources.js
@@ -10,15 +10,20 @@ class EnsureResources extends React.Component {
location: { ...location },
pageResources:
pageResources ||
- loader.loadPageSync(location.pathname, { withErrorDetails: true }),
+ loader.loadPageSync(location.pathname + location.search, {
+ withErrorDetails: true,
+ }),
}
}
static getDerivedStateFromProps({ location }, prevState) {
if (prevState.location.href !== location.href) {
- const pageResources = loader.loadPageSync(location.pathname, {
- withErrorDetails: true,
- })
+ const pageResources = loader.loadPageSync(
+ location.pathname + location.search,
+ {
+ withErrorDetails: true,
+ }
+ )
return {
pageResources,
@@ -48,7 +53,9 @@ class EnsureResources extends React.Component {
shouldComponentUpdate(nextProps, nextState) {
// Always return false if we're missing resources.
if (!nextState.pageResources) {
- this.loadResources(nextProps.location.pathname)
+ this.loadResources(
+ nextProps.location.pathname + nextProps.location.search
+ )
return false
}
@@ -56,7 +63,9 @@ class EnsureResources extends React.Component {
process.env.BUILD_STAGE === `develop` &&
nextState.pageResources.stale
) {
- this.loadResources(nextProps.location.pathname)
+ this.loadResources(
+ nextProps.location.pathname + nextProps.location.search
+ )
return false
}
diff --git a/packages/gatsby/cache-dir/fast-refresh-overlay/components/getserverdata-error.js b/packages/gatsby/cache-dir/fast-refresh-overlay/components/getserverdata-error.js
new file mode 100644
index 0000000000000..69d4c1ac3cb47
--- /dev/null
+++ b/packages/gatsby/cache-dir/fast-refresh-overlay/components/getserverdata-error.js
@@ -0,0 +1,53 @@
+import * as React from "react"
+import { Overlay, Header, HeaderOpenClose, Body, Footer } from "./overlay"
+import { useFileCodeFrame } from "./hooks"
+import { CodeFrame } from "./code-frame"
+import { openInEditor } from "../utils"
+
+const filePathRegex = /webpack:\/[^/]+\/(.*)$/
+
+export function GetServerDataError({ error }) {
+ const stacktrace = error.stack
+ const info = stacktrace.find(CallSite => CallSite.fileName)
+ const filePath = `./${filePathRegex.exec(info?.fileName)[1]}`
+ const lineNumber = info?.lineNumber
+ const columnNumber = info?.columnNumber
+ const name =
+ info?.functionName === `Module.getServerData`
+ ? `getServerData`
+ : info?.functionName
+
+ const res = useFileCodeFrame({ filePath, lineNumber, columnNumber })
+
+ return (
+
+
+ openInEditor(filePath, lineNumber)}
+ />
+
+
+
+ )
+}
diff --git a/packages/gatsby/cache-dir/fast-refresh-overlay/components/hooks.js b/packages/gatsby/cache-dir/fast-refresh-overlay/components/hooks.js
index b8b2a5b869891..07690fe196594 100644
--- a/packages/gatsby/cache-dir/fast-refresh-overlay/components/hooks.js
+++ b/packages/gatsby/cache-dir/fast-refresh-overlay/components/hooks.js
@@ -45,3 +45,35 @@ export function useStackFrame({ moduleId, lineNumber, columnNumber }) {
return response
}
+
+export function useFileCodeFrame({ filePath, lineNumber, columnNumber }) {
+ const url =
+ `/__file-code-frame?filePath=` +
+ window.encodeURIComponent(filePath) +
+ `&lineNumber=` +
+ window.encodeURIComponent(lineNumber) +
+ `&columnNumber=` +
+ window.encodeURIComponent(columnNumber)
+
+ const [response, setResponse] = React.useState({ decoded: null })
+
+ React.useEffect(() => {
+ async function fetchData() {
+ try {
+ const res = await fetch(url)
+ const json = await res.json()
+ const decoded = prettifyStack(json.codeFrame)
+ setResponse({
+ decoded,
+ })
+ } catch (err) {
+ setResponse({
+ decoded: prettifyStack(err.message),
+ })
+ }
+ }
+ fetchData()
+ }, [])
+
+ return response
+}
diff --git a/packages/gatsby/cache-dir/fast-refresh-overlay/index.js b/packages/gatsby/cache-dir/fast-refresh-overlay/index.js
index 7fdca80e19b55..69c4ee0b699ee 100644
--- a/packages/gatsby/cache-dir/fast-refresh-overlay/index.js
+++ b/packages/gatsby/cache-dir/fast-refresh-overlay/index.js
@@ -6,6 +6,7 @@ import { BuildError } from "./components/build-error"
import { RuntimeErrors } from "./components/runtime-errors"
import { GraphqlErrors } from "./components/graphql-errors"
import { DevSsrError } from "./components/dev-ssr-error"
+import { GetServerDataError } from "./components/getserverdata-error"
const reducer = (state, event) => {
switch (event.action) {
@@ -28,6 +29,12 @@ const reducer = (state, event) => {
case `SHOW_RUNTIME_ERRORS`: {
return { ...state, errors: state.errors.concat(event.payload) }
}
+ case `SHOW_GETSERVERDATA_ERROR`: {
+ return {
+ ...state,
+ getServerDataError: event.payload,
+ }
+ }
case `SHOW_GRAPHQL_ERRORS`: {
return {
...state,
@@ -43,6 +50,7 @@ const reducer = (state, event) => {
buildError: null,
errors: [],
graphqlErrors: [],
+ getServerDataError: null,
}
}
default: {
@@ -55,6 +63,7 @@ const initialState = {
errors: [],
buildError: null,
devSsrError: null,
+ getServerDataError: null,
graphqlErrors: [],
}
@@ -83,21 +92,32 @@ function DevOverlay({ children }) {
const dismiss = () => {
dispatch({ action: `DISMISS` })
+ // Setting gatsbyEvents = [] is necessary for the runtime errors to correctly clear
+ // However, using this for serverData errors doesn't work and results in the overlay not showing up
+ // again since the component isn't remounted and thus the .push method is not reinitalized
window._gatsbyEvents = []
}
const hasBuildError = state.buildError !== null
const hasRuntimeErrors = Boolean(state.errors.length)
+ const hasGetServerDataError = Boolean(state.getServerDataError)
const hasGraphqlErrors = Boolean(state.graphqlErrors.length)
const hasDevSsrError = state.devSsrError !== null
const hasErrors =
- hasBuildError || hasRuntimeErrors || hasGraphqlErrors || hasDevSsrError
+ hasBuildError ||
+ hasRuntimeErrors ||
+ hasGraphqlErrors ||
+ hasDevSsrError ||
+ hasGetServerDataError
// This component has a deliberate order (priority)
const ErrorComponent = () => {
if (hasBuildError) {
return {
const { pagePath, location: browserLoc } = window
// Explicitly call navigate if the canonical path (window.pagePath)
- // is different to the browser path (window.location.pathname). But
- // only if NONE of the following conditions hold:
+ // is different to the browser path (window.location.pathname). SSR
+ // page paths might include search params, while SSG and DSG won't.
+ // If page path include search params we also compare query params.
+ // But only if NONE of the following conditions hold:
//
// - The url matches a client side route (page.matchPath)
// - it's a 404 page
// - it's the offline plugin shell (/offline-plugin-app-shell-fallback/)
if (
pagePath &&
- __BASE_PATH__ + pagePath !== browserLoc.pathname &&
+ __BASE_PATH__ + pagePath !==
+ browserLoc.pathname + (pagePath.includes(`?`) ? browserLoc.search : ``) &&
!(
loader.findMatchPath(stripPrefix(browserLoc.pathname, __BASE_PATH__)) ||
- pagePath === `/404.html` ||
- pagePath.match(/^\/404\/?$/) ||
+ pagePath.match(/^\/(404|500)(\/?|.html)$/) ||
pagePath.match(/^\/offline-plugin-app-shell-fallback\/?$/)
)
) {
- navigate(__BASE_PATH__ + pagePath + browserLoc.search + browserLoc.hash, {
+ navigate(__BASE_PATH__ + pagePath + browserLoc.hash, {
replace: true,
})
}
- publicLoader.loadPage(browserLoc.pathname).then(page => {
+ publicLoader.loadPage(browserLoc.pathname + browserLoc.search).then(page => {
if (!page || page.status === PageResourceStatus.Error) {
const message = `page resources for ${browserLoc.pathname} not found. Not rendering React`
diff --git a/packages/gatsby/cache-dir/query-result-store.js b/packages/gatsby/cache-dir/query-result-store.js
index 9923efb1b137d..8f15e11da7d8b 100644
--- a/packages/gatsby/cache-dir/query-result-store.js
+++ b/packages/gatsby/cache-dir/query-result-store.js
@@ -46,12 +46,32 @@ export class PageQueryStore extends React.Component {
componentDidMount() {
socketRegisterPath(getPathFromProps(this.props))
___emitter.on(`pageQueryResult`, this.handleMittEvent)
+ ___emitter.on(`serverDataResult`, this.handleMittEvent)
___emitter.on(`onPostLoadPageResources`, this.handleMittEvent)
+
+ window._gatsbyEvents.push([
+ `FAST_REFRESH`,
+ {
+ action: `SHOW_GETSERVERDATA_ERROR`,
+ payload: this.state?.page?.page?.getServerDataError,
+ },
+ ])
+ }
+
+ componentDidUpdate() {
+ window._gatsbyEvents.push([
+ `FAST_REFRESH`,
+ {
+ action: `SHOW_GETSERVERDATA_ERROR`,
+ payload: this.state?.page?.page?.getServerDataError,
+ },
+ ])
}
componentWillUnmount() {
socketUnregisterPath(this.state.path)
___emitter.off(`pageQueryResult`, this.handleMittEvent)
+ ___emitter.off(`serverDataResult`, this.handleMittEvent)
___emitter.off(`onPostLoadPageResources`, this.handleMittEvent)
}
@@ -87,6 +107,10 @@ export class PageQueryStore extends React.Component {
return
}
+ if (this.state.page.page.getServerDataError) {
+ return
+ }
+
return
{locationAndPageResources => (
@@ -48,8 +48,10 @@ class LocationHandler extends React.Component {
>
{
onScroll(): void
}
-export const useStaticQuery: (query: any) => TData
+class StaticQueryDocument {
+ /** Prevents structural type widening. */
+ #kind: "StaticQueryDocument"
+
+ /** Allows type-safe access to the static query hash for debugging purposes. */
+ toString(): string
+}
+
+/**
+ * A React Hooks version of StaticQuery.
+ *
+ * StaticQuery can do most of the things that page query can, including fragments. The main differences are:
+ *
+ * - page queries can accept variables (via `pageContext`) but can only be added to _page_ components
+ * - StaticQuery does not accept variables (hence the name "static"), but can be used in _any_ component, including pages
+ *
+ * @see https://www.gatsbyjs.com/docs/how-to/querying-data/use-static-query/
+ */
+export const useStaticQuery: (query: StaticQueryDocument) => TData
export const parsePath: (path: string) => WindowLocation
@@ -142,7 +160,7 @@ export class PageRenderer extends React.Component {}
type RenderCallback = (data: T) => React.ReactNode
export interface StaticQueryProps {
- query: any
+ query: StaticQueryDocument
render?: RenderCallback
children?: RenderCallback
}
@@ -168,7 +186,7 @@ export class StaticQuery extends React.Component<
*
* @see https://www.gatsbyjs.org/docs/page-query#how-does-the-graphql-tag-work
*/
-export const graphql: (query: TemplateStringsArray) => void
+export const graphql: (query: TemplateStringsArray) => StaticQueryDocument
/**
* Gatsby configuration API.
@@ -474,11 +492,8 @@ export interface GatsbyNode<
* built schema from `info.schema`.
* * Gatsby's data layer, including all internal query capabilities, is
* exposed on [`context.nodeModel`](/docs/node-model/). The node store can be
- * queried directly with `getAllNodes`, `getNodeById` and `getNodesByIds`,
- * while more advanced queries can be composed with `runQuery`. Note that
- * `runQuery` will call field resolvers before querying, so e.g. foreign-key
- * fields will be expanded to full nodes. The other methods on `nodeModel`
- * don't do this.
+ * queried directly with `findOne`, `getNodeById` and `getNodesByIds`,
+ * while more advanced queries can be composed with `findAll`.
* * It is possible to add fields to the root `Query` type.
* * When using the first resolver argument (`source` in the example below,
* often also called `parent` or `root`), take care of the fact that field
@@ -488,7 +503,7 @@ export interface GatsbyNode<
*
* For fuller examples, see [`using-type-definitions`](https://github.com/gatsbyjs/gatsby/tree/master/examples/using-type-definitions).
*
- * @see https://www.gatsbyjs.org/docs/node-apis/#createResolvers
+ * @see https://www.gatsbyjs.com/docs/reference/config-files/gatsby-node/#createResolvers
*/
createResolvers?(
args: CreateResolversArgs,
@@ -980,7 +995,7 @@ export interface NodePluginArgs {
* @example
* const node = getNode(id)
*/
- getNode(this: void, id: string): Node
+ getNode(this: void, id: string): Node | undefined
/**
* Get array of nodes of given type.
diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json
index 380c9e3e6b17b..bcbd6d0687c67 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": "4.0.0-zz-next.1",
+ "version": "4.0.0-zz-next.8",
"author": "Kyle Mathews ",
"bin": {
"gatsby": "./cli.js"
@@ -20,26 +20,26 @@
"@babel/types": "^7.15.4",
"@gatsbyjs/reach-router": "^1.3.6",
"@gatsbyjs/webpack-hot-middleware": "^2.25.2",
- "@nodelib/fs.walk": "^1.2.4",
+ "@nodelib/fs.walk": "^1.2.8",
"@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
- "@types/http-proxy": "^1.17.4",
- "@typescript-eslint/eslint-plugin": "^4.29.3",
- "@typescript-eslint/parser": "^4.29.3",
- "@vercel/webpack-asset-relocator-loader": "^1.6.0",
+ "@types/http-proxy": "^1.17.7",
+ "@typescript-eslint/eslint-plugin": "^4.33.0",
+ "@typescript-eslint/parser": "^4.33.0",
+ "@vercel/webpack-asset-relocator-loader": "^1.7.0",
"address": "1.1.2",
- "anser": "^2.0.1",
- "autoprefixer": "^10.2.4",
+ "anser": "^2.0.2",
+ "autoprefixer": "^10.3.7",
"axios": "^0.21.1",
"babel-loader": "^8.2.2",
"babel-plugin-add-module-exports": "^1.0.4",
"babel-plugin-dynamic-import-node": "^2.3.3",
"babel-plugin-lodash": "^3.3.4",
- "babel-plugin-remove-graphql-queries": "^4.0.0-zz-next.1",
- "babel-preset-gatsby": "^2.0.0-zz-next.1",
- "better-opn": "^2.0.0",
+ "babel-plugin-remove-graphql-queries": "^4.0.0-zz-next.3",
+ "babel-preset-gatsby": "^2.0.0-zz-next.4",
+ "better-opn": "^2.1.1",
"bluebird": "^3.7.2",
"body-parser": "^1.19.0",
- "browserslist": "^4.12.2",
+ "browserslist": "^4.17.3",
"cache-manager": "^2.11.1",
"chalk": "^4.1.2",
"chokidar": "^3.5.2",
@@ -48,117 +48,116 @@
"cookie": "^0.4.1",
"core-js": "^3.17.2",
"cors": "^2.8.5",
- "css-loader": "^5.0.1",
+ "css-loader": "^5.2.7",
"css-minimizer-webpack-plugin": "^2.0.0",
"css.escape": "^1.5.1",
- "date-fns": "^2.14.0",
+ "date-fns": "^2.25.0",
"debug": "^3.2.7",
"deepmerge": "^4.2.2",
"del": "^5.1.0",
"detect-port": "^1.3.0",
- "devcert": "^1.1.3",
- "dotenv": "^8.2.0",
+ "devcert": "^1.2.0",
+ "dotenv": "^8.6.0",
"eslint": "^7.32.0",
"eslint-config-react-app": "^6.0.0",
- "eslint-plugin-flowtype": "^5.9.2",
+ "eslint-plugin-flowtype": "^5.10.0",
"eslint-plugin-graphql": "^4.0.0",
"eslint-plugin-import": "^2.24.2",
"eslint-plugin-jsx-a11y": "^6.4.1",
- "eslint-plugin-react": "^7.25.1",
+ "eslint-plugin-react": "^7.26.1",
"eslint-plugin-react-hooks": "^4.2.0",
"eslint-webpack-plugin": "^2.5.4",
- "event-source-polyfill": "^1.0.15",
+ "event-source-polyfill": "^1.0.25",
"execa": "^5.1.1",
"express": "^4.17.1",
"express-graphql": "^0.12.0",
"fastest-levenshtein": "^1.0.12",
- "fastq": "^1.10.0",
+ "fastq": "^1.13.0",
"file-loader": "^6.2.0",
- "find-cache-dir": "^3.3.1",
+ "find-cache-dir": "^3.3.2",
"fs-exists-cached": "1.0.0",
"fs-extra": "^10.0.0",
- "gatsby-cli": "^4.0.0-zz-next.1",
- "gatsby-core-utils": "^3.0.0-zz-next.1",
- "gatsby-graphiql-explorer": "^2.0.0-zz-next.1",
- "gatsby-legacy-polyfills": "^2.0.0-zz-next.1",
- "gatsby-link": "^4.0.0-zz-next.1",
- "gatsby-plugin-page-creator": "^4.0.0-zz-next.1",
- "gatsby-plugin-typescript": "^4.0.0-zz-next.1",
- "gatsby-plugin-utils": "^2.0.0-zz-next.1",
- "gatsby-react-router-scroll": "^5.0.0-zz-next.1",
- "gatsby-telemetry": "^3.0.0-zz-next.1",
- "gatsby-worker": "^1.0.0-zz-next.1",
- "glob": "^7.1.6",
+ "gatsby-cli": "^4.0.0-zz-next.5",
+ "gatsby-core-utils": "^3.0.0-zz-next.3",
+ "gatsby-graphiql-explorer": "^2.0.0-zz-next.2",
+ "gatsby-legacy-polyfills": "^2.0.0-zz-next.2",
+ "gatsby-link": "^4.0.0-zz-next.4",
+ "gatsby-plugin-page-creator": "^4.0.0-zz-next.3",
+ "gatsby-plugin-typescript": "^4.0.0-zz-next.3",
+ "gatsby-plugin-utils": "^2.0.0-zz-next.3",
+ "gatsby-react-router-scroll": "^5.0.0-zz-next.3",
+ "gatsby-telemetry": "^3.0.0-zz-next.3",
+ "gatsby-worker": "^1.0.0-zz-next.4",
+ "glob": "^7.2.0",
"got": "^11.8.2",
- "graphql": "^15.4.0",
- "graphql-compose": "~7.25.0",
- "graphql-playground-middleware-express": "^1.7.18",
- "hasha": "^5.2.0",
+ "graphql": "^15.6.1",
+ "graphql-compose": "~7.25.1",
+ "graphql-playground-middleware-express": "^1.7.22",
+ "hasha": "^5.2.2",
"http-proxy": "^1.18.1",
"invariant": "^2.2.4",
"is-relative": "^1.0.0",
"is-relative-url": "^3.0.0",
- "joi": "^17.2.1",
+ "joi": "^17.4.2",
"json-loader": "^0.5.7",
"latest-version": "5.1.0",
"lmdb-store": "^1.6.8",
"lodash": "^4.17.21",
"md5-file": "^5.0.0",
- "meant": "^1.0.1",
+ "meant": "^1.0.3",
"memoizee": "^0.4.15",
- "micromatch": "^4.0.2",
- "mime": "^2.4.6",
+ "micromatch": "^4.0.4",
+ "mime": "^2.5.2",
"mini-css-extract-plugin": "1.6.2",
"mitt": "^1.2.0",
- "moment": "^2.27.0",
- "multer": "^1.4.2",
- "node-fetch": "^2.6.2",
+ "moment": "^2.29.1",
+ "multer": "^1.4.3",
+ "node-fetch": "^2.6.5",
"normalize-path": "^3.0.0",
"null-loader": "^4.0.1",
- "opentracing": "^0.14.4",
+ "opentracing": "^0.14.5",
"p-defer": "^3.0.0",
"parseurl": "^1.3.3",
- "path-to-regexp": "0.1.7",
"physical-cpu-count": "^2.0.0",
"platform": "^1.3.6",
- "postcss": "^8.3.5",
+ "postcss": "^8.3.9",
"postcss-flexbugs-fixes": "^5.0.2",
- "postcss-loader": "^5.0.0",
- "prompts": "^2.3.2",
+ "postcss-loader": "^5.3.0",
+ "prompts": "^2.4.2",
"prop-types": "^15.7.2",
- "query-string": "^6.13.1",
+ "query-string": "^6.14.1",
"raw-loader": "^4.0.2",
- "react-dev-utils": "^11.0.3",
+ "react-dev-utils": "^11.0.4",
"react-refresh": "^0.9.0",
- "redux": "^4.0.5",
+ "redux": "4.0.5",
"redux-thunk": "^2.3.0",
"resolve-from": "^5.0.0",
"semver": "^7.3.5",
"shallow-compare": "^1.2.2",
- "signal-exit": "^3.0.3",
- "slugify": "^1.4.4",
- "socket.io": "3.1.1",
- "socket.io-client": "3.1.1",
+ "signal-exit": "^3.0.5",
+ "slugify": "^1.6.1",
+ "socket.io": "3.1.2",
+ "socket.io-client": "3.1.3",
"source-map": "^0.7.3",
- "source-map-support": "^0.5.19",
+ "source-map-support": "^0.5.20",
"st": "^2.0.0",
"stack-trace": "^0.0.10",
"string-similarity": "^1.2.2",
"strip-ansi": "^5.2.0",
"style-loader": "^2.0.0",
- "terser-webpack-plugin": "^5.1.1",
+ "terser-webpack-plugin": "^5.2.4",
"tmp": "^0.2.1",
"true-case-path": "^2.2.1",
"type-of": "^2.0.1",
"url-loader": "^4.1.1",
- "uuid": "3.4.0",
- "v8-compile-cache": "^2.2.0",
- "webpack": "^5.35.0",
- "webpack-dev-middleware": "^4.1.0",
- "webpack-merge": "^5.7.3",
+ "uuid": "^8.3.2",
+ "v8-compile-cache": "^2.3.0",
+ "webpack": "^5.58.1",
+ "webpack-dev-middleware": "^4.3.0",
+ "webpack-merge": "^5.8.0",
"webpack-stats-plugin": "^1.0.3",
"webpack-virtual-modules": "^0.3.2",
- "xstate": "^4.11.0",
+ "xstate": "^4.25.0",
"yaml-loader": "^0.6.0"
},
"devDependencies": {
@@ -175,7 +174,7 @@
"@types/string-similarity": "^4.0.0",
"@types/tmp": "^0.2.0",
"@types/webpack-virtual-modules": "^0.1.1",
- "babel-preset-gatsby-package": "^2.0.0-zz-next.1",
+ "babel-preset-gatsby-package": "^2.0.0-zz-next.2",
"copyfiles": "^2.3.0",
"cross-env": "^7.0.3",
"documentation": "^13.1.0",
@@ -183,7 +182,7 @@
"react": "^16.12.0",
"react-dom": "^16.12.0",
"rimraf": "^3.0.2",
- "typescript": "^4.3.5",
+ "typescript": "^4.4.3",
"xhr-mock": "^2.5.1",
"zipkin": "^0.22.0",
"zipkin-javascript-opentracing": "^3.0.0",
@@ -198,7 +197,6 @@
"cache-dir/",
"cli.js",
"dist/",
- "gatsby-admin-public/",
"graphql.js",
"graphql.d.ts",
"reporter.js",
@@ -234,7 +232,7 @@
"url": "git+https://github.com/gatsbyjs/gatsby.git"
},
"resolutions": {
- "graphql": "^15.5.1",
+ "graphql": "^15.6.1",
"@mdx-js/mdx": "^2.0.0-next.3",
"@mdx-js/react": "^2.0.0-next.3",
"@mdx-js/runtime": "^2.0.0-next.3",
@@ -243,7 +241,7 @@
},
"scripts": {
"build": "npm run build:types && npm run build:src && npm run build:internal-plugins && npm run build:rawfiles && npm run build:cjs",
- "postbuild": "node scripts/output-api-file.js && yarn workspace gatsby-admin build",
+ "postbuild": "node scripts/output-api-file.js",
"build:internal-plugins": "copyfiles -u 1 src/internal-plugins/**/package.json dist",
"build:rawfiles": "copyfiles -u 1 src/internal-plugins/**/raw_* dist",
"build:cjs": "babel cache-dir --out-dir cache-dir/commonjs --ignore \"**/__tests__\" --ignore \"**/__mocks__\" && copyfiles -u 1 cache-dir/**/*.json cache-dir/commonjs",
diff --git a/packages/gatsby/src/bootstrap/__tests__/__snapshots__/remove-stale-jobs.ts.snap b/packages/gatsby/src/bootstrap/__tests__/__snapshots__/remove-stale-jobs.ts.snap
index 602bce1a72ea5..aca1999b58d21 100644
--- a/packages/gatsby/src/bootstrap/__tests__/__snapshots__/remove-stale-jobs.ts.snap
+++ b/packages/gatsby/src/bootstrap/__tests__/__snapshots__/remove-stale-jobs.ts.snap
@@ -2,6 +2,21 @@
exports[`remove-stale-jobs should enqueue pending jobs 1`] = `
Array [
+ Object {
+ "payload": Object {
+ "job": Object {
+ "contentDigest": "1234",
+ "inputPaths": Array [
+ "/src/myfile.js",
+ ],
+ "plugin": Object {
+ "name": "test",
+ },
+ },
+ "requestId": "",
+ },
+ "type": "SET_JOB_V2_CONTEXT",
+ },
Object {
"payload": Object {
"job": Object {
diff --git a/packages/gatsby/src/bootstrap/__tests__/requires-writer.js b/packages/gatsby/src/bootstrap/__tests__/requires-writer.js
index 945c8a53c818a..b85af8c2f6368 100644
--- a/packages/gatsby/src/bootstrap/__tests__/requires-writer.js
+++ b/packages/gatsby/src/bootstrap/__tests__/requires-writer.js
@@ -18,6 +18,12 @@ const generatePagesState = pages => {
return state
}
+jest.mock(`../../utils/page-mode`, () => {
+ return {
+ getPageMode: jest.fn(page => page.mode),
+ }
+})
+
jest.mock(`fs-extra`, () => {
return {
writeFile: () => Promise.resolve(),
diff --git a/packages/gatsby/src/bootstrap/index.ts b/packages/gatsby/src/bootstrap/index.ts
index 64cebb88f677b..fe3768df909a1 100644
--- a/packages/gatsby/src/bootstrap/index.ts
+++ b/packages/gatsby/src/bootstrap/index.ts
@@ -11,7 +11,6 @@ import {
extractQueries,
writeOutRedirects,
postBootstrap,
- rebuildSchemaWithSitePage,
} from "../services"
import { Runner, createGraphQLRunner } from "./create-graphql-runner"
import { globalTracer } from "opentracing"
@@ -70,8 +69,6 @@ export async function bootstrap(
await handleStalePageData(parentSpan)
- await rebuildSchemaWithSitePage(context)
-
if (process.env.GATSBY_EXPERIMENTAL_PARALLEL_QUERY_RUNNING) {
savePartialStateToDisk([`inferenceMetadata`])
diff --git a/packages/gatsby/src/bootstrap/load-plugins/__tests__/__snapshots__/load-plugins.ts.snap b/packages/gatsby/src/bootstrap/load-plugins/__tests__/__snapshots__/load-plugins.ts.snap
index c28c6f35d04de..d5a11bbf53b57 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/__tests__/__snapshots__/load-plugins.ts.snap
+++ b/packages/gatsby/src/bootstrap/load-plugins/__tests__/__snapshots__/load-plugins.ts.snap
@@ -48,7 +48,7 @@ Array [
Object {
"browserAPIs": Array [],
"id": "",
- "name": "prod-404",
+ "name": "prod-404-500",
"nodeAPIs": Array [],
"pluginOptions": Object {
"plugins": Array [],
@@ -176,7 +176,7 @@ Array [
"onPluginInit",
],
"pluginOptions": Object {
- "path": "/packages/gatsby/src/internal-plugins/prod-404/src/pages",
+ "path": "/packages/gatsby/src/internal-plugins/prod-404-500/src/pages",
"pathCheck": false,
"plugins": Array [],
},
@@ -355,7 +355,7 @@ Array [
Object {
"browserAPIs": Array [],
"id": "",
- "name": "prod-404",
+ "name": "prod-404-500",
"nodeAPIs": Array [],
"pluginOptions": Object {
"plugins": Array [],
@@ -495,7 +495,7 @@ Array [
"onPluginInit",
],
"pluginOptions": Object {
- "path": "/packages/gatsby/src/internal-plugins/prod-404/src/pages",
+ "path": "/packages/gatsby/src/internal-plugins/prod-404-500/src/pages",
"pathCheck": false,
"plugins": Array [],
},
@@ -695,7 +695,7 @@ Array [
Object {
"browserAPIs": Array [],
"id": "",
- "name": "prod-404",
+ "name": "prod-404-500",
"nodeAPIs": Array [],
"pluginOptions": Object {
"plugins": Array [],
@@ -846,7 +846,7 @@ Array [
"onPluginInit",
],
"pluginOptions": Object {
- "path": "/packages/gatsby/src/internal-plugins/prod-404/src/pages",
+ "path": "/packages/gatsby/src/internal-plugins/prod-404-500/src/pages",
"pathCheck": false,
"plugins": Array [],
},
diff --git a/packages/gatsby/src/bootstrap/load-plugins/index.ts b/packages/gatsby/src/bootstrap/load-plugins/index.ts
index b3f9e1758a37c..50f064b7b023e 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/index.ts
+++ b/packages/gatsby/src/bootstrap/load-plugins/index.ts
@@ -22,9 +22,9 @@ import {
} from "./types"
import { IPluginRefObject, PluginRef } from "gatsby-plugin-utils/dist/types"
-const getAPI = (
- api: { [exportType in ExportType]: { [api: string]: boolean } }
-): ICurrentAPIs =>
+const getAPI = (api: {
+ [exportType in ExportType]: { [api: string]: boolean }
+}): ICurrentAPIs =>
_.keys(api).reduce>((merged, key) => {
merged[key] = _.keys(api[key])
return merged
diff --git a/packages/gatsby/src/bootstrap/load-plugins/load.ts b/packages/gatsby/src/bootstrap/load-plugins/load.ts
index 215f9243ce15e..7ae7d3d152846 100644
--- a/packages/gatsby/src/bootstrap/load-plugins/load.ts
+++ b/packages/gatsby/src/bootstrap/load-plugins/load.ts
@@ -268,7 +268,7 @@ export function loadPlugins(
`../../internal-plugins/dev-404-page`,
`../../internal-plugins/load-babel-config`,
`../../internal-plugins/internal-data-bridge`,
- `../../internal-plugins/prod-404`,
+ `../../internal-plugins/prod-404-500`,
`../../internal-plugins/webpack-theme-component-shadowing`,
`../../internal-plugins/bundle-optimisations`,
`../../internal-plugins/functions`,
diff --git a/packages/gatsby/src/bootstrap/requires-writer.ts b/packages/gatsby/src/bootstrap/requires-writer.ts
index 4b2cd8119105d..d31f84a490809 100644
--- a/packages/gatsby/src/bootstrap/requires-writer.ts
+++ b/packages/gatsby/src/bootstrap/requires-writer.ts
@@ -12,6 +12,7 @@ import {
writeModule,
getAbsolutePathForVirtualModule,
} from "../utils/gatsby-webpack-virtual-modules"
+import { getPageMode } from "../utils/page-mode"
interface IGatsbyPageComponent {
component: string
@@ -109,7 +110,7 @@ const getMatchPaths = (
pages.forEach((page: IGatsbyPage, index: number): void => {
if (_CFLAGS_.GATSBY_MAJOR === `4`) {
- if (page.matchPath && page.mode === `SSG`) {
+ if (page.matchPath && getPageMode(page) === `SSG`) {
matchPathPages.push(createMatchPathEntry(page, index))
}
} else {
diff --git a/packages/gatsby/src/commands/__tests__/build-utils.ts b/packages/gatsby/src/commands/__tests__/build-utils.ts
index b5609acf8db58..42b825c22640b 100644
--- a/packages/gatsby/src/commands/__tests__/build-utils.ts
+++ b/packages/gatsby/src/commands/__tests__/build-utils.ts
@@ -9,6 +9,7 @@ const platformSpy = jest.spyOn(require(`os`), `platform`)
interface IMinimalStateSliceForTest {
html: IGatsbyState["html"]
pages: IGatsbyState["pages"]
+ components: IGatsbyState["components"]
}
describe(`calcDirtyHtmlFiles`, () => {
@@ -37,7 +38,16 @@ describe(`calcDirtyHtmlFiles`, () => {
unsafeBuiltinWasUsedInSSR: false,
trackedStaticQueryResults: new Map(),
},
+ components: new Map(),
}
+ state.components.set(`/foo`, {
+ componentPath: `/foo`,
+ componentChunkName: `foo`,
+ pages: new Set(),
+ isInBootstrap: false,
+ query: ``,
+ serverData: false,
+ })
for (const pagePath in pages) {
const page = pages[pagePath]
@@ -57,6 +67,8 @@ describe(`calcDirtyHtmlFiles`, () => {
pluginCreator___NODE: `foo`,
updatedAt: 1,
mode: `SSG`,
+ defer: false,
+ ownerNodeId: ``,
})
}
diff --git a/packages/gatsby/src/commands/build-html.ts b/packages/gatsby/src/commands/build-html.ts
index b51488f0c0b3e..fa171d7d5be09 100644
--- a/packages/gatsby/src/commands/build-html.ts
+++ b/packages/gatsby/src/commands/build-html.ts
@@ -3,11 +3,12 @@ import fs from "fs-extra"
import reporter from "gatsby-cli/lib/reporter"
import { createErrorFromString } from "gatsby-cli/lib/reporter/errors"
import { chunk, truncate } from "lodash"
-import webpack, { Stats } from "webpack"
+import { build, watch } from "../utils/webpack/bundle"
import * as path from "path"
import { emitter, store } from "../redux"
import { IWebpackWatchingPauseResume } from "../utils/start-server"
+import webpack from "webpack"
import webpackConfig from "../utils/webpack.config"
import { structureWebpackErrors } from "../utils/webpack-error-utils"
import * as buildUtils from "./build-utils"
@@ -17,12 +18,14 @@ import { Span } from "opentracing"
import { IProgram, Stage } from "./types"
import { ROUTES_DIRECTORY } from "../constants"
import { PackageJson } from "../.."
-import type { GatsbyWorkerPool } from "../utils/worker/pool"
import { IPageDataWithQueryResult } from "../utils/page-data"
import { processNodeManifests } from "../utils/node-manifest"
+import type { GatsbyWorkerPool } from "../utils/worker/pool"
type IActivity = any // TODO
+const isPreview = process.env.GATSBY_IS_PREVIEW === `true`
+
export interface IBuildArgs extends IProgram {
directory: string
sitePackageJson: PackageJson
@@ -37,8 +40,13 @@ export interface IBuildArgs extends IProgram {
keepPageRenderer: boolean
}
-let devssrWebpackCompiler: webpack.Compiler
-let devssrWebpackWatcher: IWebpackWatchingPauseResume
+interface IBuildRendererResult {
+ rendererPath: string
+ stats: webpack.Stats
+ close: ReturnType["close"]
+}
+
+let devssrWebpackCompiler: webpack.Watching | undefined
let needToRecompileSSRBundle = true
export const getDevSSRWebpack = (): {
devssrWebpackWatcher: IWebpackWatchingPauseResume
@@ -50,8 +58,8 @@ export const getDevSSRWebpack = (): {
}
return {
- devssrWebpackWatcher,
- devssrWebpackCompiler,
+ devssrWebpackWatcher: devssrWebpackCompiler as webpack.Watching,
+ devssrWebpackCompiler: (devssrWebpackCompiler as webpack.Watching).compiler,
needToRecompileSSRBundle,
}
}
@@ -61,60 +69,33 @@ let newHash = ``
const runWebpack = (
compilerConfig,
stage: Stage,
- directory,
- parentSpan?: Span
-): Bluebird<{
- stats: Stats
- waitForCompilerClose: Promise
-}> =>
- new Bluebird((resolve, reject) => {
- if (!process.env.GATSBY_EXPERIMENTAL_DEV_SSR || stage === `build-html`) {
+ directory: string
+): Promise<{
+ stats: webpack.Stats
+ close: ReturnType["close"]
+}> => {
+ const isDevSSREnabledAndViable =
+ process.env.GATSBY_EXPERIMENTAL_DEV_SSR && stage === `develop-html`
+
+ return new Promise((resolve, reject) => {
+ if (isDevSSREnabledAndViable) {
const compiler = webpack(compilerConfig)
- compiler.run((err, stats) => {
- let activity
- if (process.env.GATSBY_EXPERIMENTAL_PRESERVE_WEBPACK_CACHE) {
- activity = reporter.activityTimer(
- `Caching HTML renderer compilation`,
- { parentSpan }
- )
- activity.start()
- }
-
- const waitForCompilerClose = new Promise((resolve, reject) => {
- compiler.close(error => {
- if (activity) {
- activity.end()
- }
- if (error) {
- return reject(error)
- }
- return resolve()
- })
- })
-
- if (err) {
- return reject(err)
- } else {
- return resolve({ stats: stats as Stats, waitForCompilerClose })
- }
- })
- } else if (
- process.env.GATSBY_EXPERIMENTAL_DEV_SSR &&
- stage === `develop-html`
- ) {
- devssrWebpackCompiler = webpack(compilerConfig)
- devssrWebpackCompiler.hooks.invalid.tap(`ssr file invalidation`, () => {
+ // because of this line we can't use our watch helper
+ // These things should use emitter
+ compiler.hooks.invalid.tap(`ssr file invalidation`, () => {
needToRecompileSSRBundle = true
})
- devssrWebpackWatcher = devssrWebpackCompiler.watch(
+
+ const watcher = compiler.watch(
{
ignored: /node_modules/,
},
(err, stats) => {
+ // this runs multiple times
needToRecompileSSRBundle = false
emitter.emit(`DEV_SSR_COMPILATION_DONE`)
- devssrWebpackWatcher.suspend()
+ watcher.suspend()
if (err) {
return reject(err)
@@ -132,45 +113,44 @@ const runWebpack = (
oldHash = newHash
return resolve({
- stats: stats as Stats,
- waitForCompilerClose: Promise.resolve(),
+ stats: stats as webpack.Stats,
+ close: () =>
+ new Promise((resolve, reject): void =>
+ watcher.close(err => (err ? reject(err) : resolve()))
+ ),
})
}
}
- ) as IWebpackWatchingPauseResume
+ )
+ devssrWebpackCompiler = watcher
+ } else {
+ build(compilerConfig).then(
+ ({ stats, close }) => {
+ resolve({ stats, close })
+ },
+ err => reject(err)
+ )
}
})
+}
const doBuildRenderer = async (
- { directory }: IProgram,
+ directory: string,
webpackConfig: webpack.Configuration,
- stage: Stage,
- parentSpan?: Span
-): Promise<{ rendererPath: string; waitForCompilerClose }> => {
- const { stats, waitForCompilerClose } = await runWebpack(
- webpackConfig,
- stage,
- directory,
- parentSpan
- )
- if (stats.hasErrors()) {
- reporter.panic(structureWebpackErrors(stage, stats.compilation.errors))
- }
-
- if (
- stage === `build-html` &&
- store.getState().html.ssrCompilationHash !== stats.hash
- ) {
- store.dispatch({
- type: `SET_SSR_WEBPACK_COMPILATION_HASH`,
- payload: stats.hash as string,
- })
+ stage: Stage
+): Promise => {
+ const { stats, close } = await runWebpack(webpackConfig, stage, directory)
+ if (stats?.hasErrors()) {
+ reporter.panicOnBuild(
+ structureWebpackErrors(stage, stats.compilation.errors)
+ )
}
// render-page.js is hard coded in webpack.config
return {
rendererPath: `${directory}/${ROUTES_DIRECTORY}render-page.js`,
- waitForCompilerClose,
+ stats,
+ close,
}
}
@@ -178,13 +158,12 @@ export const buildRenderer = async (
program: IProgram,
stage: Stage,
parentSpan?: IActivity
-): Promise<{ rendererPath: string; waitForCompilerClose }> => {
- const { directory } = program
- const config = await webpackConfig(program, directory, stage, null, {
+): Promise => {
+ const config = await webpackConfig(program, program.directory, stage, null, {
parentSpan,
})
- return doBuildRenderer(program, config, stage, parentSpan)
+ return doBuildRenderer(program.directory, config, stage)
}
// TODO remove after v4 release and update cloud internals
@@ -198,6 +177,7 @@ export const deleteRenderer = async (rendererPath: string): Promise => {
}
export interface IRenderHtmlResult {
unsafeBuiltinsUsageByPagePath: Record>
+ previewErrors: Record
}
const renderHTMLQueue = async (
@@ -235,6 +215,50 @@ const renderHTMLQueue = async (
sessionId,
})
+ if (isPreview) {
+ const htmlRenderMeta = renderHTMLResult as IRenderHtmlResult
+ const seenErrors = new Set()
+ const errorMessages = new Map()
+ await Promise.all(
+ Object.entries(htmlRenderMeta.previewErrors).map(
+ async ([pagePath, error]) => {
+ if (!seenErrors.has(error.stack)) {
+ errorMessages.set(error.stack, {
+ pagePaths: [pagePath],
+ })
+ seenErrors.add(error.stack)
+ const prettyError = await createErrorFromString(
+ error.stack,
+ `${htmlComponentRendererPath}.map`
+ )
+
+ const errorMessageStr = `${prettyError.stack}${
+ prettyError.codeFrame ? `\n\n${prettyError.codeFrame}\n` : ``
+ }`
+
+ const errorMessage = errorMessages.get(error.stack)
+ errorMessage.errorMessage = errorMessageStr
+ errorMessages.set(error.stack, errorMessage)
+ } else {
+ const errorMessage = errorMessages.get(error.stack)
+ errorMessage.pagePaths.push(pagePath)
+ errorMessages.set(error.stack, errorMessage)
+ }
+ }
+ )
+ )
+
+ for (const value of errorMessages.values()) {
+ const errorMessage = `The following page(s) saw this error when building their HTML:\n\n${value.pagePaths
+ .map(p => `- ${p}`)
+ .join(`\n`)}\n\n${value.errorMessage}`
+ reporter.error({
+ id: `95314`,
+ context: { errorMessage },
+ })
+ }
+ }
+
if (stage === `build-html`) {
const htmlRenderMeta = renderHTMLResult as IRenderHtmlResult
store.dispatch({
@@ -349,10 +373,23 @@ export const doBuildPages = async (
error.context.path
}": ${JSON.stringify(truncatedPageData, null, 2)}`
- reporter.error(pageDataMessage)
+ // This is our only error during preview so customize it a bit + add the
+ // pretty build error.
+ if (isPreview) {
+ reporter.error({
+ id: `95314`,
+ context: { pageData: pageDataMessage },
+ error: buildError,
+ })
+ } else {
+ reporter.error(pageDataMessage)
+ }
}
- throw buildError
+ // Don't crash the builder when we're in preview-mode.
+ if (!isPreview) {
+ throw buildError
+ }
}
}
diff --git a/packages/gatsby/src/commands/build-javascript.ts b/packages/gatsby/src/commands/build-javascript.ts
index 4552a9bca4c35..24001f2eefd8b 100644
--- a/packages/gatsby/src/commands/build-javascript.ts
+++ b/packages/gatsby/src/commands/build-javascript.ts
@@ -1,20 +1,12 @@
import { Span } from "opentracing"
-import webpack, { WebpackError } from "webpack"
import webpackConfig from "../utils/webpack.config"
-import { IProgram } from "./types"
-import reporter from "gatsby-cli/lib/reporter"
-import {
- showExperimentNoticeAfterTimeout,
- CancelExperimentNoticeCallbackOrUndefined,
-} from "../utils/show-experiment-notice"
+import { build } from "../utils/webpack/bundle"
+import type { IProgram } from "./types"
export const buildProductionBundle = async (
program: IProgram,
parentSpan: Span
-): Promise<{
- stats: webpack.Stats | Error | Array
- waitForCompilerClose: Promise
-}> => {
+): Promise> => {
const { directory } = program
const compilerConfig = await webpackConfig(
@@ -25,67 +17,5 @@ export const buildProductionBundle = async (
{ parentSpan }
)
- return new Promise((resolve, reject) => {
- const compiler = webpack(compilerConfig)
-
- const THIRTY_SECONDS = 30 * 1000
- let cancelCacheNotice: CancelExperimentNoticeCallbackOrUndefined
- if (
- process.env.gatsby_executing_command === `build` &&
- !process.env.GATSBY_EXPERIMENTAL_PRESERVE_WEBPACK_CACHE
- ) {
- cancelCacheNotice = showExperimentNoticeAfterTimeout(
- `Persistent webpack caching`,
- `https://github.com/gatsbyjs/gatsby/discussions/28331`,
- `which enables webpack's persist caching and changes Gatsby's cache clearing behavior to not clear webpack's
-cache unless you run "gatsby clean" or delete the .cache folder manually.
-Here's how to try it:
-
-module.exports = {
- flags: { PRESERVE_WEBPACK_CACHE: true },
- plugins: [...]
-}`,
- THIRTY_SECONDS
- )
- }
-
- compiler.run((err, stats) => {
- if (cancelCacheNotice) {
- cancelCacheNotice()
- }
-
- // stats can only be empty when an error occurs. Adding it to the if makes typescript happy.
- if (err || !stats) {
- return reject(err)
- }
-
- if (stats.hasErrors()) {
- return reject(stats.compilation.errors)
- }
-
- let activity
- if (process.env.GATSBY_EXPERIMENTAL_PRESERVE_WEBPACK_CACHE) {
- activity = reporter.activityTimer(
- `Caching JavaScript and CSS webpack compilation`,
- { parentSpan }
- )
- activity.start()
- }
-
- const waitForCompilerClose = new Promise((resolve, reject) => {
- compiler.close(error => {
- if (activity) {
- activity.end()
- }
-
- if (error) {
- return reject(error)
- }
- return resolve()
- })
- })
-
- return resolve({ stats, waitForCompilerClose })
- })
- })
+ return build(compilerConfig)
}
diff --git a/packages/gatsby/src/commands/build-utils.ts b/packages/gatsby/src/commands/build-utils.ts
index 72b3b087ad76d..ece72c8746c63 100644
--- a/packages/gatsby/src/commands/build-utils.ts
+++ b/packages/gatsby/src/commands/build-utils.ts
@@ -10,6 +10,7 @@ import {
import { removePageData } from "../utils/page-data"
import { store } from "../redux"
import { IGatsbyState } from "../redux/types"
+import { getPageMode } from "../utils/page-mode"
const checkFolderIsEmpty = (path: string): boolean =>
fs.existsSync(path) && !fs.readdirSync(path).length
@@ -160,7 +161,7 @@ export function calcDirtyHtmlFiles(state: IGatsbyState): {
markActionForPage(path, `delete`)
} else {
if (_CFLAGS_.GATSBY_MAJOR === `4`) {
- if (page.mode === `SSG`) {
+ if (getPageMode(page, state) === `SSG`) {
if (htmlFile.dirty || state.html.unsafeBuiltinWasUsedInSSR) {
markActionForPage(path, `regenerate`)
} else {
diff --git a/packages/gatsby/src/commands/build.ts b/packages/gatsby/src/commands/build.ts
index ec95ff0931ffe..bb51593db2a10 100644
--- a/packages/gatsby/src/commands/build.ts
+++ b/packages/gatsby/src/commands/build.ts
@@ -3,7 +3,7 @@ import report from "gatsby-cli/lib/reporter"
import signalExit from "signal-exit"
import fs from "fs-extra"
import telemetry from "gatsby-telemetry"
-import { updateSiteMetadata, isTruthy } from "gatsby-core-utils"
+import { updateSiteMetadata, isTruthy, uuid } from "gatsby-core-utils"
import {
buildRenderer,
buildHTMLPagesAndDeleteStaleArtifacts,
@@ -48,15 +48,20 @@ import {
runQueriesInWorkersQueue,
} from "../utils/worker/pool"
import { createGraphqlEngineBundle } from "../schema/graphql-engine/bundle-webpack"
-import { createPageSSRBundle } from "../utils/page-ssr-module/bundle-webpack"
+import {
+ createPageSSRBundle,
+ writeQueryContext,
+} from "../utils/page-ssr-module/bundle-webpack"
import { shouldGenerateEngines } from "../utils/engines-helpers"
-import uuidv4 from "uuid/v4"
import reporter from "gatsby-cli/lib/reporter"
+import type webpack from "webpack"
+import { materializePageMode, getPageMode } from "../utils/page-mode"
+import { validateEngines } from "../utils/validate-engines"
module.exports = async function build(program: IBuildArgs): Promise {
// global gatsby object to use without store
global.__GATSBY = {
- buildId: uuidv4(),
+ buildId: uuid.v4(),
root: program!.directory,
}
@@ -102,11 +107,130 @@ module.exports = async function build(program: IBuildArgs): Promise {
parentSpan: buildSpan,
})
+ // writes sync and async require files to disk
+ // used inside routing "html" + "javascript"
+ await writeOutRequires({
+ store,
+ parentSpan: buildSpan,
+ })
+
+ let closeJavascriptBundleCompilation: (() => Promise) | undefined
+ let closeHTMLBundleCompilation: (() => Promise) | undefined
+ let webpackAssets: Array | null = null
+ let webpackCompilationHash: string | null = null
+ let webpackSSRCompilationHash: string | null = null
+
const engineBundlingPromises: Array> = []
+ const buildActivityTimer = report.activityTimer(
+ `Building production JavaScript and CSS bundles`,
+ { parentSpan: buildSpan }
+ )
+ buildActivityTimer.start()
+
+ try {
+ const { stats, close } = await buildProductionBundle(
+ program,
+ buildActivityTimer.span
+ )
+ closeJavascriptBundleCompilation = close
+
+ if (stats.hasWarnings()) {
+ const rawMessages = stats.toJson({ all: false, warnings: true })
+ reportWebpackWarnings(rawMessages.warnings, report)
+ }
+
+ webpackAssets = stats.toJson({
+ all: false,
+ assets: true,
+ cachedAssets: true,
+ }).assets as Array
+ webpackCompilationHash = stats.hash as string
+ } catch (err) {
+ buildActivityTimer.panic(structureWebpackErrors(Stage.BuildJavascript, err))
+ } finally {
+ buildActivityTimer.end()
+ }
if (_CFLAGS_.GATSBY_MAJOR === `4` && shouldGenerateEngines()) {
- // bundle graphql-engine
- engineBundlingPromises.push(createGraphqlEngineBundle())
+ const state = store.getState()
+ const buildActivityTimer = report.activityTimer(
+ `Building Rendering Engines`,
+ { parentSpan: buildSpan }
+ )
+ try {
+ buildActivityTimer.start()
+ // bundle graphql-engine
+ engineBundlingPromises.push(
+ createGraphqlEngineBundle(program.directory, report, program.verbose)
+ )
+
+ engineBundlingPromises.push(
+ createPageSSRBundle({
+ rootDir: program.directory,
+ components: state.components,
+ staticQueriesByTemplate: state.staticQueriesByTemplate,
+ reporter: report,
+ isVerbose: program.verbose,
+ })
+ )
+ await Promise.all(engineBundlingPromises)
+ } catch (err) {
+ reporter.panic(err)
+ } finally {
+ buildActivityTimer.end()
+ }
+ }
+
+ const buildSSRBundleActivityProgress = report.activityTimer(
+ `Building HTML renderer`,
+ { parentSpan: buildSpan }
+ )
+ buildSSRBundleActivityProgress.start()
+ try {
+ const { close, stats } = await buildRenderer(
+ program,
+ Stage.BuildHTML,
+ buildSSRBundleActivityProgress.span
+ )
+
+ closeHTMLBundleCompilation = close
+ webpackSSRCompilationHash = stats.hash as string
+
+ await close()
+ } catch (err) {
+ buildActivityTimer.panic(structureWebpackErrors(Stage.BuildHTML, err))
+ } finally {
+ buildSSRBundleActivityProgress.end()
+ }
+
+ if (_CFLAGS_.GATSBY_MAJOR === `4` && shouldGenerateEngines()) {
+ const validateEnginesActivity = report.activityTimer(
+ `Validating Rendering Engines`,
+ {
+ parentSpan: buildSpan,
+ }
+ )
+ validateEnginesActivity.start()
+ try {
+ await validateEngines(store.getState().program.directory)
+ } catch (error) {
+ validateEnginesActivity.panic({ id: `98001`, context: {}, error })
+ } finally {
+ validateEnginesActivity.end()
+ }
+ }
+
+ const cacheActivity = report.activityTimer(`Caching Webpack compilations`, {
+ parentSpan: buildSpan,
+ })
+ try {
+ cacheActivity.start()
+ await Promise.all([
+ closeJavascriptBundleCompilation?.(),
+ closeHTMLBundleCompilation?.(),
+ ])
+ } finally {
+ cacheActivity.end()
}
const graphqlRunner = new GraphQLRunner(store, {
@@ -119,18 +243,20 @@ module.exports = async function build(program: IBuildArgs): Promise {
// Only run queries with mode SSG
if (_CFLAGS_.GATSBY_MAJOR === `4`) {
queryIds.pageQueryIds = queryIds.pageQueryIds.filter(
- query => query.mode === `SSG`
+ query => getPageMode(query) === `SSG`
)
}
let waitForWorkerPoolRestart = Promise.resolve()
if (process.env.GATSBY_EXPERIMENTAL_PARALLEL_QUERY_RUNNING) {
- await runQueriesInWorkersQueue(workerPool, queryIds)
+ await runQueriesInWorkersQueue(workerPool, queryIds, {
+ parentSpan: buildSpan,
+ })
// Jobs still might be running even though query running finished
await waitUntilAllJobsComplete()
// Restart worker pool before merging state to lower memory pressure while merging state
waitForWorkerPoolRestart = workerPool.restart()
- await mergeWorkerState(workerPool)
+ await mergeWorkerState(workerPool, buildSpan)
} else {
await runStaticQueries({
queryIds,
@@ -147,10 +273,24 @@ module.exports = async function build(program: IBuildArgs): Promise {
})
}
- await writeOutRequires({
- store,
- parentSpan: buildSpan,
- })
+ // create scope so we don't leak state object
+ {
+ const state = store.getState()
+ await writeQueryContext({
+ staticQueriesByTemplate: state.staticQueriesByTemplate,
+ components: state.components,
+ })
+ }
+
+ if (process.send) {
+ process.send({
+ type: `LOG_ACTION`,
+ action: {
+ type: `ENGINES_READY`,
+ timestamp: new Date().toJSON(),
+ },
+ })
+ }
await apiRunnerNode(`onPreBuild`, {
graphql: gatsbyNodeGraphQLFunction,
@@ -161,54 +301,37 @@ module.exports = async function build(program: IBuildArgs): Promise {
// an equivalent static directory within public.
copyStaticDirs()
- const buildActivityTimer = report.activityTimer(
- `Building production JavaScript and CSS bundles`,
- { parentSpan: buildSpan }
- )
- buildActivityTimer.start()
- let stats
- let waitForCompilerClose
- try {
- const result = await buildProductionBundle(program, buildActivityTimer.span)
- stats = result.stats
- waitForCompilerClose = result.waitForCompilerClose
-
- if (stats.hasWarnings()) {
- const rawMessages = stats.toJson({ moduleTrace: false })
- reportWebpackWarnings(rawMessages.warnings, report)
- }
- } catch (err) {
- buildActivityTimer.panic(structureWebpackErrors(Stage.BuildJavascript, err))
- } finally {
- buildActivityTimer.end()
- }
-
- if (_CFLAGS_.GATSBY_MAJOR === `4` && shouldGenerateEngines()) {
- // client bundle is produced so static query maps should be ready
- engineBundlingPromises.push(createPageSSRBundle())
- }
+ // create scope so we don't leak state object
+ {
+ const state = store.getState()
+ if (
+ webpackCompilationHash !== state.webpackCompilationHash ||
+ !appDataUtil.exists(publicDir)
+ ) {
+ store.dispatch({
+ type: `SET_WEBPACK_COMPILATION_HASH`,
+ payload: webpackCompilationHash,
+ })
- const webpackCompilationHash = stats.hash
- if (
- webpackCompilationHash !== store.getState().webpackCompilationHash ||
- !appDataUtil.exists(publicDir)
- ) {
- store.dispatch({
- type: `SET_WEBPACK_COMPILATION_HASH`,
- payload: webpackCompilationHash,
- })
+ const rewriteActivityTimer = report.activityTimer(
+ `Rewriting compilation hashes`,
+ {
+ parentSpan: buildSpan,
+ }
+ )
+ rewriteActivityTimer.start()
- const rewriteActivityTimer = report.activityTimer(
- `Rewriting compilation hashes`,
- {
- parentSpan: buildSpan,
- }
- )
- rewriteActivityTimer.start()
+ await appDataUtil.write(publicDir, webpackCompilationHash as string)
- await appDataUtil.write(publicDir, webpackCompilationHash)
+ rewriteActivityTimer.end()
+ }
- rewriteActivityTimer.end()
+ if (state.html.ssrCompilationHash !== webpackSSRCompilationHash) {
+ store.dispatch({
+ type: `SET_SSR_WEBPACK_COMPILATION_HASH`,
+ payload: webpackSSRCompilationHash,
+ })
+ }
}
await flushPendingPageDataWrites(buildSpan)
@@ -216,9 +339,8 @@ module.exports = async function build(program: IBuildArgs): Promise {
if (telemetry.isTrackingEnabled()) {
// transform asset size to kB (from bytes) to fit 64 bit to numbers
- const bundleSizes = stats
- .toJson({ assets: true })
- .assets.filter(asset => asset.name.endsWith(`.js`))
+ const bundleSizes = (webpackAssets as Array)
+ .filter(asset => asset.name.endsWith(`.js`))
.map(asset => asset.size / 1000)
const pageDataSizes = [...store.getState().pageDataStats.values()]
@@ -238,39 +360,6 @@ module.exports = async function build(program: IBuildArgs): Promise {
// we need to save it again to make sure our latest state has been saved
await db.saveState()
- const buildSSRBundleActivityProgress = report.activityTimer(
- `Building HTML renderer`,
- { parentSpan: buildSpan }
- )
- buildSSRBundleActivityProgress.start()
- let waitForCompilerCloseBuildHtml
- try {
- const result = await buildRenderer(
- program,
- Stage.BuildHTML,
- buildSSRBundleActivityProgress.span
- )
- waitForCompilerCloseBuildHtml = result.waitForCompilerClose
-
- if (_CFLAGS_.GATSBY_MAJOR === `4` && shouldGenerateEngines()) {
- Promise.all(engineBundlingPromises).then(() => {
- if (process.send) {
- process.send({
- type: `LOG_ACTION`,
- action: {
- type: `ENGINES_READY`,
- timestamp: new Date().toJSON(),
- },
- })
- }
- })
- }
- } catch (err) {
- buildActivityTimer.panic(structureWebpackErrors(Stage.BuildHTML, err))
- } finally {
- buildSSRBundleActivityProgress.end()
- }
-
if (_CFLAGS_.GATSBY_MAJOR === `4` && shouldGenerateEngines()) {
// well, tbf we should just generate this in `.cache` and avoid deleting it :shrug:
program.keepPageRenderer = true
@@ -278,6 +367,9 @@ module.exports = async function build(program: IBuildArgs): Promise {
await waitForWorkerPoolRestart
+ // Start saving page.mode in the main process (while HTML is generated in workers in parallel)
+ const waitMaterializePageMode = materializePageMode()
+
const { toRegenerate, toDelete } =
await buildHTMLPagesAndDeleteStaleArtifacts({
program,
@@ -285,6 +377,7 @@ module.exports = async function build(program: IBuildArgs): Promise {
buildSpan,
})
+ await waitMaterializePageMode
const waitWorkerPoolEnd = Promise.all(workerPool.end())
telemetry.addSiteMeasurement(`BUILD_END`, {
@@ -315,8 +408,6 @@ module.exports = async function build(program: IBuildArgs): Promise {
// Make sure we saved the latest state so we have all jobs cached
await db.saveState()
- await Promise.all([waitForCompilerClose, waitForCompilerCloseBuildHtml])
-
const state = store.getState()
reporter._renderPageTree({
components: state.components,
@@ -373,8 +464,6 @@ module.exports = async function build(program: IBuildArgs): Promise {
report.info(`.cache/deletedPages.txt created`)
}
- await Promise.all(engineBundlingPromises)
-
showExperimentNotices()
if (await userGetsSevenDayFeedback()) {
diff --git a/packages/gatsby/src/commands/develop.ts b/packages/gatsby/src/commands/develop.ts
index 3c9954f1a402c..1f9f81d30a4ac 100644
--- a/packages/gatsby/src/commands/develop.ts
+++ b/packages/gatsby/src/commands/develop.ts
@@ -18,13 +18,13 @@ import {
getService,
updateSiteMetadata,
UnlockFn,
+ uuid,
} from "gatsby-core-utils"
import reporter from "gatsby-cli/lib/reporter"
import { getSslCert } from "../utils/get-ssl-cert"
import { IProxyControls, startDevelopProxy } from "../utils/develop-proxy"
import { IProgram, IDebugInfo } from "./types"
import { flush as telemetryFlush } from "gatsby-telemetry"
-import uuidv4 from "uuid/v4"
// Adapted from https://stackoverflow.com/a/16060619
const requireUncached = (file: string): any => {
@@ -200,7 +200,7 @@ const REGEX_IP =
module.exports = async (program: IProgram): Promise => {
global.__GATSBY = {
- buildId: uuidv4(),
+ buildId: uuid.v4(),
root: program.directory,
}
diff --git a/packages/gatsby/src/commands/serve.ts b/packages/gatsby/src/commands/serve.ts
index b4e409bb8bff6..ebb94e0f607e9 100644
--- a/packages/gatsby/src/commands/serve.ts
+++ b/packages/gatsby/src/commands/serve.ts
@@ -8,7 +8,6 @@ import { match as reachMatch } from "@gatsbyjs/reach-router/lib/utils"
import onExit from "signal-exit"
import report from "gatsby-cli/lib/reporter"
import multer from "multer"
-import pathToRegexp from "path-to-regexp"
import cookie from "cookie"
import telemetry from "gatsby-telemetry"
@@ -25,14 +24,6 @@ interface IMatchPath {
matchPath: string
}
-interface IPathToRegexpKey {
- name: string | number
- prefix: string
- suffix: string
- pattern: string
- modifier: string
-}
-
interface IServeProgram extends IProgram {
prefixPaths: boolean
}
@@ -169,25 +160,22 @@ module.exports = async (program: IServeProgram): Promise => {
// Check if there's any matchPaths that match.
// We loop until we find the first match.
functions.some(f => {
- let exp
- const keys: Array = []
if (f.matchPath) {
- exp = pathToRegexp(f.matchPath, keys)
+ const matchResult = reachMatch(f.matchPath, pathFragment)
+ if (matchResult) {
+ req.params = matchResult.params
+ if (req.params[`*`]) {
+ // Backwards compatability for v3
+ // TODO remove in v5
+ req.params[`0`] = req.params[`*`]
+ }
+ functionObj = f
+
+ return true
+ }
}
- if (exp && exp.exec(pathFragment) !== null) {
- functionObj = f
- // @ts-ignore - TS bug? https://stackoverflow.com/questions/50234481/typescript-2-8-3-type-must-have-a-symbol-iterator-method-that-returns-an-iterato
- const matches = [...pathFragment.match(exp)].slice(1)
- const newParams = {}
- matches.forEach(
- (match, index) => (newParams[keys[index].name] = match)
- )
- req.params = newParams
- return true
- } else {
- return false
- }
+ return false
})
}
@@ -254,20 +242,31 @@ module.exports = async (program: IServeProgram): Promise => {
const page = graphqlEngine.findPageByPath(potentialPagePath)
if (page && (page.mode === `DSG` || page.mode === `SSR`)) {
- const data = await getData({
- pathName: req.path,
- graphqlEngine,
- req,
- })
- const results = await renderPageData({ data })
- if (page.mode === `SSR` && data.serverDataHeaders) {
- for (const [name, value] of Object.entries(
- data.serverDataHeaders
- )) {
- res.setHeader(name, value)
+ try {
+ const data = await getData({
+ pathName: req.path,
+ graphqlEngine,
+ req,
+ })
+ const results = await renderPageData({ data })
+ if (page.mode === `SSR` && data.serverDataHeaders) {
+ for (const [name, value] of Object.entries(
+ data.serverDataHeaders
+ )) {
+ res.setHeader(name, value)
+ }
}
+ return void res.send(results)
+ } catch (e) {
+ report.error(
+ `Generating page-data for "${requestedPagePath}" / "${potentialPagePath}" failed.`,
+ e
+ )
+ return res
+ .status(500)
+ .contentType(`text/plain`)
+ .send(`Internal server error.`)
}
- return void res.send(results)
}
return void next()
@@ -278,25 +277,34 @@ module.exports = async (program: IServeProgram): Promise => {
if (req.accepts(`html`)) {
const potentialPagePath = req.path
const page = graphqlEngine.findPageByPath(potentialPagePath)
-
if (page && (page.mode === `DSG` || page.mode === `SSR`)) {
- const data = await getData({
- pathName: potentialPagePath,
- graphqlEngine,
- req,
- })
- const results = await renderHTML({ data })
- if (page.mode === `SSR` && data.serverDataHeaders) {
- for (const [name, value] of Object.entries(
- data.serverDataHeaders
- )) {
- res.setHeader(name, value)
+ try {
+ const data = await getData({
+ pathName: potentialPagePath,
+ graphqlEngine,
+ req,
+ })
+ const results = await renderHTML({ data })
+ if (page.mode === `SSR` && data.serverDataHeaders) {
+ for (const [name, value] of Object.entries(
+ data.serverDataHeaders
+ )) {
+ res.setHeader(name, value)
+ }
}
+ return res.send(results)
+ } catch (e) {
+ report.error(
+ `Rendering html for "${potentialPagePath}" failed.`,
+ e
+ )
+ return res.status(500).sendFile(`500.html`, { root }, err => {
+ if (err) {
+ res.contentType(`text/plain`).send(`Internal server error.`)
+ }
+ })
}
- return res.send(results)
}
-
- return res.status(404).sendFile(`404.html`, { root })
}
return next()
})
diff --git a/packages/gatsby/src/datastore/__tests__/nodes.js b/packages/gatsby/src/datastore/__tests__/nodes.js
index 02a3ebb3c811c..518e44ef1f8d8 100644
--- a/packages/gatsby/src/datastore/__tests__/nodes.js
+++ b/packages/gatsby/src/datastore/__tests__/nodes.js
@@ -10,40 +10,6 @@ describe(`nodes db tests`, () => {
store.dispatch({ type: `DELETE_CACHE` })
})
- it(`warns when using old touchNode signature `, () => {
- store.dispatch(
- actions.createNode(
- {
- id: `hi`,
- children: [],
- parent: `test`,
- internal: {
- contentDigest: `hasdfljds`,
- type: `Test`,
- },
- },
- {
- name: `tests`,
- }
- )
- )
- expect(getNode(`hi`)).toMatchObject({ id: `hi` })
- store.dispatch(
- actions.touchNode(
- { nodeId: `hi` },
- {
- name: `tests`,
- }
- )
- )
- expect(getNode(`hi`)).toBeDefined()
- const deprecationNotice =
- `Calling "touchNode" with an object containing the nodeId is deprecated. Please pass ` +
- `the node directly to the function: touchNode(node) ` +
- `"touchNode" was called by tests`
- expect(report.warn).toHaveBeenCalledWith(deprecationNotice)
- })
-
it(`deletes previously transformed children nodes when the parent node is updated`, async () => {
store.dispatch(
actions.createNode(
@@ -341,40 +307,6 @@ describe(`nodes db tests`, () => {
expect(getNode(`hi`)).toBeUndefined()
})
- it(`warns when using old deleteNode signature `, () => {
- store.dispatch(
- actions.createNode(
- {
- id: `hi`,
- children: [],
- parent: `test`,
- internal: {
- contentDigest: `hasdfljds`,
- type: `Test`,
- },
- },
- {
- name: `tests`,
- }
- )
- )
- expect(getNode(`hi`)).toMatchObject({ id: `hi` })
- store.dispatch(
- actions.deleteNode(
- { node: getNode(`hi`) },
- {
- name: `tests`,
- }
- )
- )
- expect(getNode(`hi`)).toBeUndefined()
- const deprecationNotice =
- `Calling "deleteNode" with {node} is deprecated. Please pass ` +
- `the node directly to the function: deleteNode(node) ` +
- `"deleteNode" was called by tests`
- expect(report.warn).toHaveBeenCalledWith(deprecationNotice)
- })
-
it(`throws an error when trying to delete a node of a type owned from another plugin`, () => {
expect(() => {
store.dispatch(
diff --git a/packages/gatsby/src/datastore/lmdb/lmdb-datastore.ts b/packages/gatsby/src/datastore/lmdb/lmdb-datastore.ts
index 3a6f5e6f3d9ca..07b9d062ee0ca 100644
--- a/packages/gatsby/src/datastore/lmdb/lmdb-datastore.ts
+++ b/packages/gatsby/src/datastore/lmdb/lmdb-datastore.ts
@@ -194,7 +194,8 @@ function updateDataStore(action: ActionsUnion): void {
case `CREATE_NODE`:
case `ADD_FIELD_TO_NODE`:
case `ADD_CHILD_NODE_TO_PARENT_NODE`:
- case `DELETE_NODE`: {
+ case `DELETE_NODE`:
+ case `MATERIALIZE_PAGE_MODE`: {
const dbs = getDatabases()
lastOperationPromise = Promise.all([
updateNodes(dbs.nodes, action),
diff --git a/packages/gatsby/src/datastore/lmdb/updates/nodes.ts b/packages/gatsby/src/datastore/lmdb/updates/nodes.ts
index a6049b5f20c53..956e7caf08a95 100644
--- a/packages/gatsby/src/datastore/lmdb/updates/nodes.ts
+++ b/packages/gatsby/src/datastore/lmdb/updates/nodes.ts
@@ -19,6 +19,15 @@ export function updateNodes(
}
return false
}
+ case `MATERIALIZE_PAGE_MODE`: {
+ const id = `SitePage ${action.payload.path}`
+ const node = nodesDb.get(id)
+ if (!node) {
+ throw new Error(`Could not find SitePage node by id: ${id}`)
+ }
+ node.mode = action.payload.pageMode
+ return nodesDb.put(id, node)
+ }
}
return false
}
diff --git a/packages/gatsby/src/internal-plugins/dev-404-page/raw_dev-404-page.js b/packages/gatsby/src/internal-plugins/dev-404-page/raw_dev-404-page.js
index 4c57569206f1e..3add076ea0691 100644
--- a/packages/gatsby/src/internal-plugins/dev-404-page/raw_dev-404-page.js
+++ b/packages/gatsby/src/internal-plugins/dev-404-page/raw_dev-404-page.js
@@ -89,19 +89,12 @@ class Dev404Page extends React.Component {
return null
}
- // Detect when the query returns the default function node that's added when functions
- // are *not* enabled. That seems the simplest way to communicate whether
- // functions are enabled or not to this page.
- // TODO remove when functions are shipped.
- const functionsEnabled = !(
- this.props.data.allSiteFunction.nodes[0]?.functionRoute === `FAKE`
- )
const { pathname } = this.props.location
let newFilePath
let newAPIPath
if (pathname === `/`) {
newFilePath = `src/pages/index.js`
- } else if (functionsEnabled && pathname.slice(0, 4) === `/api`) {
+ } else if (pathname.slice(0, 4) === `/api`) {
newAPIPath = `src${pathname}.js`
} else if (pathname.slice(-1) === `/`) {
newFilePath = `src/pages${pathname.slice(0, -1)}.js`
@@ -115,9 +108,7 @@ class Dev404Page extends React.Component {
Pages (
{this.state.pagePaths.length != this.state.initPagePaths.length
diff --git a/packages/gatsby/src/internal-plugins/functions/gatsby-node.ts b/packages/gatsby/src/internal-plugins/functions/gatsby-node.ts
index 64712c3b03a49..eafbe7f3333e1 100644
--- a/packages/gatsby/src/internal-plugins/functions/gatsby-node.ts
+++ b/packages/gatsby/src/internal-plugins/functions/gatsby-node.ts
@@ -10,9 +10,7 @@ import { CreateDevServerArgs, ParentSpanPluginArgs } from "gatsby"
import formatWebpackMessages from "react-dev-utils/formatWebpackMessages"
import dotenv from "dotenv"
import chokidar from "chokidar"
-// We use an ancient version of path-to-regexp as it has breaking changes to express v4
-// see: https://github.com/pillarjs/path-to-regexp/tree/77df63869075cfa5feda1988642080162c584427#compatibility-with-express--4x
-import pathToRegexp from "path-to-regexp"
+import { match } from "@gatsbyjs/reach-router/lib/utils"
import cookie from "cookie"
import { reportWebpackWarnings } from "../../utils/webpack-error-utils"
import { internalActions } from "../../redux/actions"
@@ -29,14 +27,6 @@ interface IGlobPattern {
globPattern: string
}
-interface IPathToRegexpKey {
- name: string | number
- prefix: string
- suffix: string
- pattern: string
- modifier: string
-}
-
// During development, we lazily compile functions only when they're requested.
// Here we keep track of which functions have been requested so are "active"
const activeDevelopmentFunctions = new Set
+
+ Unhandled getServerData Error
+ {filePath} +Error Message
++ {error?.context?.sourceMessage} +
+Source
+ {filePath && ( +
+ Function {name} in {filePath}:{lineNumber}
+
+ )}
+ Gatsby.js development 404 page
- {`There's not a page ${
- functionsEnabled ? `or function ` : ``
- }yet at `}
+ There's not a page or function yet at{` `}
{pathname}
- If you were trying to reach another page - {functionsEnabled ? ` or function` : ``}, perhaps you can find it - below. + If you were trying to reach another page or function, perhaps you + can find it below.
- {functionsEnabled && ( - <> -- Functions ({this.props.data.allSiteFunction.nodes.length}) -
--
- {this.props.data.allSiteFunction.nodes.map(node => {
- const functionRoute = `/api/${node.functionRoute}`
- return (
-
- - {functionRoute} - - ) - })} -
Functions ({this.props.data.allSiteFunction.nodes.length})
+-
+ {this.props.data.allSiteFunction.nodes.map(node => {
+ const functionRoute = `/api/${node.functionRoute}`
+ return (
+
- + {functionRoute} + + ) + })} +