Google tag manager preview mode debug pane not working on modern pages

%3CLINGO-SUB%20id%3D%22lingo-sub-1713153%22%20slang%3D%22en-US%22%3EGoogle%20tag%20manager%20preview%20mode%20debug%20pane%20not%20working%20on%20modern%20pages%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1713153%22%20slang%3D%22en-US%22%3E%3CP%3EHello%20everyone!%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20tried%20to%20add%20the%20code%20for%20the%20Google%20Tag%20Manager%20in%20the%20browser's%20console%20while%20I%20was%20on%20a%20modern%20page%2C%20but%20unfortunately%20when%20I'm%20in%20the%20tag%20manager's%20preview%20mode%2C%20the%20debug%20pane%20does%20not%20open%20and%20this%20error%20pops%20up%20in%20the%20console%3A%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CPRE%20class%3D%22lia-code-sample%20language-javascript%22%3E%3CCODE%3Egoog.asserts.AssertionError%20%7B%0A%20%20message%3A%20%22Failure%3A%20Bad%20value%20%60d8aec69a-5e9c-4c7a-ae18-1f0ba39af3bc%60%20for%20%0A%20%20%20%20%7CfilterCspNonceValue%22%2C%20%0A%20%20stack%3A%20%22AssertionError%3A%20Failure%3A%20Bad%20value%20%60d8aec69a-5e9c-4c7a-ae18-1f0ba39af3bc%60%20for%20%0A%20%20%20%20%7CfilterCspNonceValue%0A%20%20%20%20at%20new%20goog.asserts.AssertionError%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A46%3A1056)%0A%20%20%20%20at%20Object.goog.asserts.fail%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A49%3A89)%0A%20%20%20%20at%20Object.soy.esc.%24%24filterCspNonceValueHelper%20%0A%20%20%20%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A738%3A137)%0A%20%20%20%20at%20Object.soy.%24%24filterCspNonceValue%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A706%3A443)%0A%20%20%20%20at%20Object.gtm.debugui.soy.frame.renderContent%20%0A%20%20%20%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A748%3A488)%0A%20%20%20%20at%20Object.gtm.debugui.frame.createInlineFrame_%20%0A%20%20%20%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A756%3A404)%0A%20%20%20%20at%20Object.gtm.debugui.frame.init%20(https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A761%3A237)%0A%20%20%20%20at%20https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A761%3A385%0A%20%20%20%20at%20https%3A%2F%2Ftagmanager.google.com%2Fdebug%3A762%3A3%22%3C%2FCODE%3E%3C%2FPRE%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EAdding%20the%20same%20script%20from%20google%20tag%20manager%20in%20a%20classic%20experience%20page%20and%20opening%20the%20debug%20pane%20works%20fine%2C%20without%20the%20assertion%20error%20occurring.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20also%20tried%20to%20use%20the%20SPFx%20extension%20(that%20seems%20to%20do%20pretty%20much%20the%20same%20thing)%20from%20this%20repository%3A%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fgitlab.lsonline.fr%2FSharePoint%2Fsp-dev-fx-webparts%2Fgtm%22%20target%3D%22_self%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgitlab.lsonline.fr%2FSharePoint%2Fsp-dev-fx-webparts%2Fgtm%3C%2FA%3E%20but%20the%20same%20issue%20occurs.%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20am%20using%20SharePoint%202019%20but%20this%20error%20pops%20up%20in%20SharePoint%20online%20too.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-1713153%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EGoogle%20Tag%20Manager%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3EModern%20Experience%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ESharePoint%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ESPFx%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E
Occasional Visitor

Hello everyone!

 

I tried to add the code for the Google Tag Manager in the browser's console while I was on a modern page, but unfortunately when I'm in the tag manager's preview mode, the debug pane does not open and this error pops up in the console:

 

goog.asserts.AssertionError {
  message: "Failure: Bad value `d8aec69a-5e9c-4c7a-ae18-1f0ba39af3bc` for 
    |filterCspNonceValue", 
  stack: "AssertionError: Failure: Bad value `d8aec69a-5e9c-4c7a-ae18-1f0ba39af3bc` for 
    |filterCspNonceValue
    at new goog.asserts.AssertionError (https://tagmanager.google.com/debug:46:1056)
    at Object.goog.asserts.fail (https://tagmanager.google.com/debug:49:89)
    at Object.soy.esc.$$filterCspNonceValueHelper 
    (https://tagmanager.google.com/debug:738:137)
    at Object.soy.$$filterCspNonceValue (https://tagmanager.google.com/debug:706:443)
    at Object.gtm.debugui.soy.frame.renderContent 
    (https://tagmanager.google.com/debug:748:488)
    at Object.gtm.debugui.frame.createInlineFrame_ 
    (https://tagmanager.google.com/debug:756:404)
    at Object.gtm.debugui.frame.init (https://tagmanager.google.com/debug:761:237)
    at https://tagmanager.google.com/debug:761:385
    at https://tagmanager.google.com/debug:762:3"

 

Adding the same script from google tag manager in a classic experience page and opening the debug pane works fine, without the assertion error occurring.

 

I also tried to use the SPFx extension (that seems to do pretty much the same thing) from this repository: https://gitlab.lsonline.fr/SharePoint/sp-dev-fx-webparts/gtm but the same issue occurs. 

 

I am using SharePoint 2019 but this error pops up in SharePoint online too.

 

0 Replies