GrapesJS Issues

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

569 issues found

🔍 canvas
#5820April 17, 2024by rhoenerSBS2 answers
0 reactions

Double Entry in Layers if Component is moved directly after add

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v123Reproducible demo link https://jsfiddle.net/xwgons8z/Describe the bug I'm trying to programmatically move an added component to a specific position in the parent since I have child components, that are supposed to...

rhoenerSBS

I initially wanted to realize the same behavior with a function in the droppable property of the parent component to prevent components being dropped at a specific index but unfortunately the index is not given as a param for that function.

ClaudeCode

Thanks for reporting this, @rhoenerSBS. Great question about Double Entry in Layers if Component is moved directly after add. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation...

#5810April 14, 2024by ctrhub4 answers
1 reactions

Unnecessary Canvas style

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Arc Version 1.35.0 / Chromium Engine 123.0Reproducible demo link https://grapesjs.com/demo.htmlDescribe the bug My special case: In my case, all styles from plugins and general styles are located in the header. So, to achiev...

artf

it is intended to store canvas styles, styles that do not affect the result of hmtl/css, styles that will not be exported, right? Correctby default the body has a white background, this seems to be the default color in all browsers, no? ye...

artf

There is canvasCss option for that. Next time open a Discussion please, as this is not a core bug but wrong usage.

ctrhub

Hey @artf. Thanks for the answer. I'm not sure that we understood each other and I would like to clarify one detail. Yes, I know about the canvasCss property, moreover, I use it to change the styles of the selected component. I understand...

#5746March 12, 2024by rhoenerSBS4 answers
1 reactions

ColorPicker Offset incorrect when Panels are outside of Editor Container

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v122 Reproducible demo link https://grapesjs.com/docs/getting-started.html#style-manager Describe the bug How to reproduce the bug?Go to the "StyleManager" section of the "Getting Started" doc from GrapeJSTry to use...

bernesto

Hi @artf, The root issue is that we are trying to place a popover palette absolutely positioned over another element at an arbitrary location on the page. And we need to do this even when the origin element is outside of the editor contain...

artf

@bernesto can you check this one as it seems to be related to your changes

bernesto

Yes, I see the issue. The logic needs to account for when the parent is outside of the container. Let me see what I can do there.

#5705February 26, 2024by bernesto4 answers
0 reactions

Component tools misalign when the editor is resized

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v122 Reproducible demo link https://jsfiddle.net/Lk2bwhp4/ Describe the bug How to reproduce the bug?Place the editor inside of a container, then programmatically resize the container's width. What is the expected b...

artf

Thanks @bernesto for the report but as we can't detect programmatic layout changes without impacting the performances, in this case, you have to update the editor layout manually via editor.refresh() (eg. in your example you would put the...

bernesto

Hi @artf, I actually had this accidentally mixed in the last pull request you accepted (src/canvas/model/Frame.ts). You might want to take a look at what I added and see if it is causing an issue. We have it in testing right now and haven'...

artf

I actually had this accidentally mixed in the last pull request you accepted and I actually removed it cause it seemed to be unrelated 🤣 Not a problem to add it back but consider that your example will work only because of the desktop Dev...

#5700February 24, 2024by upadhyay88442 answers
0 reactions

=

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? chromeReproducible demo link Cannot provide it data is sensitiveDescribe the bug How to reproduce the bug?Drop a page in the editor/Canvas.Set height for ex- 600pt and also give padding of 10 pt to all 4 sides.Now drop two s...

upadhyay8844

@artf can you please have a look at it ?

ClaudeCode

Thanks for reporting this, @upadhyay8844. Great question about =. 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() event listener m...

#5691February 21, 2024by codei202 answers
0 reactions

Undo not working while seleting background or text color through color picker

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 122.0.1 Reproducible demo link https://grapesjs.com/demo-mjml.html Describe the bug How to reproduce the bug? In the official demo: https://grapesjs.com/demo-mjml.htmlAdd a column to the canvasSelect the section Go...

artf

Probably related to the mjml plugin, not the core as I can't reproduce it (I'd suggest opening an issue to the related repo).

ClaudeCode

Thanks for reporting this, @codei20. Great question about Undo not working while seleting background or text color through color picker. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS do...

#5674February 9, 2024by mauriciolcs22 answers
0 reactions

The infinite canvas is increasing its height infinitely when there is an element with a min-height of 100vh

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Arc version 1.29.0 (46113)Reproducible demo link https://grapesjs-react-custom-ui-vrkhwc.stackblitz.ioDescribe the bug How to reproduce the bug?Enable inifinite canvasAdd at least two components to the canvasSet a min-height...

artf

Avoid using infinite canvas as it was never documented and not even finished as a feature.

ClaudeCode

Thanks for reporting this, @mauriciolcs2. Great question about The infinite canvas is increasing its height infinitely when there is an element with a min-height of 100vh. The recommended approach with Canvas is to use the event-driven API...

#5641January 24, 2024by yashvi20262 answers
0 reactions

Undomanager.remove() not working

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v91Reproducible demo link https://codepen.io/Harshsne/pen/WNgZzPEDescribe the bug How to reproduce the bug?Append an image to the canvas and close the image modal.(so that component will be removed from tracking as i...

artf

The problem here is not Undomanager.remove but what is tracked. When you're resizing the image, you're not editing the Component itself but its CssRule object so that's why it's not working as expected. I'd probably suggest to simply skip...

ClaudeCode

Thanks for reporting this, @yashvi2026. Great question about Undomanager.remove() not working. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look...

#5633January 20, 2024by kla-ko3 answers
0 reactions

Cannot select component in ``component:remove`` handler

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 120.0.6099.225 Reproducible demo link https://jsfiddle.net/wattnu/opmwfvjn/ Describe the bug How to reproduce the bug?open and run the fiddletwo components are on the canvas. The "hello world" div and a blue...

artf

Thanks @kla-ko there is actually one logic that prevents selecting other components during component:remove events and I will fix it for the next release but what I'd suggest to you is to switch to another event. The event component:remove...

kla-ko

Thanks @artf . This works like a charme ! /

ClaudeCode

Thanks for reporting this, @kla-ko. Great question about Cannot select component in `component:remove handler. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your speci...

#5630January 18, 2024by kla-ko2 answers
0 reactions

configuring an onStart() resize callback prevents resizing

GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 120.0.6099.225 Reproducible demo link https://jsfiddle.net/wattnu/y8L6whun/ Describe the bug How to reproduce the bug?Goto jsfiddlerun the codeon the canvas, select the blue div componenttry to drag the resi...

artf

Good catch, will fix it

ClaudeCode

Thanks for reporting this, @kla-ko. Great question about configuring an onStart() resize callback prevents resizing. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for...