GrapesJS Issues

3,464 parsed GitHub issues โ€” 370 solved ยท 90 open. Search, filter and explore battle-tested answers.

569 issues found

๐Ÿ” canvas
#2359October 30, 2019by sheldon5forever3 answers
1 reactions

Absolute mode, component's style missing when dragged into canvas

Hi guys, I'm working with grapesjs which version is '0.15.8', and in 'absolute' mode when I drag a block into canvas, I find the styles of component are missing. Define component as following: And I found the code in Droppable here: /utils/Droppable.js@L78 the component's styles are replaced. Should 'addStyle' be used...

pouyamiralayi

@artf yes! this is not happening if i remove `script`. the behavior is fine.

pouyamiralayi

Hi @sheldonwr this bug you are referring to is not reproducible in my side, here i tried your type definition on the demo and it is working, please check the below code and see what is missing in your side: the issue i observed with this c...

artf

Ok, actually a weird thing happens when a component has script property defined... Thanks for the report guys, I'll check this out. Can you confirm that without script it behaves correctly?

#2357October 30, 2019by giorgiosjames1 answer
0 reactions

[Bug] Video boolean attributes breaks on import

Explanation Using https://grapesjs.com/demo.html v0.15.8 on Chrome 77.0.3~ Windows 10 Pro Build 18362 Importing a Video component with any Boolean attribute (controls, loop, autoplay) using the import modal will break all boolean attributes on the component until the component is deleted. Reproduction StepsNavigate to...

artf

At first look the issue might be here: https://github.com/artf/grapesjs/blob/a850a305b80b8f86c0e7e4fb92b6492c2e5a1957/src/dom_components/model/ComponentVideo.js#L115-L117 indeed in the export/import I'd expect just ... controls> and not .....

#2346October 21, 2019by frankpagan2 answers
1 reactions

When a component is clicked is there a hook to know when the traits have rendered.

Hey Grapes Community, When a component is clicked from within canvas is there a hook or event to know when the traits have rendered in view container for the selected component?

frankpagan

Perfect, Thank you!

pouyamiralayi

Hi there! When a component is clicked `component:selected` is the event you are looking for. more on this hereto know when the traits have rendered in view container based on the nature of the the suggested event, you will receive the mode...

#2338October 18, 2019by senchdenNo answers
0 reactions

[Bug]: Cannot upload an image in IE11

Steps to reproduce:Drop an image block onto the canvas.In the opened modal, click on the drop zone or drop an image Expected results: New image is added to the list and user is able to select it Actual results: Editor crashes with Reproducible in a web page demo v0.15.8

#2332October 16, 2019by kondziu952 answers
0 reactions

[BUG] Can not edit label in Firefox browser

Hi, I can not edit label in Firefox browser (v. 69.0.3). The issue occurs when I double click the component to edit it. RTE shows toolbar but changing text or attributes is unable. The web console does not show any errors. When the text is selected and I am trying to for example bold the text then in web console there...

artf

https://bugzilla.mozilla.org/show_bug.cgi?id=853519 Probably the easiest solution would be to force the View to use span tag instead of label

schmelik

This was an interesting fix but it comes with issues... spans != labels when applying padding to the labels such as bootstrap labels the padding will not be applied to a span not unless display: inline-block; is also applied to the span

#2329October 15, 2019by mustahsanmustafa2 answers
1 reactions

[HELP] Canvas clears component rendering after Traits value change event

I have created custom components and blocks, but when value of traits change, the rendered element gets invisible from the canvas until it is reloaded. So whenever this line is executed, the loaded block gets invisible or unrendered. A workaround that i got was to re-render DomComponents after this call: but that does...

artf

@mustahsanmustafa I think there is something wring here... For any new app-body component you're creating a new inside with this this.components('<app-body props='${value}'></app-body>'). The method this.components updates inner content no...

pouyamiralayi

Hi there! being more specific in reaction to what attribute is actually changing would help you to reduce the performance issue in your case. cheers!

#2328October 14, 2019by MariusDK1 answer
0 reactions

Cannot read property 'hasFocus' of null

Hey @artf I get the error Cannot read property 'hasFocus' of null when i press 'a', 's', 'd' and 'w' from the keyboard on input text components in the canvas. Uncaught TypeError: Cannot read property 'hasFocus' of null at Object.hasFocus (grapes.min.js:12) at run (grapes.min.js:3) at Object.method (grapes.min.js:12) a...

MariusDK

It's about keymaps: d stands for core:component-delete a stands for core:component-exit s stands for core:component-next w stands for core:component-prev To solve the error i have to use:Remove all binded keymaps editor.keymaps.removeAll()...

#2314October 7, 2019by alimajedcme1 answer
0 reactions

[BUG] grapesjs does not handle correctly outlook specific HTML

Hello all, I have a template that includes outlook specific HTML as shown below: <!--[if (gte mso 9)|(IE)]><table width="100%" border="0" cellpadding="0" cellspacing="0"><![endif]--> When I import this HTML, and try to add a block above or below this specific location in the DOM, the green line showing where the compo...

artf

Probably you would need to create a custom component to handle such a case

#2313October 7, 2019by TheComputerM3 answers
4 reactions

[BUG] Scripts do not work when added dynamically added to iframe <head>

I am using the latest version of grapesjs (0.15.8) and running it on Windows 10 x64 on Electron (this is not a issue with electron) and am facing a problem when I try to dynamically attach scripts to the editor iframe, I have included a link to CodePen for more on this issue. In my project I have to dynamically change...

pouyamiralayi

Hi there! see if this can help you out: cheers!

TheComputerM

Thank you very much, the fix worked, but why does it not work with jQuery?

TheComputerM

Ok thanks a lot.

#2302September 30, 2019by Amitkumar855333 answers
2 reactions

How to get the external plugin CSS, JS and HTML through GrapesJS export feature?

I have used an external plugin javascript version of @fullCalendar into the GrapesJS. I am able to render the calendar on the canvas but I am unable to use GrapesJS export feature to get JS, CSS and HTML of the following. I tried using 1) var html = editor.getHtml(); 2) var css = editor.getCss(); 3) var js = editor.ge...

pouyamiralayi

. But we are unable to show users the calendar on the canvas after drag and drop with render function in MODEL that is why we used OnRender in the VIEW. Did you try the component type definition i posted for you? it has been tested and it...

Amitkumar85533

Thanks a lot, @pouyamiralayi. The code you gave was working. Our code was not able to pick the dom element to render the calendar. Now it is working as expected. Thanks a lot for helping us out !!!! :-p

pouyamiralayi

Hi there! what you are looking for is using js inside components. just include the required js and css in the canvas scripts and styles section: after that build your own custom type component: then on code preview you will see the result...