Skip to main content

react/noDanger

prevent usage of dangerous JSX props

ESLint Equivalent: no-danger

Examples

Invalid

<div dangerouslySetInnerHTML={{ __html: 'child' }}></div>;

 file.tsx:1:5 lint/react/noDanger ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  Avoid passing content using the dangerouslySetInnerHTML prop.

    <div dangerouslySetInnerHTML={{ __html: 'child' }}></div>;
         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

  Setting content using code can expose users to cross-site scripting
    (XSS) attacks.


React.createElement('div', {dangerouslySetInnerHTML: { __html: 'child' }})

 file.tsx:1:28 lint/react/noDanger ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  Avoid passing content using the dangerouslySetInnerHTML prop.

    React.createElement('div', {dangerouslySetInnerHTML: { __html:
    'child' }})
    ^^^^^^^^^^^^

  Setting content using code can expose users to cross-site scripting
    (XSS) attacks.


createElement('div', {dangerouslySetInnerHTML: { __html: 'child' }})

 file.tsx:1:22 lint/react/noDanger ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  Avoid passing content using the dangerouslySetInnerHTML prop.

    createElement('div', {dangerouslySetInnerHTML: { __html: 'child' }})
                          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

  Setting content using code can expose users to cross-site scripting
    (XSS) attacks.

Valid

<div>Hello World</div>;
React.createElement('div', child)
createElement('div', child)