Update handling of Trusted Types

Note: This is now CSP baseline functionality as of 2026, but not technically part of the CSP 3 spec

Add support for trusted-types and require-trusted-types-for require a different type of UI to be functional compared to standard sources.

Key Articles:

• https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy/trusted-types
• https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy/require-trusted-types-for
• https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy#trusted-types-eval
• https://w3c.github.io/trusted-types/dist/spec/#trusted-types

Trusted Types Directive

<policyName> : A valid policy name consists only of alphanumeric characters, or one of -#=_/@.%. A star (*) as a policy name instructs the user agent to allow any unique policy name

Content-Security-Policy: trusted-types;
Content-Security-Policy: trusted-types 'none';
Content-Security-Policy: trusted-types <policyName>;
Content-Security-Policy: trusted-types <policyName> <policyName> 'allow-duplicates';

Example Trusted Types Usage

// Content-Security-Policy: require-trusted-types-for 'script'; trusted-types foo;

const attackerInput = '<svg onload="alert(/cross-site-scripting/)" />';
const el = document.createElement("div");

if (typeof trustedTypes !== "undefined") {
  // Create a policy that can create TrustedHTML values
  // after sanitizing the input strings with DOMPurify library.
  const sanitizer = trustedTypes.createPolicy("foo", {
    createHTML: (input) => DOMPurify.sanitize(input),
  });

  el.innerHTML = sanitizer.createHTML(attackerInput); // Puts the sanitized value into the DOM.
  el.innerHTML = attackerInput; // Rejects a string value; throws a TypeError.
}

Require Trusted Types Directive

Note this currently only supports 'script'

Content-Security-Policy: require-trusted-types-for 'script';

UI Considerations

• Dropdown for "Trusted Types":
  • Disabled (Not Generated)
  • None (Generates the 'none')
  • Allow Specific (requires policy names)
  • Allow All (Uses *)
• Require For Scripts (Checkbox)
  • True (generates: require-trusted-types-for 'script';)
• Allow Duplicates (Checkbox)
  • Adds 'allow-duplicates' to Trusted Types;

Data Storage ... do we store this in the sources table or create custom properties?

e.g.

Usage Complications

• Brand sites with GTM usage will require additional scripting to work this functionality
• Investigate if Optimizely WebEx supports this

Start by reviewing the existing security-header UI and the sources table, then compare the trusted-types and require-trusted-types-for requirements with the linked MDN and W3C references. Resolve whether these directives belong in the sources table or custom properties, and define the dropdowns, policy-name handling, and checkboxes before implementation. Done means both directives can be configured and generated correctly.