When view code is clicked and we have selected element(s) in the canvas, code viewer can show it's corresponding code and select it outerHTML - great feature for instant copy from there or fast inspection.
GJSBlock
Thanks for reporting this, @gMakaan. Great suggestion about FEAT: code viewer - go to selected canvas block(s)! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the event syst...
I got this error when add the <iframe src="https://app.conversiobot.com/boot/fvMEvO" width="100%" height="500" frameBorder="0" allow="geolocation"></iframe> used the custom code component. my code works fine with 0.17.4, but got below error with 0.17.19 grapes.min.js:2 Uncaught TypeError: Cannot read property 'length'...
artf
Thanks for the report, the fix is ready for the next release.
rahul-singh-bv
I am encountering a similar issue with v0.19.5 when I try to add an iframe inside of a custom code block
GJSBlock
Thanks for reporting this, @jcsofts. The error TypeError: Cannot read property 'length' of undefined occurs when Canvas attempts to access properties before the component lifecycle is fully initialized. This is a common race condition in G...
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...
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'.
I am using the plugin grapesjs-blocks-bootstrap4 and integrated grapesjs-lory-slider it works the first time I use it but when I load it from the database it loses the slider feature . Where am I doing wrong? When pulled in, it still works normally This is when I load them from the database and they turn into box this...
artf
Hi @vuongluc yeah, it might be a problem loading back html/css in that way for editing. You should store and load back JSON data, check out this guide
GJSBlock
Thanks for reporting this, @vuongluc. Great suggestion about grapesjs lory slider! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the event system: Alternative approaches: L...
What are you trying to add to GrapesJS? The CSS property float only makes sense for position: static; elements, which happens to be the default. I only want to display the float radio selector if the position is not set to anything else. However, if I add require: ['static']; to the property definition, the setting is...
artf
Hi @anlumo, did you try to extend float definition with something like this requires: { position: ['static'] }?
anlumo
Yes. It seems to work fine after reloading the page, but when you toggle the position it stops working and looks like in the screenshot. The definition is as follows:
GJSBlock
Thanks for reporting this, @anlumo. Great suggestion about FEAT: In Style Manager, Allow Requiring the Default Setting! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the ev...
What are you trying to add to GrapesJS? Component should be able to mark themselves as dirty, triggering the onbeforeunload warning message. Describe your feature request detailed I have a (custom) text component where the user can enter arbitrary text. I'm storing the data on my server, and I want autosave. However,...
anlumo
I worked around this by completely disabling the onbeforeunload handling and rolling my own.
artf
The editor has editing property which changes any time RTE is enabled/disabled, so I guess, in your case, this should work
anlumo
Wouldn't this onbeforeunload handler be overwritten afterwards by the snippet I referenced above?
Hello, right now grapesjs provides built in properties like margin, padding that allow user to change each property one by one (margin-top, margin-bottom, etc). It would be nice to have ability to change all these properties together. To have some lock button, for example, when it's enabled it will change all properti...
artf
Yeah, that would be cool, but unfortunately, GrapesJS doesn't have yet the proper UI module which could allow easily to build new UI components by reusing others, so StyleManager.addType is the only way but in that case, it's up to you bui...
GJSBlock
Thanks for reporting this, @kuhelbeher. Great suggestion about FEAT: Ability to change all margin, padding etc properties together! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior....
I've noticed if in the initialise function I set a height it will set based on a specific pixel amount e.g. height: "500px". However if you try to set with a percentage e.g. height: "90%" the editor has no height at all. Also I'm wondering what is setting the height if nothing is set because it appears to be automatic...
ahmedderkaoui
try to work with vh instead of px. eg: give the editor height: '80vh', your navbar height: '20vh'. This way, the vertical scroll will never be shown or needed as long as the sum of all elements's vh β€ 100 Hope this helps.
samichamoun
try to work with vh instead of px.eg: give the editor height: '80vh', your navbar height: '20vh'. This way, the vertical scroll will never be shown or needed as long as the sum of all elements's vh β€ 100Hope this helps. thanks this is usef...
artf
This is more a layout issue and not related to the GrapesJS editor itself.
WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...
GJSBlock
Thanks for reporting this, @divesham. Great suggestion about FEAT: ADD CUSTOM BLOCKS (i.e iframe) and customise it like image i.e on double click it open assets options for video link in custom iframe block! While this specific feature isn...