Fancytree排障：preInit触发但init事件未触发无报错如何排查

以下是针对同代码跨场景可运行、仅特定场景加载失败的针对性排查方向，按排查成本从低到高排序：

• 先校验挂载容器的DOM有效性
  在tree.render()调用前打日志输出挂载容器的三个状态值：container.isConnected（是否存在于当前DOM树）、container.offsetWidth、container.offsetHeight。如果容器位于未激活的标签页、收起的折叠面板、带display: none属性的父节点下，会出现容器宽高为0、甚至脱离DOM树的情况，Fancytree在计算节点位置、生成渲染占位时会直接卡住，且不会抛出显式错误，直接导致init事件无法触发。
• 校验加载完成的节点数据合法性
  由于preInit和nodeLoadChildren事件已正常触发，说明数据请求流程无问题，需在nodeLoadChildren回调中全量校验节点数据：重点排查是否存在重复的节点key值、节点children字段为非数组类型（null/字符串/数字等）、节点数据存在循环引用、节点title字段传入未闭合的非法DOM片段，以上问题都会导致DOM渲染流程中断。可将该场景下拿到的全量节点数据和正常运行场景的节点数据做逐字段对比，快速定位异常字段。
• 排查场景专属资源的冲突问题
  仅特定场景复现的问题，大概率是该场景独有的CSS/JS资源干扰：
  1. 检查是否有全局DOM操作脚本（如通用内容美化、懒加载、水印脚本）在Fancytree渲染过程中篡改了树组件生成的临时DOM节点，导致Fancytree内部遍历节点层级时进入死循环；
  2. 检查该场景独有的全局CSS是否给ul/li节点设置了display: flex、伪类content等会破坏Fancytree默认DOM结构的样式，导致DOM结构校验不通过卡住。
     可临时逐一禁用该页面独有的CSS/JS资源，验证是否恢复正常定位冲突源。
• 校验Fancytree扩展加载状态
  如果该场景按需加载了dnd、edit、filter等Fancytree扩展，先确认扩展版本和核心库版本完全匹配，不存在扩展先于核心库加载、扩展初始化配置为空/非法的问题。可临时禁用所有非必要扩展，观察init事件是否能正常触发，再逐一开启扩展定位故障点。
• 捕获静默的内部异常
  给树实例绑定loadError、renderError事件回调，同时在tree.render()调用外层包裹try/catch，打开浏览器开发者工具的Sources面板，开启「异常时断点」并勾选「捕获已捕获的异常」，排查是否存在被Fancytree内部异常捕获逻辑吞掉的报错，比如事件回调里访问不存在的节点属性、跨上下文访问被拦截等不会主动打印到控制台的错误。

内容的提问来源于stack exchange，提问作者Allison Stec