Ramonda

ref-built-where-it-cannot-be-kept

This fails the run. Where it is wrong about your code, // ramonda-check-ignore <reason> on the line says so, and the reason is printed on every run.

Reported when createRef() is called from a render, a @compute, a @memoized member a render calls, or a hook's props callback — so it answers a new identity every pass, the child re-renders for a ref that only looks changed, and nothing can read current.

The framework reports the same fault while running, as RMD061 — but only once the line actually runs. This is the same fault proved from the source instead.

A ref is an identity, so it belongs where an identity belongs: a FIELD.

class Editor extends Component {
  private field = createRef<HTMLTextAreaElement>();

  render() {
    return <TextArea value={this.text} ref={this.field} />;
  }
}

A CALLBACK belongs on a field too — createRef<T>((node) => this.arrived(node)) is how Select and TextArea learn their element has appeared. What must not move is the ref itself.

Built in a render instead, it is a new object every pass. ref is compared like every other prop, so the child re-renders once per parent render for a change that is not one — and current is read off an object the next render has already replaced.

Next