#66512025年11月17日作者 DavidHarvey2 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 142.0.7444.61 可复制演示链接 https://codepen.io/DavidHarvey-the-lessful/pen/ZYWeMbG 描述一下那个虫子 当将“可丢弃”组件移动到“文本”组件时，组件“可丢弃”状态会被忽略。 如何复现这个漏洞？ 尝试将可文本组件拖拽到文本组件中，使用“droppable： false”。 预期的行为是什么？ 作为用户，我认为将 droppable 设置为 false 可以防止内部组件丢失。 目前的行为是什么？ 放弃是允许的。 行为准则 [x] 我同意遵守本项目的行为准则
artf
https://github.com/GrapesJS/grapesjs/pull/6652#issuecomment-3551018995
GJS Helper
你遇到的问题是，当textable组件被拖入GrapesJS text组件时，droppable: false会被忽略，这是GrapesJS集成富文本编辑器（RTE）并处理textable组件时已知的行为。 根本原因 在GrapesJS中，组件上的droppable属性主要控制在GrapesJS组件树结构中是否可以作为子组件添加其他GrapesJS组件。例如，如果你有一个div组件，droppable: false，你不能将另一个div组件作为子组件拖入该组件。 然而，Gr...
#66462025年11月11日作者 soul-media3 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 与 Firefox 可复制演示链接 描述一下那个虫子 如何复现这个漏洞？ Chrome 和 Firefox： 为图片/文本添加填充 有时会出现错误，有时不会发生。 https://github.com/user-attachments/assets/01270f08-974d-4898-bde0-83233f9258e0 目前的行为是什么？ 铬 错误如下：Uncaught InvalidCharacterError：未能在“Element”上执行“setAttribute”：“0”不是有效的属性名。 这是我添加填充前的文字样子。...
trebor94
我也遇到了同样的问题，同时也在使用grapesjs-mjml插件。显然，只有在加载一个项目时，且该项目在组件attributes上存在style属性时才会出现。每次在编辑器中做了一次更改后，style属性都会被扩展，old value会加上最新的值，项目的JSON会呈指数增长。 我尝试了不同版本的 grapesjs，从版本 0.22.2 开始往上。到了版本 0.22.6 时问题开始出现，所以在发布 0.22.5 到 0.22.6 之间某个时候，这个 bug 应该被引入了。在...
trebor94
很遗憾，我没能弄清楚在导出之前加载的项目数据时，'style'属性会在哪里、什么时候被添加到组件的'style'里。也许有人能找出问题的原因。 @soul-media：顺便说一句，给“mjml”组件补丁“init”方法作为变通方法似乎有效，并且阻止了“style”属性在项目数据导出时添加（即使加载了之前保存的项目）。这似乎即使在“0.22.14”版本下也能正常工作，JSON输出会和你截图右侧的差不多。 要修补该函数，可以使用 'grapesjs-mjml' pluginsO...
GJS Helper
看起来你在 GrapesJS遇到了一个bug，特别是在使用MJML组件并应用样式（如填充）时，导致生成和存储无效属性。这个问题似乎是回归，因为它在旧版本（0.22.2）中有效，但在新版本中失败。 根本原因分析 问题的核心在于 GrapesJS 如何序列化和反序列化组件属性，尤其是针对MJML元素。当你添加填充或其他样式时， GrapesJS 有时会错误地生成纯数字名称的属性（例如， 0="font-size:30px"， 1="font-size:30px"），覆盖在 mj...
#66412025年11月8日作者 bilogic2 个回答
GrapesJS 版本 [x] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 版本 141.0.7390.123（官方构建）（64位） 可复制演示链接 https://codesandbox.io/p/sandbox/jovial-elion-js8zgy?file=%2Findex.js%3A1%2C1-15%2C1 描述一下那个虫子 上述方法在 0.15.x 中有效，但在 0.22.13中不行。有人知道问题出在哪里吗？ 行为准则 [x] 我同意遵守本项目的行为准则
artf
嘿，@bilogic你的演示似乎用的是正确的 API 来扩展组件，那个依赖 '.extend（' 的 API 早就被放弃了
GJS Helper
你在扩展GrapesJS组件模型，特别是“链接”类型时遇到的问题，并试图通过直接引用linkType.model.prototype.defaults设置其defaults属性，是 0.15.x 和 0.22.13 之间的行为GrapesJS变化。这种变化很可能是由于 Backbone 的 extend 方法（GrapesJS组件基于它构建）或 GrapesJS组件系统本身在模型继承过程中处理 defaults 属性的方式进行了内部更新。 根本原因 在较早的GrapesJS...
#66342025年10月28日作者 ssteele3 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 141.0.7390.123 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 我们的应用服务于要求所有页面对所有用户均可访问的客户。我正在运行最新的 Grapesjs 库： “package.json “grapesjs”： “0.22.13”， “grapesjs-blocks-basic”： “1.0.2”， “grapesjs-preset-webpage”： “1.0.3”， <img width=“1728” height=“1117” alt=“Image” src=“...
artf
这与 https://github.com/GrapesJS/preset-webpage 相关 你可以自由地在插件上更新样式，或者提交带有修复的PR。
GJS Helper
在像GrapesJS这样复杂、动态的网页编辑器中实现完全无障碍合规需要仔细考虑和定制。WAVE评估工具经常会发现缺少ARIA属性、对比度不足以及交互组件中使用的非语义元素等问题。虽然GrapesJS提供了坚实的基础，但一些默认UI元素可能缺乏获得满分所需的明确无障碍属性。 以下是WAVE等工具报告的常见无障碍问题的详细说明，以及如何在您的 GrapesJS 实施中解决这些问题： 1.缺少ARIA属性和角色（例如面板按钮、标签页） GrapesJS UI中的许多互动元素，如面...
#66062025年9月12日作者 MisterKeyboard4 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 描述 编辑器加载时间非常慢。 在复杂的页面（例如包含众多元素和插件如旋转木马的首页），完全加载可能需要长达1分20秒。 但即使是只有少量元素的页面，加载速度仍然明显很慢（几秒钟）。 这种性能问题使编辑器在制作中使用变得困难。 繁衍步骤 打开 GrapesJS 编辑器，创建一个包含多个组件和插件（例如轮播）的页面。 等待编辑器加载。 也可以用只有几个块的简单页面进行测试。 预期结果 编辑器应在几秒钟内加载，无论页面复杂度如何。 实际结...
artf
感谢@MisterKeyboard提供JSON。 你的项目包含了10K风格的规则，数量不少，但我不认为负载会受到太大影响。 @mohamedsalem401我认为我们需要确认数据源相关的更改（例如“StyleableModel.set”）是否对数据🤔源影响过大
mohamedsalem401
@artf会看看并更新情况。
artf
@MisterKeyboard你能分享项目的JSON吗？这样我们可以验证
#66032025年9月4日作者 nanto2 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v142.0.7392.0 （canary） 可复制演示链接 https://jsfiddle.net/xce183nm/1/ 描述一下那个虫子 如何复现这个漏洞？ 创建一个编辑器实例，加载包含字符引用的 HTML 代码。 “''js const editor = Grapesjs.init（{ 组件： '<body><p title=“< & >”></p></body>'， }); 预期的行为是什么？ 属性值中的符号通过字符引用转义。“p”元素的“title”属性值被解析为“< & >...
artf
谢谢你提供的所有信息和细节，这很有帮助。也谢谢你的宣传。
GJS Helper
你发现了GrapesJSHTML序列化过程中关于属性值转义的一个关键漏洞。问题源于Component模型的renderAttributes方法，它直接将属性值插入HTML字符串，而没有正确的HTML实体转义。这导致输出中出现未转义字符，如&、<和>，破坏往返一致性，并可能导致其他工具的解析问题。 根本原因 当GrapesJS解析HTML，浏览器的DOM解析器会正确解释HTML实体（例如，<变为<，&amp;变为&）。这些未转义的值随后存储在内部Comp...
#65902025年8月18日作者 yashvi20262 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 镀铬 可复制演示链接 https://codepen.io/Harshsne/pen/zxvREjB 描述一下那个虫子 如何复现这个漏洞？ 拖拽文本组件 预期的行为是什么？ 在图层管理器中不应该选择/拖拽它 目前的行为是什么？ 在layermanager中选择/拖拽 甚至尝试过， 'const 图层 = 编辑器。层次; layers.setLocked（comp， true）; console.log（layers.isLocked（comp））;' 请提供一个解决办法，直到你尽快解决这个问题。@artf 行为准则 [x] 我同意遵守本项目的...
artf
你可以用“可分层：false”属性隐藏组件，或者创建自己的[自定义图层管理器界面]（https://grapesjs.com/docs/modules/Layers.html#customization），包含所有需要的UI逻辑。
GJS Helper
你遇到的问题是，锁定的组件仍然可以在GrapesJS图层管理器中被选择、拖拽和删除，这是一个常见的混淆点。GrapesJS组件上的locked属性主要控制画布上的交互（例如，防止直接从画布中选择、拖拽、调整大小和删除）。默认情况下，图层管理器作为独立的UI组件，不会根据组件的locked状态本身限制这些操作。 根本原因 图层管理器的默认LayerView（图层面板中每个组件的可视化表示）在允许选择、拖拽或删除前，不会自动检查其关联组件的 locked 状态。要实现期望的行为...
#65892025年8月16日作者 mohammedmoulla1 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Google Chrome v139.0.7258.128 可复制演示链接 https://codesandbox.io/p/sandbox/relaxed-payne-vt3pgc 描述一下那个虫子 如何复现这个漏洞？ 在画布上添加一些元素 尝试在图层管理器中查找元素并拖动或移动它们 预期的行为是什么？ 在0.20.2版本中运行得很完美 目前的行为是什么？ 不能更改图层管理器树的根节点 ==> 只能更改主体 我尝试了所有方法，但都没用 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： 不，直接打开链接 行为准则 [x] 我同意遵守本项目...
GJS Helper
感谢你报告这个问题并提供了一个清晰可复现的演示。你在尝试更改根目录后遇到的拖放问题，是由于错误地使用了layerManager.root配置选项。 根本原因 GrapesJS初始化配置中的layerManager.root选项期望的是 GrapesJS组件实例，而不是 CSS 选择字符串。当你提供像 "#root"这样的字符串时，GrapesJS要么忽略它，要么无法正确解析到图层管理器拖拽机制可以绑定的组件实例。因此，图层管理器默认使用主包装组件（实际上是画布的 body）...
#65872025年8月13日作者 Sebbones1 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 开发者 142.0b9，Chrome 138.0.7204.184 可复制演示链接 https://jsfiddle.net/artur_arseniev/ta19s6go/ 描述一下那个虫子 如何复现这个漏洞？ 将“文章”部分设为符号 在原始“文章”组件中添加文本组件 直接尝试编辑文本或将光标设在文本内部 预期的行为是什么？ 光标并不总是重置到位置0，文本组件也没有闪烁，表现得像普通文本组件。 目前的行为是什么？ 光标重置到位置0，几乎无法选择文本 执行恒定编辑器“component：add”事件 在“离开”文本组件并重新选...
GJS Helper
你描述的问题，即在原始符号实例中添加文本组件会导致光标重置、闪烁和持续 component:add 事件，这是 GrapesJS符号更新机制与富文本编辑器（RTE）之间已知的交互冲突。 根本原因 当组件被指定为 GrapesJS中的符号时，会跟踪其结构和属性。对原始符号组件所做的任何更改旨在更新符号定义并传播到其所有实例。问题源自以下事件序列： 动态组件添加： 你在原符号组件被制成符号后，将新文本组件作为子组件添加。 符号更新触发器： 这种结构性变化（添加新子节点）触发 G...
#65702025年7月20日作者 nanto1 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrom v140.0.7307.0 （金丝雀） 可复制演示链接 https://jsfiddle.net/y3gr69s4/ 描述一下那个虫子 如何复现这个漏洞？ 创建编辑器实例，使用 'parser.optionsHtml.keepEmptyTextNodes' 选项集 'true'。 “''js const editor = Grapesjs.init（{ 解析器：{ optionsHtml： { keepEmptyTextNodes： true， }, }, }); 获取HTML代码。 “''js const result = ed...
GJS Helper
你准确地发现了GrapesJS中keepEmptyTextNodes选项处理方式的差异，导致HTML输出中被剔除换行。这确实是与解析器配置及其TypeScript定义相关的bug。 根本原因 GrapesJS HTML 解析器（特别是 ParserHtml 模块）设计为直接从顶层 parser 配置对象读取 keepEmptyTextNodes 选项，而非从 parser.optionsHtml中读取。 当你初始化GrapesJS时，你提供的parser对象作为配置传递给内...