GrapesJS Issues

kerryj89

I'm having this same issue and the link @artf mentioned while it starts with active state it stops working when you click on another device. Edit: @zgeist Fixed it here https://github.com/artf/grapesjs/issues/3305#issuecomment-808323277

artf

I think the issue is just with the webpage preset (didn't have time to update) but is the same property described in getting started: https://grapesjs.com/docs/getting-started.html#style-manager You have to add the button with togglable: f...

pouyamiralayi

this is only for the drag icon, right? the manual dragging is fine. using the drag icon, it resets the position of the element from the top as it seems.

niisar

this is only for the drag icon, right? the manual dragging is fine.using the drag icon, it resets the position of the element from the top as it seems. Yes this is only for drag icon.

artf

Yeah the problem here is the different Event object based on the context. When you trigger the drag on the component itself the Event is in the context of the iframe (because the clicked element is in iframe) but component's buttons are ou...

artf

Thanks @WebEtSolutions it'll be fixed in the next release

inaLar

Hi! This is very useful information - about accessing the model this way instead the DOM. I will explore it. I still don't understand why the gjs-comp-selected class is stored in the innerHTML precisely when I drop the custom component ins...

inaLar

@pouyamiralayi, yes, I have done exactly the same and it is working, but also I've managed to use tagName (div, p, ... ) in the isComponent of an extended text component and this also works in my case. I will close the question now. Thank...

pouyamiralayi

do you define your custom type inside a plugin?

artf

mmm probably I didn't describe it correctly, especially with this: I need to correct it with So the point of this feature is simply to understand objects generated from JSX and transform them into GrapesJS component definition objects and...

devgru

Consider using avoidDefaults flag, it reduces config footprint by removing these default values: https://github.com/artf/grapesjs/blob/c1fb490a73adefb0fa073f37bef4e6178d9321a8/src/editor/config/config.js#L131

artf

Consider using avoidDefaults flag, it reduces config footprint by removing these default values Correct

artf

You can't just do $('.img[src=""]') GrapesJS components are not in the same context, are placed inside an iframe so you have to use the document from that iframe, eg.

pouyamiralayi

is your selector correct? As far as i know grapes will set background-image:url() instead of src.

ghost

Just add style overflow: auto to .gjs-cv-canvas__frames

artf

After exploring a bit more about this issue I'd suggest just not to exceed the canvas height with the device one. Unfortunately, currently, making any part of the canvas scrollable (solution suggested by @TheDiamondKing ) will lead to unex...

contentfree

@artf Is your comment still true? Does adding overflow: auto (especially in a "designer mode" / "absolute mode" canvas) still cause problems?

smik3

Oh I know that! What I was referring to is that if you try and use the index/block/component files from dist (ie unminified and easier to work from) they don't work outside of a node/webpack environment. On 19 Aug 2019, at 20:18, Pouya Mir...

inaLar

@smik3 , this is not a good practice, as it won't let you update GrapesJS easy in future. You better separate the custom code in js functions and whichever of them you need to use as a plugin, you can load. Or use node only for compilation...

Chaitwo

Hey, @GoodPHP I need help with a challenge I've been facing I want to hide images with src empty on preview mode and show them on editor mode i.e stop: preview. I've tried this but it doesn't seem to work for some reason Thanks, Chaitu