[g-lite] Canvas.destroy() leaves event.path on reused module-level events, retaining the destroyed canvas #2253

Version: @antv/g-lite 2.7.0; the same code is on master.

g-lite reuses module-level events for every canvas (mountedEvent, unmountedEvent, beforeRenderEvent, rerenderEvent, afterRenderEvent and the mutation event caches). Canvas.destroy() clears them here:

https://github.com/antvis/G/blob/master/packages/g-lite/src/Canvas.ts#L398-L403

const clearEventRetain = (event: CustomEvent | MutationEvent) => {
  event.currentTarget = null;
  event.manager = null;
  event.target = null;
  (event as MutationEvent).relatedNode = null;
};

event.path is not cleared. After a dispatch it still lists the canvas the event passed through, and through canvas.context.config.container it keeps the destroyed canvas's container element, and the page around it, reachable.

We found this in an Angular app that mounts and destroys G6 graphs on route changes. Each destroyed graph's page stayed alive: about 790 DOM nodes per visit after garbage collection. The heap snapshot retainer path:

beforeRenderEvent.path[1] → Canvas → context.config.container → detached container <div> → page

Resetting the path in clearEventRetain releases it:

  (event as MutationEvent).relatedNode = null;
  event.path = [];

To reproduce: create a G6 Graph (or a G Canvas) in a container, render it, call destroy(), remove the container from the DOM, force garbage collection, and take a heap snapshot: the container is retained through beforeRenderEvent.path.

(Possibly related to the unexplained retention discussed in #1983.)