Mayuran/hot jar js test (#6430)

* fix: hot jar changes * fix: delay 5 seconds on hot jar append * fix: console removed * fix: revert things * fix: test party town and 3 seconds
binary-com · Jan 4, 2024 · f060253 · f060253
1 parent ee36174
commit f060253
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 2 deletions.
diff --git a/.github/workflows/beta.yml b/.github/workflows/beta.yml
@@ -23,6 +23,7 @@ env:
     GATSBY_RUDDERSTACK_STAGING_KEY: ${{ secrets.GATSBY_RUDDERSTACK_STAGING_KEY }}
     GATSBY_RUDDERSTACK_PRODUCTION_KEY: ${{ secrets.GATSBY_RUDDERSTACK_PRODUCTION_KEY }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
 
 jobs:
     release-beta:

diff --git a/.github/workflows/generate-preview-link.yml b/.github/workflows/generate-preview-link.yml
@@ -130,6 +130,8 @@ jobs:
                   GATSBY_STRAPI_TOKEN: ${{ secrets.GATSBY_STRAPI_TOKEN }}
                   GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
                   GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+                  GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
+
               run: npm run build
 
             - name: Publish to Cloudflare Pages

diff --git a/.github/workflows/production.yml b/.github/workflows/production.yml
@@ -20,6 +20,7 @@ env:
     GATSBY_RUDDERSTACK_PRODUCTION_KEY: ${{ secrets.GATSBY_RUDDERSTACK_PRODUCTION_KEY }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
     GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
 
 jobs:
     release-production:
@@ -52,7 +53,7 @@ jobs:
             - run: npm run test
             - run: npm run build
             - run: echo $GIT_TAG_NAME > public/version.txt
-            
+
             - name: Remove Storybook
               uses: JesseTG/[email protected]
               with:

diff --git a/.github/workflows/staging.yml b/.github/workflows/staging.yml
@@ -25,6 +25,8 @@ env:
     GATSBY_STRAPI_TOKEN: ${{ secrets.GATSBY_STRAPI_TOKEN }}
     GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID: ${{ secrets.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID }}
     GATSBY_TRUSTPILOT_API_KEY: ${{ secrets.GATSBY_TRUSTPILOT_API_KEY }}
+    GATSBY_HOTJAR_ID: ${{ secrets.GATSBY_HOTJAR_ID }}
+
 jobs:
     release-staging:
         timeout-minutes: 30

diff --git a/gatsby-ssr.js b/gatsby-ssr.js
@@ -12,6 +12,7 @@ export const wrapPageElement = WrapPagesWithLocaleContext
 
 export const onRenderBody = ({ setHeadComponents }) => {
     const gtmTrackingId = process.env.GATSBY_GOOGLE_TAG_MANAGER_TRACKING_ID || ''
+    const hotjarId = process.env.GATSBY_HOTJAR_ID || ''
 
     setHeadComponents([
         // Partytown setup
@@ -51,5 +52,25 @@ export const onRenderBody = ({ setHeadComponents }) => {
                 }}
             />
         ),
+
+        // Hotjar setup
+        hotjarId && (
+            <script
+                key="hotjar-script"
+                type="text/partytown"
+                dangerouslySetInnerHTML={{
+                    __html: `(function(h,o,t,j,a,r){
+                h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+                h._hjSettings={hjid:'${hotjarId}',hjsv:'7'};
+                a=o.getElementsByTagName('head')[0];
+                setTimeout(function(){
+                    r=o.createElement('script');r.async=1;
+                    r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+                    a.appendChild(r);
+                }, 3000);
+            })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');`,
+                }}
+            />
+        ),
     ])
-}
+}