#65912025年8月20日作者 CES-TechAdmin2 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Mac 版 Safari 18.5 可复制演示链接 https://codepen.io/jmulik/pen/LEpdjZq 描述一下那个虫子 如何复现这个漏洞？ 在Chrome中查看 https://codepen.io/jmulik/pen/LEpdjZq - 支持拖放方块。 在Safari中查看。- 无法放置和放下方块。 预期的行为是什么？ 变装和变装在Safari里应该能行。就像Chrome一样。 目前的行为是什么？ 在Safari中，方块的拖放功能不起作用。 观察 Safari 中的拖拽功能在 GrapesJS v0.21.13...
them7d
是的，它不能用，因为代码和Safari浏览器不完全兼容 要解决这个问题，你需要在NextJS中使用 grapes ，比如这个页面 https://grapesjs.com/demo.html
GJS Helper
你遇到的拖放功能自 v0.22.1 以来在 Safari 中无法正常工作GrapesJS是与框架存储管理变更相关的已知行为。 根本原因 GrapesJS v0.22.0 对其storageManager进行了重大更新，indexedDB成为默认存储驱动，以提升性能和容量。虽然 indexedDB 整体上很稳健，但 Safari，尤其是在某些情境下，比如 iframes（如你的 Codepen 演示所示）或启用了“防止跨站追踪”等隐私设置时，可能会有更严格的政策或针对inde...
#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...
#65832025年8月5日作者 msftedad2 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Edge 版本 135.0.2535.51（官方构建）（64 位），Chrome 版本 135.0.6422.112（官方构建）（64 位） 可复制演示链接 https://grapesjs.com/demo 描述一下那个虫子 测试环境： 操作系统：Windows 11[版本24H2（操作系统构建版24631.3593）] Edge：版本 135.0.2535.51（官方版本）（64 位） Chrome：版本 135.0.6422.112（官方构建）（64位） 屏幕阅读器：NVDA（2024.4.2） 测试网址：https://grapesj...
artf
嘿，@msftedad网站仓库在[这里]（https://github.com/GrapesJS/website），欢迎提交修复后的永久注册（[file]（https://github.com/GrapesJS/website/blob/main/src/app/（demos）/GrapesEditor.tsx））。我决定关闭这个问题，因为它和核心无关。
GJS Helper
这是一份有效且重要的无障碍漏洞报告，适用于GrapesJS演示页面。问题源于GrapesJS标志的<img>标签中alt属性为空，错误地向屏幕阅读器传达该图像纯属装饰性。对于同时作为首页链接的标志来说，这是一个有意义的元素，需要描述性替代文本。 根本原因 虽然alt属性存在于演示页面GrapesJS标志的HTML中，但它被设置为空字符串（alt=""）。根据网页内容无障碍指南（WCAG），空alt属性应仅用于纯装饰性且不传递信息的图片。在这种情况下，GrapesJS标志是一...
#65822025年8月5日作者 msftedad2 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Edge：版本 135.0.2535.51（官方构建）（64 位），Chrome 版本：版本 135.0.6422.112（官方构建）（64 位） 可复制演示链接 https://app.grapesjs.com/studio?utmsource=grapesjs&utmmedium=mainTopNav 描述一下那个虫子 测试环境： 操作系统：Windows 11[版本24H2（操作系统构建版24631.3593）] Edge：版本 135.0.2535.51（官方版本）（64 位） Chrome：版本 135.0.6422.112（官方构...
GJS Helper
你提到的问题凸显了大量依赖拖拽交互的网页构建者常见的无障碍挑战。 GrapesJS默认主要通过鼠标/触摸拖放手势实现块和组件操作，这些操作本身无法通过键盘导航或单指针模式访问，而某些无障碍标准（如 WCAG 2.1 成功标准 2.5.1 指针手势，暗示了路径手势的替代方案）。你看到的“拖放控制”是为鼠标操作设计的，而非键盘激活。 根本原因 GrapesJS 块管理器和添加新组件的画布交互基于指针设备（鼠标、触摸）的直接操作范式构建。没有内置机制仅通过键盘输入从块面板启动“拖...
#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对象作为配置传递给内...
#65622025年7月9日作者 jsxOverdose3 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 138.0.7204.101 可复制演示链接 https://jsfiddle.net/u3L89ejh/1/ 描述一下那个虫子 如何复现这个漏洞？ 调整图像大小 把它拖到画布上的别处 点击其中一个小蓝色缩小方块 观看图像跳跃到不同位置 预期的行为是什么？ 应该留在我放的地方 如果顶部/左/右/底部的值没有单位，则将值当作“px”来处理，而不是“%”。 目前的行为是什么？ 当你移动图像时，上下两侧的像素值表现良好。 但你一碰到缩放按钮，它就会切换到“%”，然后突然跳到画布上全新的位置。 行为准则 [x] 我同意遵守本项目的行为准则
artf
@jsxOverdose推送了这次新版本的修复：https://github.com/GrapesJS/grapesjs/releases/tag/v0.22.11
jsxOverdose
@artf 在新版本中，还有另一个bug：当你点击Y轴上的缩放手柄时，图片会明显变大。这是试玩版：https://jsfiddle.net/du81zL6r/
GJS Helper
你遇到的元素在移动后跳到错误位置并与调整器交互的问题，是GrapesJS处理CSS top和left属性时的已知行为，尤其是在应用position: absolute且单位未明确定义时。 根本原因 当画布上移动带有position: absolute的元素时，GrapesJS正确地使用px单位应用top和left样式。然而，top和left属性的默认StyleManager配置（在Position类别下）定义了可能units的列表（例如['px', '%', 'em', '...
#65582025年7月3日作者 arustagi1011 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 版本 138.0.7204.50（官方构建）（arm64） 可复制演示链接 https://jsfiddle.net/artur_arseniev/L24hkgm5/ 描述一下那个虫子 如何复现这个漏洞？ 添加图层管理器，并使用“grapesjs”：“0.22.8”或“0.22.9”的依赖关系。“0.22.7” 运行正常 预期的行为是什么？ 在图层部分设置组件不可见，反之亦然，也就是说，将不可见变成可见应该可以。 目前的行为是什么？ 在“0.22.8”和“0.22.9”版本中，“隐形”转“可见”在点击图层部分的组件时无法工作。 如果需要执行某...
GJS Helper
你已经准确识别出GrapesJS版本0.22.8和0.22.9中图层管理器的可见性切换从“隐形”切换到“可见”时没有正常工作。“可见”切换到“隐形”的切换功能正常，但恢复可见性失败了。 根本原因 这个问题是GrapesJS 0.22.8年引入的一个已知错误。它源于Component模型内部upVisible方法在切换visible属性时处理display CSS属性的方式发生了变化。具体来说，当组件被设置为不可见时，会应用display: none。然而，当尝试重新使其可见...
#65492025年6月25日作者 yashvi20264 个回答
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://codepen.io/Harshsne/pen/YPXdgmj 描述一下那个虫子 如何复现这个漏洞？ 上传图片 将其切换为移动视图 调整图像大小 ![图片]（https://github.com/user-attachments/assets/99f43e87-39bd-488c-8d64-e13ed698d49f） 预期的行为是什么？ 在样式管理器中手动更改宽度和高度时，图片会被调整大小。 目前的行为是什么？ 无法调整图片大小 原因是在Canvas中调整图像大小时不会添加重要，所以原始样式不会被覆盖。 行...
mosh-tudor
@yashvi2026 那是因为你用了自定义的CSS代码。 去除这一部分： “''js 样式：'.image{最大宽度：100%;@media（最大宽度：480px） {.image {display： inline-block;高度：自动 ！重要;宽度：100% ！重要;最大宽度：100%;}}, `` 来自“编辑部”。BlockManager.add（'image'， {'
artf
我确认组件调整现在没考虑“重要”，但我大致会按照@mosh-tudor的建议来做。 你不需要去掉所有“样式”，我猜你需要的就是这个，但我觉得没必要把“！important”放在上面。如果你需要“！important”，问题很可能出在图像组件之外。
yashvi2026
我需要在风格中使用'！important'。 我注意到在其他组件中，当默认样式中包含“！important”时，通过样式管理器添加的样式也会包含“！important”，以确保它们覆盖默认样式。 ![图片]（https://github.com/user-attachments/assets/0ce9b9ce-86da-41d5-9795-50221d792bce） 所以，当在样式管理器中手动更改样式时，会添加 ！important。 同样地，调整组件大小时，样式也应该加上...