fix: support rendering into ShadowRoot containers#223
Conversation
Summary of ChangesHello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 此拉取请求旨在解决当渲染目标位于 Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here. Footnotes
|
There was a problem hiding this comment.
Code Review
这个 PR 旨在支持将图表渲染到 ShadowRoot 中,这是一个很棒的功能增强。整体实现思路是正确的,通过修改容器解析逻辑来查找 Shadow DOM 中的元素,并调整 MutationObserver 的观察目标。
代码审查发现了一些可以改进的地方:
- 在
renderer.ts中,MutationObserver的subtree选项被错误地设置为false,这可能导致在某些情况下 SVG 无法被正确检测到。 - 同样在
renderer.ts中,getObservationTarget函数存在冗余代码。 - 测试代码中存在一些不正确的类型转换和可以简化的实现。
我已经对这些问题提出了具体的修改建议。修复这些问题后,代码将更加健壮和清晰。
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #223 +/- ##
=======================================
Coverage 46.29% 46.29%
=======================================
Files 341 341
Lines 28109 28109
Branches 2310 2310
=======================================
Hits 13014 13014
Misses 15083 15083
Partials 12 12
Flags with carried forward coverage won't be shown. Click here to find out more.
🚀 New features to boost your workflow:
|
b1ffda1 to
a1b42ee
Compare
|
为了避免“字符串 selector 穿透 Shadow DOM”的扫描成本只能遵循以下准则:
|
|
渲染问题解决了,但是还存在一个编辑器的问题: |
|
针对编辑器的ShadowRoot修改比较多,我拆成一个新的pr提交 #224 ,这个pr应该可以了 |
原因应该是在
renderer中:Renderer.render()先把SVG设成visibility: hidden,然后它是通过MutationObserver来恢复的,但是这个observer只监听了document,所以document上的MutationObserver看不到ShadowRoot内部的新增节点,所以postRender()没有执行,结果就是removerProperty("visibility")没有执行。fix:#222