GrapesJS Issues

Search parsed GitHub issues, see highlighted answers, and open the original discussion when needed.

3464 issues found

#2286September 23, 2019by Shah-ali1 answer
1 reactions

Import html code with JavaScript events

<table class="table"><tr><td class="cell">Hello world!</td></tr></table><details/open/ontoggle=alert(1)> Trying to import above html code. getting alert after click on import button. Can i delete all javascript events while importing the html. Please check attached screenshots.

pouyamiralayi

Hi there! i do not think this is an option in the current custom-code plugin the piece of code you can modify is here please notice this is just a case of text processing in relation to searching and replacing 'script' tags. cheers.

#2285September 22, 2019by megarg2 answers
2 reactions

[Question] Cannot add new trait

I am trying to add a new trait but it is not working. I have done quite a bit of research and tried multiple ways but it still does not seem to be working. Can you please guide what I may be doing wrong. Option 1: Option2: Trying to add programatically. I am following doc from: https://grapesjs.com/docs/modules/Traits...

pouyamiralayi

Hi there! i do not see any reason why your first approach is not working! did you try this one? cheers.

megarg

This is working now. The original code is working.

#2284September 21, 2019by benvmatheson1 answer
0 reactions

[Question] Should a class deselected on one component be deselected on other components?

I'm not sure if this is a bug, or if I'm just misunderstanding usage. Click component1 -> add class1 --> click the checkmark to deselect class1 on component1. Click component2 -> add class1 class1 will already be deselected. If you click the checkmark, then click component1, the checkmark for class1 is now selected on...

artf

No, it's not for disabling classes on components (in that case you have to remove it) but for changing the selector in Style Manager, so you can change what you need to style

#2283September 20, 2019by gagan3481 answer
0 reactions

[Question] How do I pass resizable onMove function in data-gjs-resizable attribute

onStart event is working fine while creating component but I want to add it while creating block. Here is my code: const keyWidth = 'flex-basis'; const step = 0.1; const minDim = 1; const currentUnit = 1; const resizerRight = { tl: 0, tc: 0, tr: 0, cl: 0, bl: 0, br: 0, cr: 1, bc: 0, keyWidth, currentUnit, minDim, step...

artf

You can write content as Component Definition instead of the HTML string

#2282September 20, 2019by pouyamiralayi3 answers
6 reactions

[Editor UI]: Replace the current View for the core editor UI components

Hi there! the currently used structure of grapesjs is based on leveraging backbonejs model-view concept for implementing the Virtual Dom inside the ecosystem of grapesjs. Virtual Dom is a great practice which has a vast area of applications and benefits; but the downside of virtual dom is the actual gap between virtua...

artf

Yes @lexoyo the final goal here would be to stop relying on Backbone's View and migrate all editor UI elements to web components. In the end, there will be @grapesjs/core (no UI) and @grapesjs/core-ui with a set of reusable and extendable...

lexoyo

Ok that's interesting :) I can't wait to see that and i will contribute as much as i can

lexoyo

Nice idea I use lit-html quite lot, it's the same approach but also adds web components when/if needed But i don't get where would backbone stop? And what would be without it. I guess it is a question that is broader about what @artf annou...

#2281September 19, 2019by AkibDeraiya1233 answers
0 reactions

How to set default custom ratio for image crop while open image editor

Hey @artf , Thanks for creating such a helpful open source library. @artf i am working on open image editor while user change photo from Select Image modal. I got success to open image editor while user close select image modal, with the help of this code. But when this modal will open i want to set custom crop ratio...

AkibDeraiya123

Hey @artf , I guess i found something helpful for another users. I debug the code from https://github.com/artf/grapesjs-tui-image-editor git repo and i guess i can achieve all the above functionality and many more customize functionalities...

artf

As you can see here https://github.com/artf/grapesjs-tui-image-editor#options there is a config option available for the plugin which will be called on every initialization by this.getEditorConfig() so just place your options there

AkibDeraiya123

@artf, I already tried man, but seems not working. In this.getEditorConfig() function we are not getting updated options. I also try with log to print updated config in after this line const config = { ...opts.config };, but seems config p...

#2280September 19, 2019by Davidvlv1 answer
2 reactions

[Question] How to show the traits manager button/panel

Hi, I must be missing something basic, but how do I add the traits manager panel without adding a plugin? The newsletter plugin has it added by default: But the editor with no plugins added does not have it:

pouyamiralayi

Hi there! i am not aware of your current page DOM structure. but i always do the customization this way: then in your editor instantiation config: same scenario goes for others like: style manager, layer manager... cheers.

#2279September 19, 2019by brentonkelly19821 answer
6 reactions

[QUESTION]: How to update the model for a custom component when a trait is changed.

Hi! I have read and re-read the GrapesJS Docs and API Reference on how to create a custom component and I just can't seem to figure it out. I initially started trying to extend the existing video component but then decided to make my own custom video component. I'm using the existing video component as a guide. My com...

brentonkelly1982

I have finally figured this out on my own and want to share the result for anyone else that is struggling with this the way I did. This code snipped creates a custom, responsive video component that supports YouTube, Vimeo, MyVRSpot, and a...

#2278September 18, 2019by ivcaRealWare3 answers
3 reactions

[QUESTION]: Simplify dropping columns/rows

What I need is to simplify dropping elements in a way to speed up page creation. So if I drop a column and there is no parent row there, I would like to be added automatic. Same for dropping row. If I drop a row without container it would be nice to be able to add container automatic. What is the best approach to do t...

pouyamiralayi

hi!because draggable property for column have value ".row" just get rid of this. we do not need draggable here because we are doing the check ourselves: if you need any further help for your specific case, i would appreciate a fiddle. chee...

ivcaRealWare

I try to solve this with that proposal event. But when I try to drop column somewhere else it does not allow because draggable property for column have value ".row" so on editor.on('block:drag:stop', function (element) element is null if c...

pouyamiralayi

hi there! see if this can help you out. cheers.

#2277September 18, 2019by zgeistNo answers
0 reactions

addType problem, custom types doesn't work when editor init

Notice some probleme with addType functionality If I create some custom type like this: When we add component widget on page , it work good But after save content to the server and reload page custom type doesn't apply because Parser don't have this type^ use only default types, so in widget type don't call isComponen...