Unable to load the google tag/pixel while using the pixel app extension

Retired Boards Appdev Extensions
1

Hi there! I’m trying to integrate the Google Tag inside my app using the Web Pixel app extension, however when i test the pixel, I get an error in the console saying:

worker.modern.js:3 Uncaught (in promise) ReferenceError: window is not defined
    at Object.<anonymous> (worker.modern.js:3:339)

However, when I insert the same code manually using the “Customer Events” tab in the store settings, everything seems to work fine. Both of these supposedly run in the same sandbox, so I’m not sure why it works on only the manually configured pixel and not the one created by my app. What can I do in this case? Below is the code in question.

import {register} from "@shopify/web-pixels-extension";

register(({ configuration, analytics, browser , settings}) => {
    const tagID = settings.tagID;

    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}

    const googleTagScript = document.createElement('script'); 
    googleTagScript.async = true; 
    googleTagScript.src="https://www.googletagmanager.com/gtag/js?id=AW-" + tagID; 
    document.head.appendChild(googleTagScript); 
    gtag('js', new Date()); 
    gtag('config', 'AW-' + tagID);

});
1 Like
2

Also having the same issue? Were you able to resolve it?

3

It seems like the only way to do it is using theCustom web pixel (settings → custom events) but not through Pixel App extension as it runs in a WebWorker and the access to the window object won’t be available there.

I consider the Pixel App extensions useless unless you have your own first-party Analytics tool/integration otherwise it seems it’s better to keep using Custom web pixel despite Shopify recommends the opposite.