From 681869ca2b2f1939388fae4b1f7aa02cc80de760 Mon Sep 17 00:00:00 2001
From: Ward Peeters <ward@coding-tech.com>
Date: Tue, 1 Dec 2020 12:22:46 +0100
Subject: [PATCH] fix(gatsby-plugin-image): don't show hydration warning

---
 .../src/components/gatsby-image.browser.tsx                 | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx b/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx
index 9da3048dd918a..bc9fd80ba957d 100644
--- a/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx
+++ b/packages/gatsby-plugin-image/src/components/gatsby-image.browser.tsx
@@ -141,9 +141,15 @@ export const GatsbyImageHydrator: FunctionComponent<GatsbyImageProps> = function
       const hasSSRHtml = root.current.querySelector(`[data-gatsby-image-ssr]`)
       // On first server hydration do nothing
       if (hasNativeLazyLoadSupport && hasSSRHtml && !hydrated.current) {
+        hydrated.current = true
         return
       }
 
+      // When no ssrHtml is found (develop) we should force render instead of hydrate
+      if (!hasSSRHtml) {
+        hydrated.current = true
+      }
+
       import(`./lazy-hydrate`).then(({ lazyHydrate }) => {
         lazyHydrator.current = lazyHydrate(
           {