#58122024年4月15日作者 jogibear99881 个回答
可复制演示链接 https://node-projects.github.io/web-component-designer-demo/index.html描述一下那个虫子 几年前我开始用 Webcomponents 设计网页的框架，现在发现了 GrapeJS。想说也许我们目标相同，可以互相受益？（目前不知道具体怎么做，但也许吧）（链接：https://node-projects.github.io/web-component-designer-demo/index.html） 目前我的流程布局设计支持缺失，但它在网格和Flexbox以及绝对定位元素中表现非常好。转换（旋转）内容也有效。我为此创建了一个VSCode扩展：https...
ClaudeCode
谢谢你举报，@jogibear9988。 有兴趣协作？的问题似乎是竞赛条件或状态管理时机问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原因 在报告中包...
#57852024年3月29日作者 bernesto3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 这可能是刻意为之，但考虑到其意图，这似乎有些奇怪。 如何复现这个漏洞？点击预览（眼睛） 预期的行为是什么？ 页面的浏览方式是终端用户看到的。所有管理标记都已从页面中移除。 目前的行为是什么？ 除虚线外的所有管理标记都被移除。 在预览阶段，'.${ppfx}dashed '应从正文中移除，退出预览时启用后重新应用。行为准则 [X] 我同意遵守本项目的行为准则
artf
谢谢@bernesto演示方面其实还有更新要做。 我已经准备好了更改，下次发布时会修正。
ClaudeCode
谢谢你举报，@bernesto。 关于大纲在预览模式下依然存在，这个问题很棒。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组...
#57752024年3月26日作者 ctrhub2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Arc 版本 1.35.0 / Chromium 引擎 123.0 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？开放开发工具选择一个组件主机运行： “JS const selectedComponent = editor.getSelected（）; selectComponent.get（'traits'）.clone（）; 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： “''js const selectedComponent = editor.getSelected（...
artf
如果你需要复制 traits，我建议简单地做这个操作：'JSON.parse（JSON.stringify（editor.getSelected（）.getTraits（））'。 我不记得文档里提到过克隆特征，所以我建议避免使用非公开API。
ClaudeCode
谢谢你举报，@ctrhub。 关于component.get（'traits'）.clone（）已不再可用，这个问题非常好。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'...
#57682024年3月19日作者 rhoenerSBS1 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122 可复制演示链接 不适用 描述一下那个虫子 GrapeJs 文档表明，可以在块的“content”属性中添加混合内容（见 https://grapesjs.com/docs/modules/Blocks.html#mixed）。但该属性的类型定义是“字符串 |组件定义“（参见 https://github.com/GrapesJS/grapesjs/blob/dev/src/block_manager/model/Block.ts#L17）。 这会导致 TypeScript 项目编译时出现错误。 如何复现这个漏洞？定义混合值的块...
ClaudeCode
谢谢你举报，@rhoenerSBS。 关于 BlockProperties 中“content”属性类型错误的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'som...
#57572024年3月15日作者 kuntal8113 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122，Safari 17 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？添加链接组件，尝试编辑链接文本 预期的行为是什么？ 链接文本应可编辑 目前的行为是什么？ 行为准则 [X] 我同意遵守本项目的行为准则
artf
感谢报告，将在下次发布中修复（https://github.com/GrapesJS/grapesjs/commit/a54f213c33ee90549ef06f3b505c455f1abfc323）。
ClaudeCode
谢谢你举报，@kuntal811。 关于链接标题不可编辑的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命周期...
#57422024年3月11日作者 bernesto4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122 可复制演示链接 无 描述一下那个虫子 如何复现这个漏洞？将git检查到Windows 10+机器上按照提供的流程构建。 预期的行为是什么？ 它应该和*inx系统一样建造。 目前的行为是什么？ 该构建因引用 Backbone 的错误而失败： “嘘 警告内容见./src/common/index.ts 35：2-16 导出“default”（导入为“Backbone”）在“backbone”中找不到（模块没有导出） @ ./src/editor/view/EditorView.ts 16：0-39 45：21-22 68：2-6...
bernesto
是的，我做了所有常规的事情。锁定文件、更新、各种导入方式（{}、require、*、full path 等） 不知道为什么，但我弄坏东西的时候，会弄得很厉害。永远是2级或3级辅助，哈哈。 我确实认为问题出在CLI，或者......配合 Backbone-Undo。也许是路径相关的，或者是符号链接，或者...... ̄\(ツ)/ ̄ 总之，我明白“时间”的含义。我已经花了太多时间了，如果你有兴趣告诉我，哈哈
bernesto
说得好。我还没试过其他版本的Node。我会试试这个方法。
artf
是的，构建/服务是由CLI管理的（我们把问题移到那里），但我不确定问题出在哪里（因为没有Windows可以测试🥲）。
#57242024年3月8日作者 bernesto2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome v122可复制演示链接 https://jsfiddle.net/zwo0mdqf/5/描述一下那个虫子 如何复现这个漏洞？创建有效的内联块元素，如span、b、i、em等，这些元素使用多个空格、制表符或换行符作为单词分隔符。 预期的行为是什么？ 渲染时，这些元素应间隔一格。HTML导出空白应尊重输入空白。 目前的行为是什么？ 这些元素在编辑器中作为独立组件呈现，但呈现为一个单词。输出HTML去除了输入空白。注意：组件HTML会在每个元素的新行中导出，因此显示的输出会正确渲染，但getHtml（）则不会。行为准则[X] 我同意遵守本项目的行...
danstarns
最终倾向于合并提交。https://github.com/GrapesJS/grapesjs/pull/5719
ClaudeCode
谢谢你举报，@bernesto。 关于在线元素中空白处理的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'...
#57202024年3月6日作者 bernesto2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122 可复制演示链接 https://jsfiddle.net/n38vbktg/ 描述一下那个虫子 如何复现这个漏洞？创建一个组件，传播包含可分层=true的默认值。在“有能力”下引入一条评论。 预期的行为是什么？ 评论要么保持隐藏，要么不会导致错误。 目前的行为是什么？ 编辑将评论视为HTMLlement。当编辑器尝试从节点读取不存在的属性时，如 getComputedStyle 或 getClientRects，这会触发多个错误。两种方法都应该先进行检查。或者——应引入一种新的注释类型，覆盖从父节点传播的默认值。 错误发生在这...
ClaudeCode
谢谢你举报，@bernesto。 关于传播组件默认值在引入子注释时可能导致层层崩溃的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'som...
#57182024年3月4日作者 mitcht2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 版本 122.0.6261.95（官方版本）（64 位） 可复制演示链接 https://jsfiddle.net/n4x6L1v0/2/ 描述一下那个虫子 如何复现这个漏洞？保存早期版本 Grapejs（0.18） 的组件数据尝试将 grapesjs 作为项目数据导入到最新版本 预期的行为是什么？ Grapes 可以简单地替换 watch 以替换旧的 'textnode' 条目，并更新为“wrapper”输入。 目前的行为是什么？ 控制台会触发偏移错误 这段代码并非重现该漏洞的必要条件，但它目前让我能够绕过这个问题。 “''js 修复...
artf
谢谢@mitcht，但正如我之前提到的，主组件根本不可能是 textnode，所以在核心处理这种情况或开启这个问题都没有意义。 总之，如果逻辑对你有效，就直接在编辑器里用它。
ClaudeCode
谢谢你举报，@mitcht。 关于可能的升级路径问题，比如“textnode”从0.18到>最新版本变成了“wrapper”，这建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法：* 听取“selector：add”以获取CSS选择器更改 使用“selector：cus...
#57052024年2月26日作者 bernesto4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v122 可复制演示链接 https://jsfiddle.net/Lk2bwhp4/ 描述一下那个虫子 如何复现这个漏洞？将编辑器放入容器中，然后通过程序调整容器的宽度。 预期的行为是什么？ 编辑器及其所有子节点应相应调整大小。 目前的行为是什么？ 编辑器中所有组件的画布位置都保留了画布调整前的偏移。注意，窗口大小调整会重置位置。这必须在窗口中以程序形式完成。用例是编辑者在一个页面上，有其他面板可以调整编辑可用空间大小。在下面的示例中，可以看到在将编辑器调整为更大宽度后，工具如何与相关元素对齐。工具会留在原来的位置，直到某个事件触发更...
artf
感谢@bernesto报告，但由于我们无法检测程序布局的变化而不影响性能，在这种情况下，你必须通过 ['editor.refresh（）]]（https://grapesjs.com/docs/api/editor.html#refresh） 手动更新编辑器布局（例如，在你的例子中，调用直接放在 resizeEditor 函数的末尾）
bernesto
你好，@artf，我其实不小心把这个混在你最后接受的拉取请求里（src/canvas/model/Frame.ts）。你可以看看我添加的内容，看看是否造成了问题。我们现在正在测试中，没有看到性能下降，而且它解决了问题。
artf
我其实把这个误混在你上次接受的拉取请求里了 我实际上删掉了，因为看起来没什么关系 🤣 补充回来没问题，但要考虑你的例子只有桌面设备才会有效。宽度填充了容器，这会触发iframe窗口的缩小（然后触发新增事件）。如果你换成更小的设备，这个方法就不行了，那时不会触发调整大小事件，所以你仍然需要刷新调用。