Rules
dom/no-dangerously-set-innerhtml

no-dangerously-set-innerhtml

Rule category

Security.

What it does

Warns when using dangerouslySetInnerHTML.

Why is this bad?

This should be used with extreme caution! If the HTML inside isn’t trusted (for example, if it’s based on user data), you risk introducing an XSS vulnerability.

Read more about using dangerouslySetInnerHTML.

Examples

Failing

import React from "react";
 
function function Example(): React.JSX.ElementExample() {
  return <JSX.IntrinsicElements.div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>div 
React.DOMAttributes<HTMLDivElement>.dangerouslySetInnerHTML?: {
    __html: string | TrustedHTML;
} | undefined
dangerouslySetInnerHTML
={{ __html: string | TrustedHTML__html: "Hello, World!" }} />;
}