fix(omi-vueify): 避免复杂属性被深度代理 - #999
Open
RSS1102 wants to merge 1 commit into
Open
Conversation
attrs 汇总容器改用 shallowRef,只追踪结果对象替换,避免传给 Web Component 的复杂属性被再次转换为 Vue Proxy。 增加 Proxy invariant 与响应式嵌套更新回归测试。 Vue 3.5.41 复现:https://stackblitz.com/edit/hxxsvh94?file=README.md
Member
|
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
omi-vueify当前使用深层ref保存格式化后的 attrs。Vue 会继续深度代理这个结果对象,导致原本准备传给 Web Component 的普通复杂属性再次变成 Proxy;下游冻结数组后读取元素时,可能触发 ECMAScript Proxy invariant,因此业务侧此前需要额外使用markRaw规避。说明:TDesignOteam/tdesign-web-components#381 讨论的是 TDesign Web Components 在旧版 Chrome/内嵌浏览器中的兼容诉求,并非由本问题直接引起;这里用于说明下游 Web Component 的实际兼容场景。
修复
将 attrs 汇总容器由
ref改为shallowRef:markRaw兼容性现有使用
markRaw的代码仍然兼容,不需要迁移;本次修复只是让普通复杂对象也不会被汇总容器二次代理,因此业务侧不再必须使用markRaw。测试
complex data types针对性测试通过;npm run build通过。完整测试套件当前存在一个与本次改动无关的既有单词事件断言失败,本 PR 为保持范围最小未修改该行为或测试。