ExtJS/Chrome下快速操作单元格编辑器功能异常的Bug求助
ExtJS 7 CellEditing 编辑器DOM丢失及垃圾回收错误修复方案求助
问题场景与报错信息
在非React的ExtJS 7模块化窗口开发中,遇到如下问题:当网格渲染未完成或后端函数执行过程中快速编辑单元格,有时会导致对应列的编辑器dom属性丢失,触发以下错误:
Uncaught TypeError: Cannot read properties of null (reading 'parentNode') at ctor.activateCell (app.js?_dc=20230104061611:formatted:123916:30) at ctor.activateCell (app.js?_dc=20230104061611:formatted:112576:35) at ctor.setActionableMode (app.js?_dc=20230104061611:formatted:112771:27) at ctor.setActionableMode (app.js?_dc=20230104061611:formatted:108918:41) at ctor.onCellClick (app.js?_dc=20230104061611:formatted:123793:15) at ctor.fire (app.js?_dc=20230104061611:formatted:11634:32) at ctor.doFireEvent (app.js?_dc=20230104061611:formatted:12125:41) at ctor.doFireEvent (app.js?_dc=20230104061611:formatted:37543:45) at b.doFireEvent (app.js?_dc=20230104061611:formatted:33414:19) at ctor.fireEventArgs (app.js?_dc=20230104061611:formatted:12051:23)
问题定位
通过调试ExtJS核心代码,确认问题出在classic/grid/plugin/CellEditing.js文件的activateCell方法(约第410行)的代码:
p = editor.el.dom.parentNode;
此时editor.el.dom已为null,无法读取parentNode属性。
影响与复现条件
- DOM元素丢失后,仅能通过刷新整个网格恢复,严重影响页面可用性。
- 该Bug难以稳定复现,电脑性能越低或网络越慢时触发概率越高,可通过在报错代码前设置断点手动复现。
已尝试的修复方案及失败情况
已重写CellEditing类进行以下尝试,但均未解决问题,还触发了新的垃圾回收错误:
- 用
try/catch包裹报错代码段 - 检测到DOM丢失时重新渲染编辑器
- 销毁并重建缓存的编辑器
触发的垃圾回收错误信息如下:
Error.js?_dc=1672869371981:103 Uncaught Error: Missing DOM node in element garbage collection: celleditor-1529 at new Ext.Error (Error.js?_dc=1672869371981:103:21) at Function.raise (Error.js?_dc=1672869371981:180:23) at Ext.raise (Error.js?_dc=1672869371981:269:21) at constructor.collect (GarbageCollector.js?_dc=1672869371980:67:21) at constructor.resume (GarbageCollector.js?_dc=1672869371980:160:16) at constructor.onTouchEnd (Gesture.js?_dc=1672869371981:588:54) at constructor.publishDelegatedDomEvent (Gesture.js?_dc=1672869371981:457:33) at constructor.doDelegatedEvent (Dom.js?_dc=1672869371981:506:16) at constructor.onDelegatedEvent (Dom.js?_dc=1672869371981:487:18)
现寻求有效的修复方案。
内容的提问来源于stack exchange,提问作者LDFlyer
相关产品推荐
相关产品推荐

