#55492023年12月6日作者 driskell4 个回答
GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ 狩猎17可复制演示链接 https://grapesjs.com/demo-mjml.html描述一下那个虫子 如何复现这个漏洞？https://grapesjs.com/demo-mjml.html查看代码 - 复制MJML导入代码 - 粘贴 MJML 并添加到顶部 <mj-head><mj-preview>Some preview text</mj-preview></mj-head>现在尝试编辑它 <img width=“878” alt=“截图 2023-12-06 at 14 23 53” src=“https://github.co...
artf
这不是核心相关的问题，而且很可能根本不是问题，因为<mj-preview>默认在mjml插件中“''[不支持]（https://github.com/GrapesJS/mjml/tree/master/src/components）
driskell
@artf 抱歉，我不太明白。这确实是个详细的问题。这需要在另一个仓库上提出吗？我对这里的内部结构不熟悉，所以不知道GrapesJS/mjml需要支持什么，才能让这个仓库不显示它
driskell
Head中记载： https://github.com/GrapesJS/mjml/blob/master/src/components/Head.ts#L14
#55452023年12月5日作者 AFriboulet-ii1 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 版本 119.0.6045.200 可复制演示链接 https://jsfiddle.net/d64pkcom/1/ 描述一下那个虫子 如何复现这个漏洞？在 Canvas 中拖拽组件文本观看jsfiddle控制台 预期的行为是什么？ 不要触发RTE：禁用 目前的行为是什么？ 触发RTE：禁用 https://github.com/GrapesJS/grapesjs/assets/128728949/b7fc7998-aeef-47d5-84f4-af74966d56cf 行为准则 [X] 我同意遵守本项目的行为准则
GJS Helper
你准确地识别出GrapesJS中一个小但意外的行为：当从块面板拖拽新组件（比如文本块）到画布时，触发了rte:disable事件。这确实不是预期的行为，因为富文本编辑器（RTE）只有在之前在所选组件上激活时才应该被禁用。 根本原因 rte:disable事件由GrapesJS RTE模块在其disable()方法被调用时发出。该方法通常在取消选中具有活跃RTE的组件，或编辑者内部状态要求停用RTE时调用。在从块面板拖拽操作时，GrapesJS的内部逻辑可能执行隐式触发“清除...
#55422023年12月4日作者 brenoassp2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 119.0.6045.200 64位 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？拖拽视频块到画布中点击视频，选择YouTube作为提供者。添加任何视频ID，比如lDK9QqIzhwk，并勾选自动播放选项。点击查看代码按钮，查找生成的iframe。URL大致是： https://www.youtube.com/embed/lDK9QqIzhwk?&autoplay=1&muted=1。 预期的行为是什么？ 预期的行为是自动播放生成的HTML视频。 目前的行为...
artf
看起来静音属性在Vimeo上是正确的，但YouTube上不行。我会推修，谢谢。
GJS Helper
感谢你报告这个问题并进行全面调查。你已经正确找到了根本原因和可用的解决方案。这确实是 GrapesJS默认YouTube视频组件中的一个bug。 根本原因分析 问题源于 GrapesJS 用来静音YouTube视频的参数与YouTube的iframe API实际预期参数不匹配。 GrapesJS 目前使用的 muted=1： GrapesJS video 组件在生成 YouTube iframe 的 src URL 时，如果启用“静音”选项，会在查询参数中添加 muted=...
#55362023年11月29日作者 adiux1 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 版本 119 可复制演示链接 https://jsfiddle.net/bj7afw63/1/ 描述一下那个虫子 如何复现这个漏洞？装填小提琴尝试添加默认RTE（非CKE）的链接界面中没有任何变化，控制台出现 JS 错误：TypeError： $ 不是函数 预期的行为是什么？ 在 mj-text 组件的界面中添加了一个链接。 目前的行为是什么？ 链接未被添加。 我目前发现的 我追踪到GJS方法的错误：[getModel（）]（https://github.com/GrapesJS/grapesjs/blob/149a9b2ad...
GJSBlock
谢谢你举报，@adiux。 关于无法添加链接：getModel（） 失败，TypeError： $ 不是函数，这个问题很棒。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => co...
#55302023年11月25日作者 Harshsne261 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v91 可复制演示链接 https://codepen.io/dhanadsp1120/pen/ExrRvOB 描述一下那个虫子 如何复现这个漏洞？通过调用 um.stop（） 禁用撤销管理器。对内容进行修改。使用 um.start（） 重新启用撤销管理器。 预期的行为是什么？ 按下Ctrl+Z后，系统应恢复到停止撤销管理器前的状态，只显示重新启用后所做的更改。 目前的行为是什么？ 按Ctrl+Z会跳转到前一步，表示所有更改都在跟踪，尽管撤销管理器暂时停止。 ![撤销管理器]（https://github.com/Grapes...
GJS Helper
你描述的 GrapesJS 撤销管理器（um.stop() 和 um.start()）的问题是已知的行为，即尽管 um.stop() 方法将内部 enabled 标志设置为 false，但并不能始终阻止所有内部 GrapesJS 操作将命令推送到撤销栈。这导致在管理器理应停止记录时，仍然被记录在历史中。 根本原因 GrapesJS UndoManager 有一个 add 方法，可以在推送命令到历史栈前检查 enabled 标志。 um.stop() 方法设置 this.en...
#55252023年11月19日作者 duydvu2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Edge v119.0.2151.72 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 你好，感谢你创建了一个了不起的项目。我想报告使用 GrapesJS时发现的一个问题。 如何复现这个漏洞？选择一个组件添加任意名称的类，直到组件超过20个类。选择另一个组件并重新选择该组件。 预期的行为是什么？ 不应该有性能问题。 目前的行为是什么？ 浏览器会明显卡死一段时间。添加的类越多，卡死的时间越长。当组件有23个类时，我的浏览器会卡顿10秒。 这是使用 TailwindCSS 时常见的问题，因为类很多...
artf
同意建议，我会相应更新。谢谢@duydvu
GJSBlock
谢谢你举报，@duydvu。 关于在单个组件中添加超过20个职业时性能问题的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'somethi...
#55232023年11月18日作者 lexoyo2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Firefox 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？选择舞台上的组件用 CTRL+c 复制组件选择实体（取消选择组件）用CTRL+V粘贴 预期的行为是什么？ 在正文末尾粘贴当前页面 目前的行为是什么？ 由于以下条件，它什么都不做： https://github.com/GrapesJS/grapesjs/blob/8025b95a645907574389e950f32950190ceb602c/src/commands/view/PasteComponent.ts...
lexoyo
注意，这个bug导致无法将元素复制粘贴到空白页面
GJS Helper
你描述的问题是GrapesJS默认 paste-component 命令中的已知行为。根本原因在于命令的实现，特别是其run方法开头的条件if (!selected || !selected.length) return;。如果画布上当前没有选中组件，这个检查会阻止粘贴操作继续。 设计上，默认paste-component命令期望选中的组件决定将复制内容插入的位置（通常是在所选组件旁边）。当没有选择任何内容时，它就没有上下文目标，因此没有任何作用。 为了实现预期行为——在没...
#55032023年11月6日作者 MaxwellTheSecond3 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 没有 描述一下那个虫子 Component.ts 的 replaceWith 方法没有字符串类型。 预期的行为是什么？ 我应该能像示例中那样用字符串替换组件 component.replaceWith('<div>Some new content</div>'); 目前的行为是什么？ ![grapesproblem]（https://github.com/GrapesJS/grapesjs/资产/81811949/67837b49-a81f-4c07-a8b1-9d5481f457a1） 行为准则 [X] 我同意遵守本项...
artf
合并 https://github.com/GrapesJS/grapesjs/pull/5504
GJS Helper
你正确识别了GrapesJSreplaceWith方法的TypeScript类型问题。虽然该方法内部支持用HTML字符串替换组件，但其TypeScript定义（Component.d.ts）目前未反映这一点，导致开发环境中出现类型错误。 根本原因 GrapesJS 中的 replaceWith 方法设计为灵活。当你传递字符串时，GrapesJS的内部 HTML 解析器（editor.Parser.parseHtml）会被调用，将该字符串转换为GrapesJS组件，然后再执行...
#55012023年11月5日作者 eko3alpha1 个回答
GrapesJS版本 [X] 我确认使用最新版本GrapesJS 你用的是什么浏览器？ Chrome/Safai/Firefox 可复制演示链接 https://grapesjs.com/docs/getting-started.html#layers 描述一下那个虫子 如何复现这个bug？ 请访问[此链接]（https://grapesjs.com/docs/getting-started.html#layers）的“GrapesJS入门指南”文档。 尝试通过拖动图层面板的左边来调整它的大小。 注意面板的漂移行为。 预期的行为是什么？ 调整图层面板大小时，宽度应平滑调整，不会左右偏移。面板右边应固定固定，只有宽度变化。 目前的行...
GJS Helper
你准确地指出了GrapesJS“入门”演示中关于右侧面板尺寸调整的布局漏洞。你观察到的漂移行为确实不是预期的平滑调整尺寸，面板右边保持固定。 根本原因分析 GrapesJS编辑器通常使用弹性盒布局作为主结构。面板（如图层面板）是主编辑器容器（.gjs-editor）中的flex项。为了确保右侧面板始终被推向最右边并从左边调整大小，GrapesJS的默认CSS包含一条规则来应用margin-left: auto;。该margin-left: auto;属性会占用元素左侧的所有...
#54972023年11月3日作者 pittleCheung1 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 最新版本的Chrome浏览器 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？我的图片链接 https://topkeeoss.cdn.weberss.com/602907992031105024-public/Beige%20and%20Black%20Spacious%20Office%20Workspace%20Instagram%20Post%20（600%20x%20900%20%E5%83%8F%E7%B4%A0）%20（600%20x%20800%20%E5%8...
GJS Helper
谢谢你举报，@pittleCheung。 关于添加背景图片失败的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'）...