{"record":{"id":"7399b721f490655e","repo":"oxc-project/oxc","slug":"comments-inside-children-section-of-tag-should-be","errorCode":null,"errorMessage":"Comments inside children section of tag should be placed inside braces","messagePattern":"Comments inside children section of tag should be placed inside braces","errorType":"validation","errorClass":"OxcDiagnostic","httpStatus":null,"severity":"warning","filePath":"crates/oxc_linter/src/rules/react/jsx_no_comment_textnodes.rs","lineNumber":13,"sourceCode":"use oxc_ast::AstKind;\nuse oxc_diagnostics::OxcDiagnostic;\nuse oxc_macros::declare_oxc_lint;\nuse oxc_span::Span;\n\nuse crate::{\n    AstNode,\n    context::{ContextHost, LintContext},\n    rule::Rule,\n};\n\nfn jsx_no_comment_textnodes_diagnostic(span: Span) -> OxcDiagnostic {\n    OxcDiagnostic::warn(\"Comments inside children section of tag should be placed inside braces\")\n        .with_label(span)\n}\n\n#[derive(Debug, Default, Clone)]\npub struct JsxNoCommentTextnodes;\n\ndeclare_oxc_lint!(\n    /// ### What it does\n    ///\n    /// This rule prevents comment strings (e.g. beginning with `//` or `/*`) from being\n    /// accidentally injected as a text node in JSX statements.\n    ///\n    /// ### Why is this bad?\n    ///\n    /// In JSX, any text node that is not wrapped in curly braces is considered\n    /// a literal string to be rendered. This can lead to unexpected behavior\n    /// when the text contains a comment.\n    ///","sourceCodeStart":1,"sourceCodeEnd":31,"githubUrl":"https://github.com/oxc-project/oxc/blob/e1e7af627c8843ab64044ed466b128fcc21a035b/crates/oxc_linter/src/rules/react/jsx_no_comment_textnodes.rs#L1-L31","documentation":"Diagnostic from react/jsx-no-comment-textnodes. JSX has no comment syntax, so text beginning with // or /* inside the children of a JSX element is not a comment — it renders as literal text in the DOM. The rule flags such strings to catch developers who assume JS comment syntax works inside markup. The correct way to comment inside JSX is to wrap it in an expression container: {/* comment */}.","triggerScenarios":"<div>// TODO: fix this</div>, <p>/* temporary */</p>, or a child text node that merely starts with // or /* (e.g. <span>//slash-prefixed copy</span>). The rule matches the text-node content, so any children-section string starting with those tokens triggers it.","commonSituations":"Developers new to JSX pasting JS-style comments into markup; commented-out copy left in components; regex-ish or path-like copy that begins with // (e.g. protocol-relative URLs rendered as text) triggering false positives.","solutions":["Convert the intended comment to a JSX expression container: {/* TODO: fix this */}","If the text is real copy that starts with //, rephrase it or render it from an expression: {'//path-like text'}","Remove commented-out markup instead of leaving it in children","Disable the rule for that line with an oxlint-disable comment if the literal-slash text is intentional"],"exampleFix":"// before\n<div>\n  // TODO: wire up submit\n  <button>Go</button>\n</div>\n\n// after\n<div>\n  {/* TODO: wire up submit */}\n  <button>Go</button>\n</div>","handlingStrategy":"validation","validationCode":"npx oxlint -D react/jsx-no-comment-textnodes src/","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Use {/* ... */} for JSX comments — never // or /* */ as bare text children","Delete commented-out JSX instead of leaving it in children sections","If literal copy must start with //, render it via an expression container {'//...' } so intent is explicit"],"tags":["react","jsx","comments","text-node","oxlint","lint"],"backgroundTag":"jsx-comment-text-node","analyzedSha":"e1e7af627c8843ab64044ed466b128fcc21a035b","analyzedAt":"2026-08-20T07:01:07.079Z","contentChangedAt":"2026-08-20T07:01:07.079Z","schemaVersion":2},"datasetVersion":"2026-09-14T00:17:10.932Z"}