oxc-project/oxc · error · OxcDiagnostic

Void DOM element <{tag:?} /> cannot receive children.

Error message

Void DOM element <{tag:?} /> cannot receive children.

What it means

Raised by react/void_dom_elements_no_children when children are passed to a void DOM element (`<br>`, `<img>`, `<input>`, `<hr>`, `<wbr>` etc.), either as JSX children or via a children prop/argument in createElement. At the throw site void elements cannot have children by HTML definition — the browser will ignore or relocate the content, and React warns. void_dom_elements_no_children_diagnostic fires from run() with the offending tag name when a child is detected on one of the void tags.

Source

Thrown at crates/oxc_linter/src/rules/react/void_dom_elements_no_children.rs:21

    ast::{
        Argument, JSXAttributeItem, JSXAttributeName, JSXElementName, ObjectPropertyKind,
        PropertyKey,
    },
};
use oxc_diagnostics::OxcDiagnostic;
use oxc_macros::declare_oxc_lint;
use oxc_span::Span;

use crate::{
    AstNode,
    context::{ContextHost, LintContext},
    rule::Rule,
    utils::is_create_element_call,
};

fn void_dom_elements_no_children_diagnostic(tag: &str, span: Span) -> OxcDiagnostic {
    // TODO: use imperative phrasing
    OxcDiagnostic::warn(format!("Void DOM element <{tag:?} /> cannot receive children."))
        .with_help("Remove this element's children or use a non-void element.")
        .with_label(span)
}

#[derive(Debug, Default, Clone)]
pub struct VoidDomElementsNoChildren;

declare_oxc_lint!(
    /// ### What it does
    ///
    /// Disallow void DOM elements (e.g. `<img />`, `<br />`) from receiving children.
    ///
    /// ### Why is this bad?
    ///
    /// There are some HTML elements that are only self-closing (e.g. img, br, hr). These are collectively known as void DOM elements.
    /// This rule checks that children are not passed to void DOM elements.
    ///
    /// ### Examples

View on GitHub (pinned to e1e7af627c)

Solutions

  1. Remove the children from the void element.
  2. Use a non-void element if children are genuinely needed.
Defensive patterns

Strategy: validation

When it happens

Trigger: Thrown at crates/oxc_linter/src/rules/react/void_dom_elements_no_children.rs:21 when the library encounters an invalid state.

Common situations: See trigger scenarios.


AI-assisted analysis of oxc-project/oxc@e1e7af627c (2026-08-20). Data as JSON: /api/errors/391313bd690c5f51. Report an issue: GitHub.