Skip to content

[C19] react: canvas context null-asserts elastica and rebuilds its value every render #17

Description

@GFier

From the 2026-07-06 codebase audit (docs/audits/codebase-audit-2026-07-06.md, in-repo). Finding IDs are stable — cite them in fixes.

Severity: High · Status: CONFIRMED

Problem

canvas-elastica.tsx:285-292: the provider value carries elastica: elasticaRef.current! — null during the first render pass (populated in an effect at line 110) but typed non-null. Child effects run before parent effects, so on mount every child effect sees elastica === null. Consumers crash, or add defensive checks the types say are unnecessary — the repo's own website does exactly that (if (!elastica) return, example-1.tsx:134).

contextValue is also rebuilt inline every render (despite a comment claiming stability) → every provider render re-renders all consumers. DOM memoizes; canvas doesn't.

Direction

Create the engine lazily-but-synchronously (same fix as C46's render-then-rebuild waste in DOM mode — tracked in the epic), type the context field Elastica | null honestly, and memoize the value.

Metadata

Metadata

Assignees

No one assigned

    Labels

    auditFinding from a codebase auditbugSomething isn't workinghighHigh severityreactpackages/react

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions