#48612023年1月21日作者 edenizk3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 可复制演示链接 https://jsfiddle.net/8rm5wv2y/1/ 描述一下那个虫子 如何复现这个漏洞？在Firefox中打开示例页面（无修改）点击显示代码，你会看到没有插入“'<br/>'元素在“Hello World!!”后按空格，如果你愿意，可以添加任何文本再次点击“显示代码”，你会看到在添加新文本后，会添加“<br/>''元素 预期的行为是什么？ 如果用户没有按回车或 Shift+回车，而是在单行书写，我希望不会出现 '<br/>' 元素。就像镀铬那样。 目前的行为是什么？ 每当用户向现有文本添加文本时，Grap...
artf
不幸的是，这与 grapesjs 本身无关，而是 Firefox 如何处理可编辑文本。我想一个选择是切换到某个自定义的富文本编辑器，不依赖原生行为。
ClaudeCode
谢谢你举报，@edenizk。 关于在第一次进入Firefox空间后，添加单行文本的好问题<br/>。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'...
#48592023年1月20日作者 zoilorys2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome v108可复制演示链接 https://grapesjs.com/demo.html描述一下那个虫子 如何复现这个漏洞？设置 grapesjs 编辑器导入模板 https://pastebin.com/d9S2M0iS在模板的最底部，你会看到包裹的Facebook按钮选择它所在的表格单元格，尝试改变其宽度 预期的行为是什么？ 当元素的样式属性被编辑时，样式应仅更新所选元素。 目前的行为是什么？ 出于某种原因改变单元格宽度会编辑该模板中的通用类，该类也会应用到其他元素上，导致意外行为（见视频）。我无法在演示设置中复现这些，也无法向公众提供我们...
artf
你只需要启用这个选项： https://grapesjs.com/docs/modules/Selectors.html#component-first-selectors
ClaudeCode
谢谢你举报，@zoilorys。 关于编辑CSS属性设置样式为公共类而非元素的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'someth...
#48552023年1月19日作者 ronaldohoch4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 勇敢的最后版本 可复制演示链接 https://grapesjs.com/demo 描述一下那个虫子 如何复现这个漏洞？打开演示页面打开开发者工具运行： 'let projectData = editor.getProjectData（）'跑：'编辑。DomComponents.clear（）'运行：editor.loadProjectData（projectData）; 预期的行为是什么？ 组件轮廓应被展示。 目前的行为是什么？ 应用项目后，组件的轮廓没有显示。行为准则 [X] 我同意遵守本项目的行为准则
allenhwkim
@ronaldohoch用Edge浏览器，它用的是你提供的命令。 'let projectData = editor.getProjectData（）;' “编辑。DomComponents.clear（）;' 'editor.loadProjectData（projectData）;' 我觉得GrapesJS不支持Brave浏览器，而Brave浏览器在 https://github.com/browserslist/caniuse-lite 里没有列出。 <img wid...
ronaldohoch
我还运行了命令 'editor.runCommand（“core：component-outline”）'，但又没显示，我需要点击按钮两次才能显示
ronaldohoch
你好，@allenhwkim，谢谢你的评论。但尴尬的是我没在其他浏览器里测试。 我相信我的客户不使用Brave，所以我打算放弃这部分。 不过，通过所有这些测试，我成功地让它按我想要的方式工作，应用了以下代码： “''js editor.loadProjectData（JSON.parse（sessionStorage.getItem（commandOpts.value）））; if（editor.Commands.isActive（“sw-visibility”）{ 编辑。...
#48542023年1月19日作者 mnutt4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 109 可复制演示链接 没有 描述一下那个虫子 如何复现这个漏洞？ 预期的行为是什么？ 开发服务器启动。 目前的行为是什么？ 我用的是node v16.18.1（MacOS），虽然在节点14和节点18上也出现了同样的结果。是不是我做错了什么明显的错误？ 行为准则 [X] 我同意遵守本项目的行为准则
mnutt
是的，我也能用“grapesjs-style-filter”重现，同样的错误类型。
mnutt
我通过修改构建流程，通过“--targets=”“> 3%”'来绕过了这个错误，但由于使用es6类，这会导致骨干错误。
artf
我这边用全新安装无法复现，你用的是开发分支吗？
#48512023年1月17日作者 chaegumi3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 108.0.5359.125可复制演示链接 https://codesandbox.io/s/frosty-darkness-7po7xl描述一下那个虫子 如何复现这个漏洞？使用 myBlock点击测试按钮 预期的行为是什么？ this.on（“change：list1”， this.handleList1Change）; 每次都要工作 目前的行为是什么？ this.on（“change：list1”， this.handleList1Change）; 只跑一次 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： “''js 从“grap...
artf
监听者看不到深度变化，所以这种情况下你得重新创建一个数组 “''js component.set（this.traitName， [...this.items]）; ```
chaegumi
谢谢@artf。 我用 JSON.stringify 和 JSON.parse 来处理数据。
ClaudeCode
谢谢你举报，@chaegumi。 关于this.on（'change：attributes：type'， this.handleTypeChange）不支持数组类型的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'cha...
#48482023年1月16日作者 NicoGGG2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox v91.4.1 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？访问 grapesjs 基础演示：https://grapesjs.com/demo.html清理画布添加组件链接在浏览器控制台中执行 'editor.getComponents（）.models[0].attributes.content'。输出是“Link”，即链路组件的内容通过内联编辑来更改链接文本再次在浏览器控制台执行“editor.getComponents（）.models[0].attribu...
artf
这是与富文本编辑器相关的一些逻辑所预期的。 你可以用 'component.getInnerHTML（）' 获取内部 HTML，或者用 'component.components（）' 获取内部组件。
ClaudeCode
谢谢你举报，@NicoGGG。 关于组件内容在内联编辑后设置为空字符串，这个问题很棒。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something ch...
#48472023年1月15日作者 wunksert3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 版本 109.0.5414.87描述一下那个虫子 如何复现这个漏洞？在 GrapesJS 画布上创建@keyframes动画在 JS 中，通过将以下字符串传递到编辑器中创建一个新的 CssRule。Css.addRules：将其添加到画布中：“编辑器。Css.addRules（updatedRule）' 预期的行为是什么？ DOM应该更新 目前的行为是什么？ DOM没有更新。但是，如果我调用“editor.getCss（）”，我能看到不透明度的正确值返回了。 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： 行为准则[X] 我同意遵守本...
artf
似乎与 CssGroupRuleView [这里]（https://github.com/artf/grapesjs/blob/e6a086afac77d8da73f225dd0aa84b3d178ec47b/src/css_composer/view/CssRulesView.ts#L64-L80）有关。对于像“@keyframes”这样的at规则，我们必须强制重新渲染父容器。
wunksert
@artf又遇到了“editor.”这个问题。CssComposer.remove（myCssRule）' 编辑器CSS会移除规则，但规则不会被冲入DOM。你建议我如何在保持编辑器状态不变的情况下强制重新渲染 DOM？“editor.refresh” 并没有把样式冲入 DOM
ClaudeCode
谢谢你举报，@wunksert。 关于CSS编辑不会持久保存到DOM的问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
#48412023年1月14日作者 chaegumi1 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 108.0.5359.125 可复制演示链接 https://codesandbox.io/s/sweet-hugle-w00pqx 描述一下那个虫子 如何复现这个漏洞？拖我的街区查看代码 预期的行为是什么？ 不想要特征2=“特征2” 目前的行为是什么？ 具有特征2=“特征2” 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： ![图片]（https://user-images.githubusercontent.com/9654650/212448739-0f23d7b1-f8bf-49d2-a420-be02a1328ecb.p...
ClaudeCode
谢谢你举报，@chaegumi。 关于不要用component.addAttributes（{[traitName]：value}），你有时应该用component.set（traitName，value），这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式...
#48372023年1月10日作者 quentin-bettoum4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 109 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 你好， 我注意到当我在 projectData 中加载多个 HTML 中使用相同“id”的页面时，葡萄会自动在每个页面上增加“id”，尽管这些是不同的页面。 为了演示这个问题，下面有一段代码，我用包含两个页面的“projectData”初始化 grapesjs，这两个页面在某些 HTML 标签上使用相同的 ID。 在最终的HTML列表中，你可以看到像“body”和“main-title”这样的id在第二页被递增为“body-2”和“...
artf
嘿，@bgrand-ch，我认为有一天所有Grapesjs实体都会有一个全局“UID”，所以从长远来看，我预计这个问题会被修复 🤞
quentin-bettoum
起初，我想把所有页面一起生成，这样所有页面都能输出一个统一的CSS输出。但现在我尝试另一种风格方案。 所以对于“id”问题，分别生成每个页面可能是解决方案。谢谢你的建议。
bgrand-ch
Grapes 使用一些数据属性（类似“data-grapes-id”）作为唯一标识符，以便让 id 留给某些前端脚本使用。 我喜欢这个想法 💯
#48172023年1月2日作者 sdimitrenco2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 版本 108.0.5359.125，Mozilla 107.0可复制演示链接 https://jsfiddle.net/stanislavdimitrenko/d61cm4yg/14/描述一下那个虫子 所以，葡萄的奇怪行为就是这样。 如果你有那个结构体 “没有包装的文本”——你不能编辑那段文字。葡萄做不到，可编辑不了...... 如果改变了这一点，那你就可以。 或者，如果你给文本加装，同样可以编辑。 也许需要设点设定葡萄或脚本工作限制？行为准则[X] 我同意遵守本项目的行为准则
artf
是的，目前这是解析文本节点没有适当封装和文本组件作为兄弟节点的预期行为。所以为了让这些节点可编辑，你必须正确地用类似标签的范围包裹它们。
ClaudeCode
谢谢你举报，@sdimitrenco。 如果 div 在 page p > span 内有标签，无法在 div 内编辑文本节点的问题，似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：** 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重...