GrapesJS Issues

3,464 parsed GitHub issues β€” 370 solved Β· 90 open. Search, filter and explore battle-tested answers.

569 issues found

πŸ” canvas
#5618January 15, 2024by Ashwinvalento3 answers
0 reactions

Old Component script is not deleted on Import. Resulting in duplicate scripts

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Edge v120.0.2210.121 Reproducible demo link https://codepen.io/ashwinvalento/pen/jOJMPqx Describe the bug If we have set config.parser.optionsHtml.allowScripts: true and create a component with a script, Then when we impor...

artf

Reimporting directly JS as a component was never possible, so it's treated as a new one.

Ashwinvalento

Is there any way we can identify scripts of existing components and delete them on import? we wont be able to remove all the script tags since we would need to retain the scripts added manually.

ClaudeCode

Thanks for reporting this, @Ashwinvalento. Great suggestion about Old Component script is not deleted on Import. Resulting in duplicate scripts! While this specific feature isn't yet in the core API, there are several ways to achieve simil...

#5607January 10, 2024by Ju99ernaut2 answers
0 reactions

Cannot expand previously empty layers

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v120.0.6099.199 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Drag the column 1 block onto the canvasDrag any other block into the cell for example textSelect the ce...

artf

Good catch, I'll fix it

ClaudeCode

Thanks for reporting this, @Ju99ernaut. Great question about Cannot expand previously empty layers. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module...

#5593January 3, 2024by thigh4 answers
0 reactions

Layer manager not refreshing on page change

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? MS Edge 120.0.2210.91 Reproducible demo link none available Describe the bug How to reproduce the bug?update to latest grapesjs versionset up a multi-page projectnote the current layer manager hierarchyinvoke the pagemanag...

artf

Thanks for the report @thigh will fix it

sunnynk19

Hi @thigh, Looks like still not working. Have you deployed the latest npm package?

artf

Not yet published, you can find here all the releases https://github.com/GrapesJS/grapesjs/releases

#5584December 27, 2023by vian0132 answers
0 reactions

"storage:end:load" event is not triggered when all components are mounted into the canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v91 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug? Recently I have to upgrade grapesjs v0.14.62 to the latest version (0.21.8). In the old code, we used "storage:end...

artf

@vian013 please open bug issues only with a reproducible demo link, by a quick check the event seems to work properly

ClaudeCode

Thanks for reporting this, @vian013. Great question about "storage:end:load" event is not triggered when all components are mounted into the canvas. The recommended approach with Canvas is to use the event-driven API. Start here: Check the...

#5563December 18, 2023by leo-budgetsimple1 answer
0 reactions

The attributes of the script tags are being removed on the canvas.?

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? latest version of ChromeReproducible demo link https://grapesjs.com/demo.htmlDescribe the bug How to reproduce the bug? Taking an html string and rendering it in grapesjs with this code (I have allowScripts enabled) This is...

ClaudeCode

Thanks for reporting this, @leo-budgetsimple. Great suggestion about The attributes of the script tags are being removed on the canvas.?! While this specific feature isn't yet in the core API, there are several ways to achieve similar beha...

#5545December 5, 2023by AFriboulet-ii1 answer
0 reactions

Drag component type text trigger "rte:disable"

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 119.0.6045.200 Reproducible demo link https://jsfiddle.net/d64pkcom/1/ Describe the bug How to reproduce the bug?Drag component text in CanvasWatch the console of jsfiddle What is the expected behavior? Don't trigg...

ClaudeCode

Thanks for reporting this, @AFriboulet-ii. Great question about Drag component type text trigger "rte:disable". The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for your...

#5542December 4, 2023by brenoassp2 answers
2 reactions

Error autoplay youtube

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 119.0.6045.200 64 bits Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Drag and drop a video block into the canvasClick on the video and select YouTube as the Provider...

artf

Looks like the muted property was correct for Vimeo but not for Youtube. I'll push the fix, thanks.

ClaudeCode

Thanks for reporting this, @brenoassp. Great question about Error autoplay youtube. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on(...

#5450October 10, 2023by ChiragS-Prajapati2 answers
0 reactions

Section should be overlapping issue present in grapes js

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 117.0.5938.134 (Official Build) (64-bit) Reproducible demo link https://jsfiddle.net/ap404703/0e5zop1n/ Describe the bug Example as below Grapes Js file :- // Initialize GrapesJS const editor = grapesjs.init({ canv...

artf

@ChiragS-Prajapati you have to use draggable/droppable component properties to control where components could be dragged and what components can be dropped inside.

ClaudeCode

Thanks for reporting this, @ChiragS-Prajapati. The issue with Section should be overlapping issue present in grapes js appears to be a race condition or state management timing problem. This typically happens when component lifecycle event...

#5441October 3, 2023by padcom2 answers
0 reactions

No id for elements not having styles but with `script`, which results in script not running for those elements

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome latestReproducible demo link https://github.com/padcom/grapesjs-no-id-for-element-exampleDescribe the bug When creating custom GrapesJS components, if those components have the script() (runtime behavior for component...

artf

The issue is caused by the use of jsInHtml: false and how the internal JS generator is handled. I'll try to fix it for the next release.

ClaudeCode

Thanks for reporting this, @padcom. The issue with No id for elements not having styles but with script, which results in script not running for those elements appears to be a race condition or state management timing problem. This typical...

#5379September 12, 2023by Sw33tgt4 answers
4 reactions

Class modifications of components are not automatically detected

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome Version 116Reproducible demo link https://jsfiddle.net/h5b0ndvL/1/Describe the bug When a component is re-rendered in the canvas, a new attribute added to the model definition get rendered, but a newly added class doe...

Sw33tgt

For the moment, as a workaround, I added this in a editor.on('component:mount', (component) => {}); function until any feedback is received. It seems to be working well. In a case where a class is removed from the definition, the removed c...

Sw33tgt

Yeah, this is intentional with classes, with your approach you won't be able to remove defined classes from the component, they will keep being added on component init. Which is fine for when a class has been forgotten on a component and w...

Sw33tgt

Something like this in the initClasses() function of Component.ts would add the new classes to the element on render. Let me know what you think :