{"record":{"id":"bd8a2abc9f18fcf7","repo":"angular/components","slug":"the-literal-provided-to-maticonregistry-was-not-tr","errorCode":null,"errorMessage":"The literal provided to MatIconRegistry was not trusted as safe HTML by Angular's DomSanitizer. Attempted literal was \"${literal}\".","messagePattern":"The literal provided to MatIconRegistry was not trusted as safe HTML by Angular's DomSanitizer\\. Attempted literal was \"(.+?)\"\\.","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/material/icon/icon-registry.ts","lineNumber":222,"sourceCode":"  }\n\n  /**\n   * Registers an icon using an HTML string in the specified namespace.\n   * @param namespace Namespace in which the icon should be registered.\n   * @param iconName Name under which the icon should be registered.\n   * @param literal SVG source of the icon.\n   */\n  addSvgIconLiteralInNamespace(\n    namespace: string,\n    iconName: string,\n    literal: SafeHtml,\n    options?: IconOptions,\n  ): this {\n    const cleanLiteral = this._sanitizer.sanitize(SecurityContext.HTML, literal);\n\n    // TODO: add an ngDevMode check\n    if (!cleanLiteral) {\n      throw getMatIconFailedToSanitizeLiteralError(literal);\n    }\n\n    // Security: The literal is passed in as SafeHtml, and is thus trusted.\n    const trustedLiteral = trustedHTMLFromString(cleanLiteral);\n    return this._addSvgIconConfig(\n      namespace,\n      iconName,\n      new SvgIconConfig('', trustedLiteral, options),\n    );\n  }\n\n  /**\n   * Registers an icon set by URL in the default namespace.\n   * @param url\n   */\n  addSvgIconSet(url: SafeResourceUrl, options?: IconOptions): this {\n    return this.addSvgIconSetInNamespace('', url, options);\n  }","sourceCodeStart":204,"sourceCodeEnd":240,"githubUrl":"https://github.com/angular/components/blob/0411926e7d8ae06b32236ec1048a888cfad5abf2/src/material/icon/icon-registry.ts#L204-L240","documentation":"MatIconRegistry.addSvgIconLiteralInNamespace sanitizes the supplied SafeHtml literal with DomSanitizer before registering it. If sanitization strips the content (returns empty/null), it means the literal was not explicitly trusted, and the registry throws this error instead of storing unsafe HTML.","triggerScenarios":"Calling registry.addSvgIconLiteral('icon', someHtmlString) with a plain string (bypassing sanitizer trust), or a SafeHtml built by bypassSecurityTrustHtml on content that Angular's sanitizer empties (e.g. non-HTML content or content stripped entirely).","commonSituations":"Passing raw SVG strings fetched from an API without wrapping in sanitizer.bypassSecurityTrustHtml; TypeScript types loosened to accept string as SafeHtml; literals constructed at runtime from untrusted sources being stripped to empty by the sanitizer.","solutions":["Wrap the literal in trusted SafeHtml: this.sanitizer.bypassSecurityTrustHtml(svgString).","Verify the SVG literal is well-formed HTML; the sanitizer returns empty for content it fully strips.","Confirm the argument type is actually SafeHtml — a plain string should not be assignable; fix any loose typings.","If sanitization keeps emptying valid SVG, register via addSvgIconLiteral with a static template literal so Angular trusts compile-time HTML."],"exampleFix":"// before\nregistry.addSvgIconLiteral('fluffy', svgStringFromServer);\n// after\nregistry.addSvgIconLiteral(\n  'fluffy',\n  this.sanitizer.bypassSecurityTrustHtml(svgStringFromServer),\n);","handlingStrategy":"type-guard","validationCode":"import { SafeHtml } from '@angular/platform-browser';\nfunction isTrustedHtml(v: unknown): v is SafeHtml {\n  return typeof v === 'object' && v !== null && 'changingThisBreaksApplicationSecurity' in v;\n}\nif (!isTrustedHtml(literal)) throw new Error('Wrap SVG string in bypassSecurityTrustHtml first');","typeGuard":"function isSafeHtml(v: unknown): v is SafeHtml {\n  return !!v && typeof v === 'object' &&\n    typeof (v as any).changingThisBreaksApplicationSecurity === 'string';\n}","tryCatchPattern":"try {\n  registry.addSvgIconLiteral(name, literal);\n} catch (e) {\n  if (e instanceof Error && e.message.includes('not trusted as safe HTML')) {\n    console.error('Sanitize failed — check the SVG string is well-formed and trusted.');\n  } else { throw e; }\n}","preventionTips":["Always wrap runtime SVG strings with DomSanitizer.bypassSecurityTrustHtml.","Never loosen SafeHtml typings to accept plain strings.","Check the SVG parses as HTML/XML before registering."],"tags":["angular-material","icon-registry","domsanitizer","security","safe-html"],"backgroundTag":"untrusted-html-sanitization-failed","analyzedSha":"0411926e7d8ae06b32236ec1048a888cfad5abf2","analyzedAt":"2026-08-31T11:58:23.400Z","schemaVersion":2},"datasetVersion":"2026-08-31T14:17:45.589Z"}