GrapesJS Issues

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

466 issues found

πŸ” components
#4965Mar 8, 2023by RohitLad1 answer
0 reactions

PropertyComposite with slider for four sides (L,R,T,B). Change in one slider causes other values to reset.

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Safari Reproducible demo link https://codesandbox.io/s/funny-williamson-thb52d?file=/index.js Describe the bug How to reproduce the bug?Go to https://codesandbox.io/s/funny-williamson-thb52d?file=/index.js What is the expe...

GJSBlock

Thanks for reporting this, @RohitLad. Great question about PropertyComposite with slider for four sides (L,R,T,B). Change in one slider causes other values to reset.. The recommended approach with StyleManager is to use the event-driven AP...

#4947Feb 27, 2023by FaisalShaikhHA4 answers
2 reactions

Undo manager not working properly on undoing a remove action

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome - version 110.0.5481.100 (Official Build) (arm64)Reproducible demo link https://codepen.io/faisal-praella/pen/ExeNwxJDescribe the bugI have added a custom columns component with a number trait name columns used for ad...

artf

Yeah undo triggers the change:columns, in your case you could try to wrap your updateColumns changes in editor.UndoManager.skip.

artf

Ok I'm closing this one then and please open a new bug issue related to checkbox traits.

FaisalShaikhHA

Thank you @artf it works, to fix this I was toggling the trait change listener by listening to undo command before & run events but this feels cleaner. The checkbox trait not getting checked or unchecked on undo/redo (trait value is update...

#4919Feb 8, 2023by maliuta-oleksandr2 answers
0 reactions

Calling destroy method breaks the editor ( React app )

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 109.0.5414.119 Reproducible demo link Describe the bug How to reproduce the bug?add event listener to outside clickcall destroy method What is the expected behavior?Destroying without errors What is the current beha...

artf

Are you able to provide a reproducible demo as I'm not able to reproduce it on my end?

GJSBlock

Thanks for reporting this, @maliuta-oleksandr. Great question about calling destroy method breaks the editor ( React app ). The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentati...

#4906Feb 6, 2023by panditlakshya2 answers
0 reactions

Grapesjs fails to recognize component types when setting innerHTML through script.

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome v108.0.5359.98 Reproducible demo link https://codesandbox.io/s/grapes-js-template-literal-forked-6kgvrb?file=/src/App.js Describe the bug I'm trying to create a custom component that recognizes inner html component...

artf

Read carefully this guide, everything inside script is outside of the editor scope. You can update the component itself by using component.components method or specify the components: '<div ....' directly in definition.

GJSBlock

Thanks for reporting this, @panditlakshya. Great question about Grapesjs fails to recognize component types when setting innerHTML through script.. The recommended approach with Canvas is to use the event-driven API. Start here: Check the...

#4904Feb 5, 2023by handhikadj2 answers
0 reactions

GetHtml() producing invalid structure when there is js inside it

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? chrome latestReproducible demo link https://jsfiddle.net/snj87o6f/1/Describe the bug Context/Description I think this is a bug because I need to save and load the data back with editor.Parser.parseHtml on onStore of storageM...

artf

The output is correct (check the real console not the broken one from jsfiddle) and read carefully this section, you should never rely on HTML/CSS to load back the project.

GJSBlock

Thanks for reporting this, @handhikadj. Great suggestion about getHtml() producing invalid structure when there is js inside it! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Usi...

#4900Feb 5, 2023by handhikadj2 answers
0 reactions

SetStyle/getCss() produces duplicated css

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome LatestReproducible demo link https://codesandbox.io/s/silent-river-ifczcvDescribe the bug How to reproduce the bug?Visit the siteSee console. Pay attention to the * and body selector Expected result Should not be dupl...

artf

There are default styles applied that you can simply disable (pass an empty string) https://github.com/GrapesJS/grapesjs/blob/a83847b1b35e69e5a5810ccf1eb1e1384bf0aab1/src/editor/config/config.ts#L143-L147

GJSBlock

Thanks for reporting this, @handhikadj. Great question about setStyle/getCss() produces duplicated css. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specif...

#4897Feb 3, 2023by rudacs4 answers
1 reactions

Component:styleUpdate / component:styleUpdate:propertyName not fired

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Edge 109.0.1518.70 Reproducible demo link https://jsfiddle.net/rudacs/kr2x1mnh/ Describe the bug How to reproduce the bug?Change some property in StyleManager.Change the width property on the StyleManager. What is the expe...

artf

Hey @rudacs did you try instead using style:property:update?

rudacs

This event worked. Was it changed to this one? And for a single property? How do I get what was the component and property changed? Tranks.

SagarMaria

came here because I have the same issue. Using the suggested style:property:update seems to work, but for some reason it fires on every click. Also, how can we target a particular style property change, i.e. text-align?

#4868Jan 26, 2023by LukasSouza2 answers
1 reactions

Hovered boxes show misaligned after changing the position of the editor

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 109.0.5414.87 Reproducible demo link https://jsfiddle.net/o45ncveu/6/ Describe the bug How to reproduce the bug?open fiddle linkhover for some components before the time-outwait the time out to add a margin and chan...

artf

Unfortunately this is expected, you have to use editor.refresh() after "external" layout changes.

GJSBlock

Thanks for reporting this, @LukasSouza. Security and dependency issues are important. The GrapesJS team actively works on keeping dependencies up-to-date. For you right now: Run npm audit fix to see available patches Check for a newer Grap...

#4855Jan 19, 2023by ronaldohoch4 answers
1 reactions

Outline disappears after applying loadProjectData

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Brave last version Reproducible demo link https://grapesjs.com/demo Describe the bug How to reproduce the bug?Open the demo pageOpen the developer toolsRun: let projectData = editor.getProjectData()Run: editor.DomComponent...

allenhwkim

@ronaldohoch with Edge browser, it works with the command you provided. let projectData = editor.getProjectData(); editor.DomComponents.clear(); editor.loadProjectData(projectData); I don't think GrapesJS support Brave browser, which is no...

ronaldohoch

I also run the command editor.runCommand("core:component-outline") and it didn't shows again, i needed to click on the button twice to make it appear

ronaldohoch

Hi @allenhwkim, thanks for the comment. But embarrassing I didn't test it in other browsers. I believe my customers don't use Brave, so I'm going to drop that part. However, doing all these tests, I managed to make it work the way I want,...

#4854Jan 19, 2023by mnutt4 answers
1 reactions

Export 'default' not found in 'backbone' (module has no exports)

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 109 Reproducible demo link none Describe the bug How to reproduce the bug? What is the expected behavior? The development server starts. What is the current behavior? I'm using node v16.18.1 (MacOS) although had th...

mnutt

Yes, I'm able to reproduce it on grapesjs-style-filter too, same types of errors.

mnutt

I was able to circumvent this error by changing the build pipeline to output more modern javascript (via --targets="> 3%"), though that produces backbone errors due to the use of es6 classes.

artf

I'm not able to reproduce on my side with a fresh install, are you using the dev branch?

Browse all topics