fix(gatsby-plugin-image): Make onLoad callback work on first load (#36375)

Author: tyhopp

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

@@ -122,12 +122,13 @@ const GatsbyImageHydrator: FC<GatsbyImageProps> = function GatsbyImageHydrator({
           ssrImage.removeAttribute(`data-gatsby-image-ssr`)
         }, 0)
       } else {
-        document.addEventListener(`load`, function onLoadListener() {
-          document.removeEventListener(`load`, onLoadListener)
+        onStartLoad?.({
+          wasCached: true,
+        })
+
+        ssrImage.addEventListener(`load`, function onLoadListener() {
+          ssrImage.removeEventListener(`load`, onLoadListener)
 
-          onStartLoad?.({
-            wasCached: true,
-          })
           onLoad?.({
             wasCached: true,
           })