[Bug]: destroy() 后,会设置 `this.context = {}` ,但是一些异步方法里面访问 this.context.xxx.abc 报错。
- Dominant language
- TypeScript
- Stars
- 12.3k
- Forks
- 1.6k
- PR merge metrics
- No merged PRs in 30d
Description
### Describe the bug / 问题描述
## 复现问题
此复现仅 通过 StrictMode 来复现问题
https://codesandbox.io/p/sandbox/fcfft5?file=%2Fsrc%2FApp.tsx%3A28%2C7
分析:
- StrictMode 会二次更新,从而第一次会 destroy()
- destroy 设置 `this.context = {}` https://github.com/antvis/G6/blob/v5/packages/g6/src/runtime/graph.ts#L1297
- render 这里读取 this.context.element!.draw,从而导致错误 https://github.com/antvis/G6/blob/v5/packages/g6/src/runtime/graph.ts#L1201
## 相似问题
同理如果用户进度 Graph 页面,又马上离开,情况会 StrictMode 一样,我发现了这些问题。
- autoFix 报错
- render 里有 await ,之后 调用 autoFix https://github.com/antvis/G6/blob/v5/packages/g6/src/runtime/graph.ts#L1196
- autoFix 读取出错 `const { autoFit } = this.context.options;` 因为 options 为 undefined https://github.com/antvis/G6/blob/v5/packages/g6/src/runtime/graph.ts#L1372
- transformDataAfterLayout 出错
- 调用 postLayout https://github.com/antvis/G6/blob/v5/packages/g6/src/runtime/graph.ts#L1208
- postLayout 有 await 之后 调用 transformDataAfterLayout
- 读取 `const transforms = this.context.transform.getTransformInstance();` 报错,因为 transform 为 undefined
### Reproduction link / 复现链接
https://codesandbox.io/p/sandbox/fcfft5?file=%2Fsrc%2FApp.tsx%3A28%2C7
### Steps to Reproduce the Bug or Issue / 重现步骤
_No response_
### Version / 版本
Please select / 请选择
### OS / 操作系统
- [x] macOS
- [ ] Windows
- [ ] Linux
- [ ] Others / 其他
### Browser / 浏览器
- [x] Chrome
- [ ] Edge
- [ ] Firefox
- [ ] Safari (Limited support / 有限支持)
- [ ] IE (Nonsupport / 不支持)
- [ ] Others / 其他
Contributor guide
No contributing guide indexed for this repository
Research direction
Start in packages/g6/src/runtime/graph.ts at destroy(), render(), autoFix(), postLayout(), and transformDataAfterLayout(), then run the linked CodeSandbox reproduction under StrictMode. Trace the awaited paths after destroy() clears context. Done means the reproduction no longer throws when a graph is destroyed during these asynchronous operations.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100