GrapesJS Issues

3,464 parsed GitHub issues โ€” 370 solved ยท 90 open. Search, filter and explore battle-tested answers.

569 issues found

๐Ÿ” canvas
#6357December 13, 2024by Harshsne261 answer
0 reactions

!important is added to every component styles

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://codepen.io/Harshsne/pen/YPKwRBg Describe the bug How to reproduce the bug?Add row component from blockmanager.change its width in stylemanager .(!important is added because its default...

ClaudeCode

Thanks for reporting this, @Harshsne26. Great question about !important is added to every component styles. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your sp...

#6354December 13, 2024by RakulAgn2 answers
0 reactions

Uncaught TypeError: Cannot set properties of null (setting '_isEditor')

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://grapesjs.com/demo Describe the bug How to reproduce the bug?Just Visit the Demo Site of Grapesjs the canvas not been rendered What is the expected behavior? The Canvas Should be Render...

artf

Closing this as the demo seems to run fine, maybe something related to your browser cache/extensions

ClaudeCode

Thanks for reporting this, @RakulAgn. Great question about Uncaught TypeError: Cannot set properties of null (setting '_isEditor'). The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documen...

#6348December 7, 2024by Frubl2 answers
1 reactions

It's possible to drag and drop literally anything inside grapesjs canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Try select for example whole sidebar tools/text/everythingGrab and drop it on canvas What is the expected behavior? Pro...

artf

You can take control over what is dropped inside the canvas via canvas:dragdata event https://jsfiddle.net/artur_arseniev/87rcb24n/

ClaudeCode

Thanks for reporting this, @Frubl. Great question about It's possible to drag and drop literally anything inside grapesjs canvas. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documenta...

#6332November 26, 2024by tim-prom1 answer
0 reactions

img srcset 404 causes infinite request loop

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v131Reproducible demo link https://jsfiddle.net/cmq9end2/1/Describe the bug How to reproduce the bug?Add an img to the canvas with an invalid URL in the srcset Check the network tab in Chrome dev console - the asset r...

ClaudeCode

Thanks for reporting this, @tim-prom. Great question about img srcset 404 causes infinite request loop. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific mod...

#6324November 22, 2024by badiuciprian4 answers
2 reactions

sorter.setDragHelper is not a function on block drag

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? 131.0.6778.86Reproducible demo link https://jsfiddle.net/badiuciprian/qe28obhr/1/Describe the bug How to reproduce the bug?try dragging any block to the canvas What is the expected behavior? The component is rendered to the...

mohamedsalem401

I managed to reproduce it. It's only happening on nativeDnD: false. Probably this makes the block view use the API of the old sorter. I will try to push a fix for this.

artf

@mohamedsalem401 can you check this one, please?

badiuciprian

Thanks for taking care of this. I will watch for the update.

#6296November 5, 2024by maneeshp972 answers
0 reactions

Custom react components gets wrapped inside a div

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Arc v1.61.1 Reproducible demo link https://codesandbox.io/s/grapesjs-react-components-n6sff Describe the bug @artf First of all thank you for this amazing library. I was trying to create custom react components within grap...

artf

Yeah, that's expected from the demo perspective. You can play around with the code and find your solution but I'm closing this as it's not a core bug.

ClaudeCode

Thanks for reporting this, @maneeshp97. The issue with Custom react components gets wrapped inside a div appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modi...

#6269October 25, 2024by bt-mkt4 answers
3 reactions

Component model and view inits every time it's dragged over every component present in Canvas on which it can be dropped into

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 130.0.6723.59 (Official Build) (arm64) Reproducible demo link https://codepen.io/btmkt/pen/QWeOJRB?editors=1111 Describe the bug How to reproduce the bug?Open console.Drop multiple components inside the canv...

artf

@mohamedsalem401 this is probably happening due to the shallow editor. I think it would make sense to leverage the temporary option (which we already use to skip some actions) in canMove. wdyt?

mohamedsalem401

@artf Yes, I suspect it has to do with the shallow editor. Hopefully the temporary option will work and then I'll open a PR

bt-mkt

@mohamedsalem401 this is probably happening due to the shallow editor. I think it would make sense to leverage the temporary option (which we already use to skip some actions) in canMove. wdyt? Hello @artf, The change above, which I saw wa...

#6248October 22, 2024by Frubl2 answers
1 reactions

showOffsets bug when iframe body has zoom

GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfiddle.net/a2hbxg0y/1/ Describe the bug How to reproduce the bug?Open dev tools and write element style for iframe body - zoom: n; What is the current behavior? When hovering over an...

artf

You shouldn't edit the zoom of the iframe, use the native API

ClaudeCode

Thanks for reporting this, @Frubl. Great question about showOffsets bug when iframe body has zoom. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific mo...

#6202October 9, 2024by klipto-inc2 answers
0 reactions

Javascript CDN not working on grapejs canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? 129 Reproducible demo link https://grapesjs.com/demo Describe the bug const newEditor = grapesjs.init({ fromElement: true, // Allow components from HTML container: "#editor", canvas: { scripts: [ "https://cdn.jsdelivr.net/...

artf

@klipto-inc please create the bug report with a proper reproducible live demo

ClaudeCode

Thanks for reporting this, @klipto-inc. The issue with Javascript CDN not working on grapejs canvas appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modificat...

#6143September 10, 2024by rhoenerSBS2 answers
0 reactions

BUG/[QUESTION]: How to correctly wrap a Component on add/mount?

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v128 Reproducible demo link https://jsfiddle.net/fjyk6n4a/2/ Describe the bug Hi @artf, I am currently trying to wrap a component in a section component if its has not been wrapped yet. I am hooking into the compone...

jasonvijayy

Hi @artf, Reproducible Link Iโ€™m also hitting a crash when using component.replaceWith() together with UndoManager. This only happens when replaceWith() is triggered during editor lifecycle events (e.g. change:status, component:selected, co...

ClaudeCode

Thanks for reporting this, @rhoenerSBS. Great question about BUG/[QUESTION]: How to correctly wrap a Component on add/mount?. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation...