GrapesJS Issues

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

466 issues found

πŸ” components
#3412Apr 25, 2021by maxtsh2 answers
2 reactions

Auto save is working partially and stops working after inserting text

hello guys. I am using this awesome project for a production app written with React.js, So I integrated it inside my app. everything works fine but I have a problem with auto saving the editor data on each change to editor. OS: Windows 10 Browser: Chrome 90 GrapesJS version: 0.17.03 latest on 26/04/2021 EDITOR INSTANC...

artf

Thanks @maxtsh for the report, there is actually an issue with those old blocks from the basic plugin which breaks the storage counter. I'll push the fix soon. For now, as a hotfix, update those blocks in this way.

GJSBlock

Thanks for reporting this, @maxtsh. The issue with Auto save is working partially and stops working after inserting text appears to be a race condition or state management timing problem. This typically happens when component lifecycle eve...

#3410Apr 22, 2021by sizhousama3 answers
0 reactions

Editor's strange behavior!

When I enter the editor and use setComponents or addComponents to add components in the store, the first class of the first element will be added to the class of a certain element inexplicably. Does anyone know the reason? I need help! ! !

sizhousama

@artf

artf

That class is coming from your app so there could be thousands of reasons, we can't help you just by looking at 2 screenshots. If you think there is a bug, open the issue correctly (by following the template) and create a reproducible demo.

GJSBlock

Thanks for reporting this, @sizhousama. Great question about Editor's strange behavior!. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look fo...

#3409Apr 21, 2021by ltenti-eventboost4 answers
3 reactions

Custom component property that is not a trait

I would like to create a custom component with a property that will be updated by specific code, but I don't want this property to be visible and updatable as a trait; let say my property is called "ebTesto", I wrote a plugin function like that: I expected to find my new property in the "gjs-components" part of the st...

ltenti-eventboost

Thank you both!

Ju99ernaut

I think it's not stored since the property hasn't been changed from the default. The editor should be able to recover the property from the component definition itself.

Ju99ernaut

Try adding it inside defaults

#3406Apr 20, 2021by vatte212 answers
0 reactions

How to create a custom storage manager, it doesnt set saved data from canvas, after reloading the page

Hello everyone, i want to save data from canvas to redux store, and it works, but after reloading the page, storage load method , doesnt set my data to builder (canvas), i dont know whats wrong, let me know if someone has any solutions. Code example :

artf

Remove this one const resultKey = key.slice(4);. You're storing data with the prefix but then you're loading it without

GJSBlock

Thanks for reporting this, @vatte21. Great question about How to create a custom storage manager, it doesnt set saved data from canvas, after reloading the page. The recommended approach with StyleManager is to use the event-driven API. St...

#3404Apr 18, 2021by Abhisheknanda13444634 answers
0 reactions

Style Manager Issue.

Hi @artf I want to hide and show style properties for specific component. After referencing this issue https://github.com/artf/grapesjs/issues/1428 I've write my code this way but it's giving me error -: Could you please help @artf ? after doing this It's not finding the "style sector" (Layout) object. What is best po...

artf

Hi @Abhisheknanda1344463 did you try to follow my indications here? You don't need to add/remove sectors on each select just play with component properties

Abhisheknanda1344463

@artf I've tried that but if i do like this https://github.com/artf/grapesjs/issues/1428#issuecomment-421640559 then it'll show the style sectors in which that properties are present. I want to show my custom only one style sector for spec...

artf

Here a quick example of usage: https://jsfiddle.net/1tvrLqem/1/ As you can see the sector will hide if there are no properties to show

#3402Apr 14, 2021by joshk1322 answers
0 reactions

Unable to get blocks to show in right hand sidebar

Version: 0.14.62 Are you able to reproduce the bug from the demo?[ ] Yes[x] No Doesn't support Vue.js or NPM What is the expected behavior? Blocks to show in the right-hand sidebar with style manager Describe the bug detailed I am trying to get the blocks manager to show in the right-hand sidebar however no matter whe...

artf

GJSBlock

Thanks for reporting this, @joshk132. The issue with Unable to get blocks to show in right hand sidebar appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modif...

#3401Apr 12, 2021by ahmedderkaoui3 answers
10 reactions

Can style manager always generate IDs instead of using already defined element's class ?

When we style an element in the editor, if this element doesn't have neither a class or an id, the style manager generate a new id with the css style. However, styling an element with a class makes the style manager use this class to add styles. Is there a way to always use IDs for styling and not work with classes ?...

Ju99ernaut

ahmedderkaoui

Thanks a lot!

GJSBlock

Thanks for reporting this, @ahmedderkaoui. Great question about Can style manager always generate IDs instead of using already defined element's class ?. The recommended approach with StyleManager is to use the event-driven API. Start here...

#3399Apr 9, 2021by AdamTorma4 answers
2 reactions

Convert JSON to HTML server-side

So first of all, thank you @artf for this amazing project. I have a question: Is it possible to easily convert the components-JSON to HTML on the server-side (in a Node.js environment)? If it is possible, can you give me a hint how to achieve this? On the client-side it's quite straightforward: I can get the component...

bgrand-ch

Hello, For future questions or technical issues, which aren't bugs, GitHub's Discussions tab is the place to be. Don't forget to close this issue if it is resolved or write a new detailed message in Discussions -> Q&A category (and close t...

anlumo

Yes, if you have any kind of interactive content, that probably wouldn't work. Fortunately that's not the case for my application.

Ju99ernaut

Maybe you could install grapesjs server-side(similar to client-side) and use it for rendering, otherwise you'll have to reverse engineer the renderer. Another alternative would be to store the generated HTML in the database as well.

#3397Apr 9, 2021by YumiChen1 answer
0 reactions

Sorter direction incorrect with web component slot

Version:0.16.45 Are you able to reproduce the bug from the demo?[x] Yes[ ] No What is the expected behavior? Given a parent web component instance rendering some elements with slot, in the shadowDOM, if the parent element of slot got display: flex style, the sorter should be vertical, for in the result the elements ar...

GJSBlock

Thanks for reporting this, @YumiChen. The issue with sorter direction incorrect with web component slot appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modif...

#3392Apr 7, 2021by rywilson283 answers
0 reactions

Allow dynamic droppable configuration using a function

I have a requirement where I cannot use selectors to determine if an element is droppable. For example: The "child" component must be within a "parent" component, however if the child component contains a ref attribute it can only be dragged into other parent containers that match the same ref value as the current par...

rywilson28

Associated PR: https://github.com/artf/grapesjs/pull/3393

rywilson28

@artf do have any questions regarding this feature or the approach taken in the PR?

GJSBlock

Thanks for reporting this, @rywilson28. Great suggestion about FEAT: Allow dynamic droppable configuration using a function! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using t...

Browse all topics