ProseMirror中DOM解析器样式匹配的回归问题分析

问题背景

在ProseMirror项目中，从1.21.0版本升级到1.21.1版本时，DOM解析器在处理HTML元素的样式属性时出现了回归问题。具体表现为文本装饰样式（如下划线）在某些情况下无法正确解析和匹配。

问题现象

当使用DOMParser解析包含<span style="text-decoration: underline">的HTML内容时：

• 在1.21.0版本中，能够正确解析为带有"underline"标记的文本节点
• 在1.21.1版本中，相同的HTML内容却无法识别下划线样式，解析为普通文本节点

技术分析

浏览器CSS属性规范化机制

问题的根源在于现代浏览器对CSS复合属性的"规范化"处理。浏览器（不包括JSDOM）会自动将复合属性如text-decoration或border分解为更详细的属性（如text-decoration-line和border-width）。这种规范化导致：

1. 原始样式属性名在DOM中被替换
2. ProseMirror的样式匹配系统基于属性名+值对的设计无法适应这种变化

样式匹配系统的局限性

ProseMirror原有的样式匹配机制存在两个主要问题：

1. 无法处理规范化后的属性名（如text-decoration-line替代text-decoration）
2. 无法反向匹配（即text-decoration-line规则无法匹配包含text-decoration的style属性）

解决方案

开发者发现了一个有效的解决方案：即使样式声明被浏览器规范化，仍然可以通过查询style[shorthandprop]来访问原始属性。基于这一发现，修复方案调整为：

1. 遍历所有定义了解析规则的样式属性
2. 检查这些属性是否存在于给定的（非空）样式集合中
3. 使用更全面的属性查询方式替代原有的直接匹配

技术启示

这一问题的解决过程为我们提供了几个重要的技术启示：

1. 浏览器兼容性考量：DOM解析器的实现必须考虑不同浏览器环境对CSS属性的处理差异
2. CSS属性复杂性：CSS属性的简写形式和详细形式需要被同等对待
3. 版本升级风险：即使是小版本升级也可能引入意想不到的兼容性问题

最佳实践建议

对于使用ProseMirror的开发人员：

1. 在升级版本时，应特别注意DOM解析相关的功能测试
2. 对于样式相关的解析规则，建议同时考虑简写和详细两种属性形式
3. 在编写自定义解析规则时，要考虑浏览器可能对样式属性进行的各种规范化处理

这一问题的解决不仅修复了特定版本中的回归问题，也增强了ProseMirror的DOM解析器对不同浏览器环境下CSS属性处理的鲁棒性。