Lint Rules

noCommentText (since v0.7.0)

This rule is recommended by Rome.

Prevent comments from being inserted as text nodes

Examples

Invalid

const a3 = <div>// comment</div>;
correctness/noCommentText.js:1:17 lint/correctness/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━

   Wrap comments inside children within braces.
  
  > 1 │ const a3 = <div>// comment</div>;
                   ^^^^^^^^^^
    2 │ 
  
   Suggested fix: Wrap the comments with braces
  
    1  - const·a3·=·<div>//·comment</div>;
      1+ const·a3·=·<div>{/*·comment*/}</div>;
    2 2  
  
const a4 = <div>/* comment */</div>;
correctness/noCommentText.js:1:17 lint/correctness/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━

   Wrap comments inside children within braces.
  
  > 1 │ const a4 = <div>/* comment */</div>;
                   ^^^^^^^^^^^^^
    2 │ 
  
   Suggested fix: Wrap the comments with braces
  
    1 │ const·a4·=·<div>{/*·comment·*/}</div>;
                  +             +       
const a5 = <div>/** comment */</div>;
correctness/noCommentText.js:1:17 lint/correctness/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━

   Wrap comments inside children within braces.
  
  > 1 │ const a5 = <div>/** comment */</div>;
                   ^^^^^^^^^^^^^^
    2 │ 
  
   Suggested fix: Wrap the comments with braces
  
    1  - const·a5·=·<div>/**·comment·*/</div>;
      1+ const·a5·=·<div>{/*·comment·*/}</div>;
    2 2  
  

Valid

const a = <div>{/* comment */}</div>;
const a1 = <div>{/** comment */}</div>;
const a2 = <div className={"cls" /* comment */}></div>;