GrapesJS Issues

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

3,464 issues found

#3607Jul 9, 2021by gMakaan1 answer
0 reactions

Code viewer - go to selected canvas block(s)

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...

#3606Jul 9, 2021by Palash-Mandal2 answers
0 reactions

If I use float from alignment float not clear that's why design issue occur.

Hello @artf , There a generic issue when try to create a layout using float form alignment. The issue is float not clear automatically. how do I add new class in row when user set flow value float left /right <div data-gjs-type="default" draggable="true" data-highlightable="1" class="row" id="iroj"><div data-gjs-type=...

artf

Please follow the issue template

GJSBlock

Thanks for reporting this, @Palash-Mandal. Great question about if I use float from alignment float not clear that's why design issue occur.. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the...

#3605Jul 9, 2021by aryanchopra1 answer
0 reactions

Adding selected component style to a block

So I'm trying to fetch the selected component and make a block out of it, however, I'm struggling with adding the css of the same. my approach looks like this currently: editor.BlockManager.add(widgetname, { label: widget name, content: editor.getSelectedAll(), category: panelname, attributes: { title: widgetname, cla...

GJSBlock

Thanks for reporting this, @aryanchopra. Thanks for sharing your report about Adding selected component style to a block. To help the team investigate and prioritize this: Please provide: A minimal reproducible example (CodeSandbox/JSFiddl...

#3604Jul 9, 2021by NoumanAhmad-Braqsol3 answers
0 reactions

Editor.on('component:update:content', model => { }}) not work in some cause

if the user remove all text from a element and click some where else . then again try to select empty element he is not able to select it again because it is hide and i dont know where it goes. So for this issue I am using this code this code set a space in text if user remove all text from a element . By doing this t...

artf

As already suggested here https://github.com/artf/grapesjs/issues/3603#issuecomment-885305546 avoid doing what you're doing now and add a simple default CSS in case the element is empty

NoumanAhmad-Braqsol

Thank you i got it !

GJSBlock

Thanks for reporting this, @NoumanAhmad-Braqsol. Thanks for sharing your report about editor.on('component:update:content', model => { }}) not work in some cause. To help the team investigate and prioritize this: Please provide: A minimal...

#3603Jul 8, 2021by NoumanAhmad-Braqsol2 answers
0 reactions

Issue in Text Edit . Text not select agian if it remove

First of all thanks for the great tool @artf . As i am working on a project . So i have an issue while text editing . if i select a text box and edit a text it works fine' but if i remove all text and click somewhere else and again try to select text box . it not work because empty text go hide and did not select agai...

artf

I'd say more a layout issue. As the box doesn't have any text it loses its dimensions so it's hard to enable it again. Anyway, you can extend your text components and add some extra styles to make it easier to select when are empty. For th...

GJSBlock

Thanks for reporting this, @NoumanAhmad-Braqsol. Great question about Issue in Text Edit . Text not select agian if it remove. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentat...

#3600Jul 7, 2021by sathyanarayananaCES1 answer
0 reactions

Event listener to visibility(eye) icon in the Layer Manager

I would like to listen to the eye icon in the layer manager from the editor, based on which, I need to write the custom styles. Is there any way we can do that? I got the code, from another issue, I would like to extend the toggleVisibility method from here. Is it possible? if so, how can we do that? Secondly, I would...

GJSBlock

Thanks for reporting this, @sathyanarayananaCES. Great question about [Question]: Event listener to visibility(eye) icon in the Layer Manager. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the...

#3599Jul 7, 2021by niranjank1512 answers
0 reactions

@keyframes not adding even after i pass the the keyframes object

Hi @artf, I have added the let cc = editor.CssComposer; cc.setRule('.fadetop-animate', { opacity: 0, 'animation-name': 'fadeTop' }, { atRuleType: 'keyframes', atRuleParams: 'fadeTop', selector: 'to', style:{ opacity: 1 } }); as per the Document [](https://grapesjs.com/docs/api/css_composer.html#setrule) however rule f...

artf

Use this one

GJSBlock

Thanks for reporting this, @niranjank151. Great question about @keyframes not adding even after i pass the the keyframes object. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS docu...

#3596Jul 6, 2021by aimeos4 answers
0 reactions

Values are not escaped

GrapesJS code is open to XSS issues because values are inserted into DOM without escaping, e.g. https://github.com/artf/grapesjs/blob/dev/src/assetmanager/view/AssetImageView.js#L30 If model.getFilename() returns <img src=x onerror=alert(document.cookie)>.jpg, this can result in an account takeover. Instead the code s...

aimeos

@artf What are your plans because the vulnerability of GrapesJS to XSS is a pretty big security problem

artf

Yeah thanks for the report @aimeos I'll fix it in the next version for sure

aimeos

@artf The documentation also uses ${var} to insert variables into templates often. This should also be changed to avoid that developers introduce security issues too without knowing that.

#3595Jul 6, 2021by Palash-Mandal1 answer
0 reactions

Hello @artf ,

Hello @artf , It's a generic issue the width, height property value set to auto while change view to mobile or tablet view. But the auto property not reflects in in CSS that's why desktop value is in there and issue is arise. If I change the value of width to auto and press tab / enter the value still not reflects in...

GJSBlock

Thanks for reporting this, @Palash-Mandal. Great question about *. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() event lis...

#3594Jul 6, 2021by maxtsh3 answers
1 reactions

Hover on component when parent of editor scrolls, show wrong positioning

Version: 0.17.19 Are you able to reproduce the bug from the demo? No, because its full screen and there is no parent container scroll. What is the expected behavior? Hover state cadre to see the component changes position Describe the bug detailed When I want to select or hover on specific component, it shows wrong po...

artf

If the scrollable element is not the editor's parent node, you might need this option https://github.com/artf/grapesjs/blob/dc45604962e4e6a4a075f19d5de67090bac15fa5/src/editor/config/config.js#L157-L163

no-response[bot]

This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take ac...

GJSBlock

Thanks for reporting this, @maxtsh. The issue with Hover on component when parent of editor scrolls, show wrong positioning appears to be a race condition or state management timing problem. This typically happens when component lifecycle...

Browse all topics