CSP Error: This document requires 'TrustedHTML' assignment

[MontyHu]

Issue description

Getting a console error now that says:

This document requires 'TrustedHTML' assignment.

  | resetTimes | @ | currentTimeElements.js:202
  | resetCurrentTimes | @ | timeElements.js:65
  | prepareSongChange | @ | audioNavigation.js:535
  | changeSong | @ | audioNavigation.js:470
  | setConfig | @ | init.js:408
  | initialize | @ | init.js:343
  | init | @ | index.js:147
  | (anonymous) | @ | audio:350

Uncaught TypeError: 
Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.
    at Object.resetTimes (currentTimeElements.js:202)
    at Object.resetCurrentTimes (timeElements.js:65)
    at prepareSongChange (audioNavigation.js:535)
    at Object.changeSong (audioNavigation.js:470)
    at setConfig (init.js:408)
    at Object.initialize (init.js:343)
    at Object.init (index.js:147)
    at audio:350

If I click on the Play button, I get a similar error:

Uncaught TypeError: 
Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.
    at Object.resetTimes (currentTimeElements.js:202)
    at Object.resetCurrentTimes (timeElements.js:65)
    at prepareSongChange (audioNavigation.js:535)
    at Object.changeSong (audioNavigation.js:470)
    at handleSongPlayPause (playPause.js:220)
    at HTMLDivElement.handle (playPause.js:86)

Environment

• What's My Browser Support link: whatsmybrowser.org/b/GGZQZ

• Amplitude.js Version: 5.0.3 (Can't run 5.2.0 due to bugs already identified by developers)

Steps to reproduce the issue

This issue appears to happen when using a Content Security Policy that includes the following :

require-trusted-types-for 'script';

If that line is removed from the CSP then the script will work in Chrome, but then it also makes it not very secure.

This issue only happens in the latest version of Chrome, it's not an issue in Safari or Firefox so far.

What is expected?

No CSP errors from the browser, I guess that requires removing innerHTML from the script or making it secure somehow.

Link to where issue can be reproduced

Can't link to a website where this is happening because I had to remove the above-mentioned line from the CSP policy temporarily until there is a fix or a workaround for this.

Additional details / screenshots

This website details how to fix this type of issue in a script: https://web.dev/trusted-types/#create-a-trusted-type-policy

[danpastori]

Hi @MontyHu , thanks for sending this over. This definitely is something I'm not too familiar with in regards to designing a library. We've implemented CSP before, but this is a unique use case. Does this just require stripping of possible tags? That's kind of my understanding and it should be done for all injection into elements?