packages/gatsby-admin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-admin",
-  "version": "0.24.5",
+  "version": "0.24.6",
   "main": "index.js",
   "author": "Max Stoiber",
   "license": "MIT",
@@ -29,7 +29,7 @@
     "@typescript-eslint/parser": "^4.29.3",
     "csstype": "^2.6.17",
     "formik": "^2.2.9",
-    "gatsby": "^3.14.5",
+    "gatsby": "^3.14.6",
     "gatsby-interface": "^0.0.244",
     "gatsby-plugin-typescript": "^3.14.0",
     "gatsby-plugin-webfonts": "^1.1.4",

packages/gatsby-plugin-image/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gatsby-plugin-image",
-  "version": "1.14.1",
+  "version": "1.14.2",
   "scripts": {
     "build": "npm-run-all -s clean -p build:*",
     "build:gatsby-node": "tsc --jsx react --downlevelIteration true --skipLibCheck true --esModuleInterop true --outDir dist/ src/gatsby-node.ts src/babel-plugin-parse-static-images.ts src/resolver-utils.ts src/types.d.ts -d --declarationDir dist/src",

packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx

@@ -90,11 +90,12 @@ class GatsbyImageHydrator extends Component<
     }
 
     return import(`./lazy-hydrate`).then(({ lazyHydrate }) => {
+      const cacheKey = JSON.stringify(this.props.image.images)
       this.lazyHydrator = lazyHydrate(
         {
           image: props.image.images,
-          isLoading: state.isLoading,
-          isLoaded: state.isLoaded,
+          isLoading: state.isLoading || hasImageLoaded(cacheKey),
+          isLoaded: state.isLoaded || hasImageLoaded(cacheKey),
           toggleIsLoaded: () => {
             props.onLoad?.()
 

packages/gatsby-plugin-image/src/gatsby-ssr.tsx

@@ -21,6 +21,9 @@ export function onRenderBody({ setHeadComponents }: RenderBodyArgs): void {
     position: relative;
     overflow: hidden;
   }
+  .gatsby-image-wrapper picture.object-fit-polyfill {
+    position: static !important;
+  }
   .gatsby-image-wrapper img {
     bottom: 0;
     height: 100%;

packages/gatsby-plugin-sharp/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gatsby-plugin-sharp",
   "description": "Wrapper of the Sharp image manipulation library for Gatsby plugins",
-  "version": "3.14.2",
+  "version": "3.14.3",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "bugs": {
     "url": "https://github.com/gatsbyjs/gatsby/issues"
@@ -32,7 +32,7 @@
     "@types/sharp": "^0.28.5",
     "babel-preset-gatsby-package": "^1.14.0",
     "cross-env": "^7.0.3",
-    "gatsby-plugin-image": "^1.14.1"
+    "gatsby-plugin-image": "^1.14.2"
   },
   "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-sharp#readme",
   "keywords": [

packages/gatsby-source-drupal/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gatsby-source-drupal",
   "description": "Gatsby source plugin for building websites using the Drupal CMS as a data source",
-  "version": "4.14.2",
+  "version": "4.14.3",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "bugs": {
     "url": "https://github.com/gatsbyjs/gatsby/issues"

packages/gatsby-source-drupal/src/__tests__/fixtures/1593545806.json

@@ -98,6 +98,69 @@
           }
         }
       }
+    },
+    {
+      "jsonapi": {
+        "version": "1.0",
+        "meta": {
+          "links": {
+            "self": {
+              "href": "http://jsonapi.org/format/1.0/"
+            }
+          }
+        }
+      },
+      "data": {
+        "type": "node--article",
+        "id": "article-10",
+        "attributes": {
+          "id": 100,
+          "uuid": "article-10",
+          "title": "Article #10",
+          "body": "Aliquam non varius libero, sit amet consequat ex. Aenean porta turpis quis vulputate blandit. Suspendisse in porta erat. Sed sit amet scelerisque turpis, at rutrum mauris. Sed tempor eleifend lobortis. Proin maximus, massa sed dignissim sollicitudin, quam risus mattis justo, sit amet aliquam odio ligula quis urna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut mollis leo nisi, at interdum urna fermentum ut. Fusce id suscipit neque, eu fermentum lacus. Donec egestas laoreet felis ac luctus. Vestibulum molestie mattis ante, a vulputate nunc ullamcorper at. Ut hendrerit ipsum eget gravida ultricies."
+        },
+        "relationships": {
+          "field_tags": {
+            "data": [
+              {
+                "type": "taxonomy_term--tags",
+                "id": "tag-10"
+              }
+            ]
+          }
+        }
+      }
+    },
+    {
+      "jsonapi": {
+        "version": "1.0",
+        "meta": {
+          "links": {
+            "self": {
+              "href": "http://jsonapi.org/format/1.0/"
+            }
+          }
+        }
+      },
+      "data": {
+      "type": "taxonomy_term--tags",
+      "id": "tag-10",
+      "attributes": {
+        "id": 110,
+        "uuid": "tag-10",
+        "langcode": "en",
+        "name": "Tag #10",
+        "description": null,
+        "weight": 0,
+        "changed": 1523031646,
+        "default_langcode": true,
+        "path": {
+          "alias": null,
+          "pid": null,
+          "langcode": "en"
+        }
+        }
+      }
     }
   ]
 }

packages/gatsby-source-drupal/src/__tests__/fixtures/webhook-body-multiple-nodes.json

@@ -0,0 +1,45 @@
+{
+  "action": "update",
+  "data": [
+    {
+        "type": "node--article",
+        "id": "article-10",
+        "attributes": {
+          "id": 100,
+          "uuid": "article-10",
+          "title": "Article #10",
+          "body": "Aliquam non varius libero, sit amet consequat ex. Aenean porta turpis quis vulputate blandit. Suspendisse in porta erat. Sed sit amet scelerisque turpis, at rutrum mauris. Sed tempor eleifend lobortis. Proin maximus, massa sed dignissim sollicitudin, quam risus mattis justo, sit amet aliquam odio ligula quis urna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut mollis leo nisi, at interdum urna fermentum ut. Fusce id suscipit neque, eu fermentum lacus. Donec egestas laoreet felis ac luctus. Vestibulum molestie mattis ante, a vulputate nunc ullamcorper at. Ut hendrerit ipsum eget gravida ultricies."
+        },
+        "relationships": {
+          "field_tags": {
+            "data": [
+              {
+                "type": "taxonomy_term--tags",
+                "id": "tag-10"
+              }
+            ]
+          }
+        }
+    },
+    {
+    "type": "taxonomy_term--tags",
+      "id": "tag-10",
+      "attributes": {
+        "id": 110,
+        "uuid": "tag-10",
+        "langcode": "en",
+        "name": "Tag #10",
+        "description": null,
+        "weight": 0,
+        "changed": 1523031646,
+        "default_langcode": true,
+        "path": {
+          "alias": null,
+          "pid": null,
+          "langcode": "en"
+        }
+      }
+    }
+  ]
+}
+

packages/gatsby-source-drupal/src/__tests__/index.js

@@ -355,6 +355,26 @@ describe(`gatsby-source-drupal`, () => {
         })
       })
     })
+    describe(`multiple entities in webhook body`, () => {
+      let resp
+      beforeAll(async () => {
+        const webhookBody = require(`./fixtures/webhook-body-multiple-nodes.json`)
+        await sourceNodes(
+          {
+            ...args,
+            webhookBody,
+          },
+          { baseUrl }
+        )
+      })
+
+      it(`Relationships`, async () => {
+        expect(
+          nodes[createNodeId(`und.article-10`)].relationships.field_tags___NODE
+            .length
+        ).toBe(1)
+      })
+    })
 
     describe(`Insert content`, () => {
       it(`Node doesn't exist before webhook`, () => {
@@ -567,6 +587,10 @@ describe(`gatsby-source-drupal`, () => {
           nodes[createNodeId(`und.article-2`)].relationships
             .field_tertiary_image___NODE_image___NODE
         ).toBe(undefined)
+        expect(
+          nodes[createNodeId(`und.article-10`)].relationships.field_tags___NODE
+            .length
+        ).toBe(1)
       })
 
       it(`Back references`, () => {

packages/gatsby-source-drupal/src/gatsby-node.js

@@ -16,6 +16,7 @@ const {
   storeRefsLookups,
   handleReferences,
   handleWebhookUpdate,
+  createNodeIfItDoesNotExist,
   handleDeletedNode,
 } = require(`./utils`)
 
@@ -61,6 +62,21 @@ async function worker([url, options]) {
     }
   }
 
+  if (typeof options.searchParams === `object`) {
+    url = new URL(url)
+    const searchParams = new URLSearchParams(options.searchParams)
+    const searchKeys = Array.from(searchParams.keys())
+    searchKeys.forEach(searchKey => {
+      // Only add search params to url if it has not already been
+      // added.
+      if (!url.searchParams.has(searchKey)) {
+        url.searchParams.set(searchKey, searchParams.get(searchKey))
+      }
+    })
+    url = url.toString()
+  }
+  delete options.searchParams
+
   const response = await got(url, {
     agent,
     cache: false,
@@ -219,6 +235,17 @@ ${JSON.stringify(webhookBody, null, 4)}`
         nodesToUpdate = [data]
       }
 
+      for (const nodeToUpdate of nodesToUpdate) {
+        await createNodeIfItDoesNotExist({
+          nodeToUpdate,
+          actions,
+          createNodeId,
+          createContentDigest,
+          getNode,
+          reporter,
+        })
+      }
+
       for (const nodeToUpdate of nodesToUpdate) {
         await handleWebhookUpdate(
           {
@@ -330,6 +357,31 @@ ${JSON.stringify(webhookBody, null, 4)}`
 
           // Process sync data from Drupal.
           const nodesToSync = res.body.entities
+
+          // First create all nodes that we haven't seen before. That
+          // way we can create relationships correctly next as the nodes
+          // will exist in Gatsby.
+          for (const nodeSyncData of nodesToSync) {
+            if (nodeSyncData.action === `delete`) {
+              continue
+            }
+
+            let nodesToUpdate = nodeSyncData.data
+            if (!Array.isArray(nodeSyncData.data)) {
+              nodesToUpdate = [nodeSyncData.data]
+            }
+            for (const nodeToUpdate of nodesToUpdate) {
+              createNodeIfItDoesNotExist({
+                nodeToUpdate,
+                actions,
+                createNodeId,
+                createContentDigest,
+                getNode,
+                reporter,
+              })
+            }
+          }
+
           for (const nodeSyncData of nodesToSync) {
             if (nodeSyncData.action === `delete`) {
               handleDeletedNode({
@@ -467,6 +519,7 @@ ${JSON.stringify(webhookBody, null, 4)}`
                 username: basicAuth.username,
                 password: basicAuth.password,
                 headers,
+                searchParams: params,
                 responseType: `json`,
                 parentSpan: fullFetchSpan,
               },