GrapesJS Issues

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

3,464 issues found

#3569Jun 26, 2021by sktlmarat1 answer
0 reactions

Remove the wrapper when the child component is deleted

Hi! I created a DOM component and I was thinking whether it is possible to delete the div wrapper when I delete the child text component. I tried to do it with the removed hook but couldn't came up with the correct solution. Thanks!

GJSBlock

Thanks for reporting this, @sktlmarat. Thanks for sharing your report about Remove the wrapper when the child component is deleted. To help the team investigate and prioritize this: Please provide: A minimal reproducible example (CodeSandb...

#3565Jun 24, 2021by Ubanna2 answers
0 reactions

Undefined for multiple page manager in React

Hi, please what is the best way to implement multiple page manager in a react app. I have successfully implemented this without page manager like so: For the page manager implementation I try this: Here, I get undefined for page manager. I would appreciate any help please. Thanks

artf

I think you're just using an old version of GrapesJS

GJSBlock

Thanks for reporting this, @Ubanna. Great question about undefined for multiple page manager in React. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specifi...

#3564Jun 24, 2021by theSC0RP4 answers
0 reactions

Unable to refresh the iframe

0.17.19 Are you able to reproduce the bug from the demo? YES What is the expected behavior? I had asked a question regarding iframe refresh (#3413). The proposed solution was working for that version (0.17.3) and after running the piece of code the iframe should refresh and the canvas should be seen with the component...

artf

I would need to check why he is still trying to remove the frame, but for now, just skip this line frameView.remove()

theSC0RP

@artf. Thanks. This works when done once. If I do some action like a click inside the canvas and then if I run frameWrapView.render(); once again, I got another error. The screenshot and a video of this error are attached below. <hr> https...

artf

I'll try to fix it in the next release, but for now, you have to unselect components before frameWrapView.render() and reselect them back post rendering

#3562Jun 23, 2021by MarksEliel2 answers
0 reactions

How to edit data attributes

Is there a possibility to edit data attributes on components?

artf

Yes, please check the documentation and follow issue templates

GJSBlock

Thanks for reporting this, @MarksEliel. Great question about How to edit data attributes. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look f...

#3561Jun 23, 2021by AStoker4 answers
0 reactions

Enhanced Shadow DOM Support

What are you trying to add to GrapesJS? Better Shadow DOM support, allowing developers to render GrapesJS inside a Shadow element without having to specifically pass in elements rather than selectors in the configuration. Describe your feature request detailed When currently using element selectors, GrapesJS simply us...

artf

Hi @AStoker I don't understand what is the real issue with your example (aside not loading GrapesJS styles inside your shadow dom). If you're attaching shadow dom, obviously, you can't do this container: '#gjs', but you're still able to pa...

AStoker

The issue is that I must pass HTML elements everywhere and cannot use selectors. This can become cumbersome to write as I must now use the shadow Dom's query selector for every panel, every element, anything that we hook into GrapesJS. Add...

AStoker

I updated the JSFiddle so you can see what we need to do to get styles within Shadow DOM. But unfortunately the CSS that's automatically added by GrapesJS exists on the body and is both polluting the global stylesheets and pointless due to...

#3560Jun 23, 2021by hadeel944 answers
2 reactions

Customize Blocks Styles - grapesjs Angular

I am new to grapes js , I am trying to make the blocks in a different style when dragging for example the image blocks 1 - when not dragged or hover takes style A . 2- when hover takes style B . 3- When dragged takes style C (when it is over the canvas). can any one help me with this issue . Thanks

ronaldohoch

Maybe with this events you can do it: https://grapesjs.com/docs/api/editor.html#blocks or https://grapesjs.com/docs/api/editor.html#canvas

artf

In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation w...

hadeel94

In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation w...

#3559Jun 22, 2021by iabhiyaan3 answers
0 reactions

Page.getMainComponent().view gives undefined when page is selected

Hello @artf, I want to get the HTML Element of selected page. But it returns undefined when using following code:

artf

Hi @iabhiyaan, when page:select triggers, iframes inside the canvas are not yet loaded, so you just need to wait once they are loaded before accessing its DOM.

iabhiyaan

Thankyou @artf.

GJSBlock

Thanks for reporting this, @iabhiyaan. Thanks for sharing your report about page.getMainComponent().view gives undefined when page is selected. To help the team investigate and prioritize this: Please provide: A minimal reproducible exampl...

#3558Jun 22, 2021by aimeos4 answers
2 reactions

Support Content-Security-Policy

To reduce the possible attack surface if the editor is used in "hostile" environments (e.g. in SaaS platforms) support for CSP is required. This will also prevent problems like https://github.com/artf/grapesjs/issues/3082 At the moment, the only problem that prevents effective CSP rules is the use of new Function() in...

artf

ok then, I'll try to fix it for the next release.

artf

mmm I'm not sure exactly how I'm able to fix it and what do you mean by is the use of new Function() in the GrapesJS code as there is no such a thing in the source?

aimeos

Found out that it's in the dist files due to underscore.js template() method which uses new Function(). I think this will make it hard to replace or remove that dependency to enforce a CSP without 'unsafe-eval'.

#3557Jun 22, 2021by acip4 answers
0 reactions

Upgrade - how to update old templates to the newest version?

I have some templates that were generated with v0.14.5. How can I "upgrade" them to the latest version? They have classes attached and I see that the newest version doesn't add classes to the elements anymore. Context: we use bespoke components and some defaults (e.g. draggable, resizable etc., style) have been change...

artf

They have classes attached and I see that the newest version doesn't add classes to the elements anymore. I'm not sure what you're talking about, classes should be imported as before.Context: we use bespoke components and some defaults (e....

acip

Hey, thanks for the quick response. Here is the template generated by v0.14.5 https://jsonblob.com/535ae06f-d4f6-11eb-8bc1-415e99da64cb This is how it looks https://ibb.co/Zz8qg2J We've changed some custom components' default attributes an...

acip

I've setup old vs new version for an existing template: https://grapesjs-templates-upgrade.ciprianamariei.repl.co/0.14.5-old-template.html https://grapesjs-templates-upgrade.ciprianamariei.repl.co/0.16.45-old-template.html

#3549Jun 19, 2021by anlumo1 answer
0 reactions

CreateCustomEvent Doesn't Handle Mouse Events Correctly

Version: 0.17.4 / git master Describe the bug detailed FrameView repackages keyboard and mouse events here: https://github.com/artf/grapesjs/blob/07061ae1307fedf2a3b9bd585ce0cb30f653f112/src/canvas/view/FrameView.js#L389-L399 I think the reason is related to redirecting iframe events to parent frame events. This would...

GJSBlock

Thanks for reporting this, @anlumo. The issue with createCustomEvent Doesn't Handle Mouse Events Correctly appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM mo...

Browse all topics