Why is Google Tag Manager causing errors on my checkout page??

[a6589932]

Hello everyone. We are trying to set up some web pixels using Google Tag Manager using the new "Customer Events" functionality of Shopify on a store already in the new checkout. However, we are getting an error only happening on the checkout page. As soon as the script is executed, it returns this: Uncaught SecurityError: Failed to set a named property 'debugBadgeApi' on 'Window': Blocked a frame with origin "null" from accessing a cross-origin frame. I'm attaching a screenshot of the error for full context.

Any idea of why this might be happening? If I remove the GTM script, everything works fine. So it must be something related to the external script. I'll appreciate any help, thanks in advance!

and when I try to preview in GTM, I see an error in the browser console and preview tells me it can't find the pixel. When I view source, I see the pixel code is there. I'm surprised we'd be shown an implementation that doesn't quite work.

Uncaught DOMException: Failed to set a named property 'debugBadgeApi' on 'Window': Blocked a frame with origin "null" from accessing a cross-origin frame.

[Sam_Mahmud]

Hello a6589932,

Thanks for your query.

As you installed datalayer in the theme file with GTM code it is definite to show error. You can not track the checkout page placing the data layer in the theme file because the theme file is not connected to the checkout page.

Place the GTM code only between the head section of the theme file. For purchase tracking save the datalayer at customer event custom pixel.
for others event tracking like view item, add to cart create a snippet and connect with theme file.

feel free to ask if you have any questions or dont hesitate to PM me for further discussion.

Thanks

[a6589932]

I just put this datalayer customer event custom pixel. 

Just like you said, If not put GTM Code in customer event custom pixel, When a user places an order, how does GTM capture the order information

[a6589932]

Is that how it was changedIs that how it was changed ?

[Sam_Mahmud]

Yes, place the GTM code with the purchase data layer in the customer event custom pixel. Then debug and test. 

If you face any difficulties, feel free to ask.

Thanks