fix: add null checks to prevent crash when a chart is destroyed by keithbrink · Pull Request #12178 · chartjs/Chart.js


When a chart is destroyed while an animation frame is in-flight, the animation callback can still execute and attempt operations on null/destroyed canvas elements, causing multiple crash scenarios:

  1. Context crash: TypeError: Cannot read properties of null (reading 'save') when clipArea/unclipArea try to call ctx.save() on a null canvas context
  2. ownerDocument crash: TypeError: Cannot read properties of null (reading 'ownerDocument') when getMaximumSize/getRelativePosition call getComputedStyle(canvas) on a null canvas element

Both issues share the same root cause: Animator._update() executes after chart.destroy(), attempting to render on destroyed canvas resources.

Crash paths:

  • clipArea: Animator._update() → chart.draw() → _setStyle() → clipArea(ctx) → ctx.save()
  • ownerDocument: Animator._update() → chart.draw() → _resize() → getMaximumSize(canvas) → getComputedStyle(canvas) → canvas.ownerDocument

This manifests in Vue/React SPAs when users navigate away from pages containing animated charts. The component unmount destroys the chart, but previously-scheduled animation frames may still fire and attempt to access destroyed resources.

Similar to the issue fixed in #11764 for clearCanvas.