fix(google-analytics): fix pageview timing issue by delaying it (#10917)

There is still a problem with title and path not being correct while navigating across a page.

As referenced in: #9139
Solution made in:  #2478 and #3362

For some reason the previous solution is being overwritten

Co-authored-by: Ward Peeters <ward@coding-tech.com>

packages/gatsby-plugin-google-analytics/src/gatsby-browser.js

@@ -8,11 +8,27 @@ exports.onRouteUpdate = function({ location }) {
     ) {
       return
     }
-    window.ga(
-      `set`,
-      `page`,
-      location ? location.pathname + location.search + location.hash : undefined
-    )
-    window.ga(`send`, `pageview`)
+
+    // wrap inside a timeout to make sure react-helmet is done with it's changes (https://github.com/gatsbyjs/gatsby/issues/9139)
+    // reactHelmet is using requestAnimationFrame so we should use it too: https://github.com/nfl/react-helmet/blob/5.2.0/src/HelmetUtils.js#L296-L299
+    const sendPageView = () => {
+      window.ga(
+        `set`,
+        `page`,
+        location
+          ? location.pathname + location.search + location.hash
+          : undefined
+      )
+      window.ga(`send`, `pageview`)
+    }
+
+    if (`requestAnimationFrame` in window) {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(sendPageView)
+      })
+    } else {
+      // simulate 2 rAF calls
+      setTimeout(sendPageView, 32)
+    }
   }
 }