facebook/react · error · Error

If you supply `defaultValue` on a <textarea>, do not pass ch

Error message

If you supply `defaultValue` on a <textarea>, do not pass children.

What it means

Thrown by pushStartTextArea when a <textarea> has both children and a non-null value (which includes a defaultValue, since value falls back to defaultValue a few lines above). React historically allowed children as the default content of a textarea, but combining that with an explicit value/defaultValue is ambiguous, so SSR throws. A DEV-only console.error ('Use the defaultValue or value props instead of setting children on <textarea>') fires for any children usage even before this check.

Source

Thrown at packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js:2809

  if (value === null && defaultValue !== null) {
    value = defaultValue;
  }

  pushViewTransitionAttributes(target, formatContext);

  target.push(endOfStartTag);

  // TODO (yungsters): Remove support for children content in <textarea>.
  if (children != null) {
    if (__DEV__) {
      console.error(
        'Use the `defaultValue` or `value` props instead of setting ' +
          'children on <textarea>.',
      );
    }

    if (value != null) {
      throw new Error(
        'If you supply `defaultValue` on a <textarea>, do not pass children.',
      );
    }

    if (isArray(children)) {
      if (children.length > 1) {
        throw new Error('<textarea> can only have at most one child.');
      }

      // TODO: remove the coercion and the DEV check below because it will
      // always be overwritten by the coercion several lines below it. #22309
      if (__DEV__) {
        checkHtmlStringCoercion(children[0]);
      }
      value = '' + children[0];
    }
    if (__DEV__) {
      checkHtmlStringCoercion(children);

View on GitHub (pinned to eafeac097b)

Solutions

1. Delete the children and keep value/defaultValue as the single source: <textarea defaultValue="x" />
2. If children was meant as initial content, move that string into defaultValue
3. In generic components, destructure children out before spreading props onto <textarea>

Example fix

// before
<textarea defaultValue="Initial">Initial</textarea>

// after
<textarea defaultValue="Initial" />

function getTextareaValue(props: {children?: unknown; value?: string; defaultValue?: string}): string | undefined {
  if (props.children != null && (props.value != null || props.defaultValue != null)) {
    throw new TypeError('Pass defaultValue/value or children on <textarea>, not both');
  }
  return props.value ?? props.defaultValue ?? (typeof props.children === 'string' ? props.children : undefined);
}

When it happens

Trigger: Server-rendering <textarea defaultValue="x">content</textarea>, <textarea value={v} onChange={...}>{initial}</textarea>, or a spread that supplies children alongside value/defaultValue.

Common situations: HTML-to-JSX converters that keep the textarea's inner text as children while a wrapper adds defaultValue; copy-paste of placeholder-like initial content; components forwarding both a value prop and children into a textarea.

Related errors

• <textarea> can only have at most one child.
• Can only set one of `children` or `props.dangerouslySetInner
• input is a self-closing tag and must neither have `children`
• `dangerouslySetInnerHTML` does not make sense on <textarea>.
• link is a self-closing tag and must neither have `children`

AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/a1baa0cedaf92e12. Report an issue: GitHub.