Skip to content
Biome
Docs Blog Playground

noCommentText (since v1.0.0)

Diagnostic Category: lint/suspicious/noCommentText

Sources:

Prevent comments from being inserted as text nodes

Examples

Section titled Examples

Invalid

Section titled Invalid
<div>// comment</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>// comment</div>;
      │      ^^^^^^^^^^
    2 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1   │ - <div>//·comment</div>;
      1 │ + <div>{/*·comment·*/}</div>;
    2 2 │   
  

<div>/* comment */</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>/* comment */</div>;
      │      ^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 │ <div>{/*·comment·*/}</div>;
      │      +             +       

<div>/** comment */</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>/** comment */</div>;
      │      ^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 │ <div>{/**·comment·*/}</div>;
      │      +              +       

<div>text /* comment */</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>text /* comment */</div>;
      │      ^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 │ <div>text·{/*·comment·*/}</div>;
      │           +             +       

<div>/* comment */ text</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>/* comment */ text</div>;
      │      ^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 │ <div>{/*·comment·*/}·text</div>;
      │      +             +            

<div>
    text
    // comment
</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>
      │      
  > 2 │     text
  > 3 │     // comment
  > 4 │ </div>;
      │ 
    5 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 1 │   <div>
    2 2 │       text
    3   │ - ····//·comment
      3 │ + ····{/*·comment·*/}
    4 4 │   </div>;
    5 5 │   
  

<div>
    // comment
   text
</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>
      │      
  > 2 │     // comment
  > 3 │    text
  > 4 │ </div>;
      │ 
    5 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    1 1 │   <div>
    2   │ - ····//·comment
      2 │ + ····{/*·comment·*/}
    3 3 │      text
    4 4 │   </div>;
  

<div>
    /* comment */
    text
</div>;
code-block.jsx:1:6 lint/suspicious/noCommentText  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Wrap comments inside children within braces.
  
  > 1 │ <div>
      │      
  > 2 │     /* comment */
  > 3 │     text
  > 4 │ </div>;
      │ 
    5 │ 
  
  ℹ Unsafe fix: Wrap the comments with braces
  
    2 │ ····{/*·comment·*/}
      │     +             +

Valid

Section titled Valid
<>
   <div>{/* comment */}</div>;
   <div>{/** comment */}</div>;
   <div className={"cls" /* comment */}></div>;
   <div>text {/* comment */}</div>;
   <div>{/* comment */} text</div>;
</>
Section titled Related links