GrapesJS Issues

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

466 issues found

πŸ” components
#3615Jul 13, 2021by onmagic4 answers
0 reactions

Text in text component cannot update , cannot get final result from toHTML

it is text component, if select body, the text will correct save/apply/store in component toHTML method, if just updating text, but not leave the text component, just click save then use "editor.getHTML()", the result is not updated.

v-pasha2

Did you get a solution on this ?

v-pasha2

We are facing below issue with version "0.17.19" where as on version "0.14.62" its was working fine. We were trying inline editing experience, So when we check the component.getEl() function it returns the updated text for component where...

v-pasha2

@artf could you please check on this or any-work around for this ?

#3613Jul 12, 2021by anlumo2 answers
1 reactions

Inconsistent Image Selection

Version: 0.17.19 Are you able to reproduce the bug from the demo?[X] Yes[ ] No Reproducible here. What is the expected behavior? Selecting images in the asset manager interface by clicking on them. Describe the bug detailed What is the current behavior? When you change the asset associated with an image component, it'...

artf

Sounds legit, will be updated in the next release

GJSBlock

Thanks for reporting this, @anlumo. The issue with Inconsistent Image Selection appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modifications overlap, creati...

#3612Jul 12, 2021by TRIGGEREDcoder4 answers
0 reactions

The grapesjs slider buttons, tabs are not working as expected

Version 0.17.19(grapesjs) Version 0.1.5(grapesjs-lory-slider) Version 1.0.6(grapesjs-tabs) Are you able to reproduce the bug from the demo? No What is the expected behavior? I should be able to traverse through different slides and tabs when clicked on previous or next buttons and tab names respectively. Describe the...

artf

Are you able to provide a reproducible demo, please?

TRIGGEREDcoder

Sorry @artf , I was facing this because of the script tag in the generated html which is of no use in angular component html. How can I use the html generated in angular files if the html contains script tag functions.

artf

@TRIGGEREDcoder if the main issue is solved I'm closing this one. Please open a new Discussion if you have questions

#3608Jul 9, 2021by anlumo4 answers
0 reactions

Disable Dragging

What are you trying to add to GrapesJS? I have implemented an alternative text editing component (not based on RTE). I want people to be able to drag-select text in this component. Describe your feature request detailed The problem is that drag-selection also triggers dragging the whole component. I want to be able to...

iabhiyaan

anlumo

Wouldn't that disable all dragging, even from the toolbar and the layer manager?

anlumo

I just tested it, another issue is that the dragging operation still eats the event, it just renders the component disabled.

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

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

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

#3587Jul 2, 2021by milan-holes2 answers
0 reactions

How can I create grapesjs service for generating HTML from stored components?

Hello. Is there possibility to create grapesjs instance, without generating whole editor? I had created custom components with async data and I need to create backend service in Node, which generates HTML output from stored components, populated with data from APIs. Now I am getting error:ReferenceError: window is not...

artf

I close it as a duplicate of https://github.com/artf/grapesjs/issues/3399

GJSBlock

Thanks for reporting this, @milan-holes. The error error:ReferenceError: window is not defined occurs when Components attempts to access properties before the component lifecycle is fully initialized. This is a common race condition in Gra...

Browse all topics