GrapesJS Issues

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

877 issues found

๐Ÿ” question
#6152Sep 18, 2024by stpp24 answers
1 reactions

CSS added via custom code persists after custom code component is removed

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? any Reproducible demo link https://grapesjs.com/demo Describe the bug How to reproduce the bug?Add custom code component with HTML + CSSDelete custom code component. What is the expected behavior? All code should be remove...

artf

This is not related to the core and should be addressed at the plugin level. Please create the issue there and we'll try to figure out the right approach.

mosh-tudor

@stpp2 This is not really a bug; it's more of a feature. :) Try using clearStyles: https://github.com/GrapesJS/grapesjs/blob/d48e1e34a9fa363dcb83fdcca53a89563db17063/packages/core/src/editor/config/config.ts#L260-L272

stpp2

Yeah clearStyles is already enabled in my case, but that doesn't seem to work well in many cases. Either way I'd expect the Custom Code component to be somewhat "containerized" so it's not leaving anything in the doc when removed.

#6143Sep 10, 2024by rhoenerSBS2 answers
0 reactions

BUG/[QUESTION]: How to correctly wrap a Component on add/mount?

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v128 Reproducible demo link https://jsfiddle.net/fjyk6n4a/2/ Describe the bug Hi @artf, I am currently trying to wrap a component in a section component if its has not been wrapped yet. I am hooking into the compone...

jasonvijayy

Hi @artf, Reproducible Link Iโ€™m also hitting a crash when using component.replaceWith() together with UndoManager. This only happens when replaceWith() is triggered during editor lifecycle events (e.g. change:status, component:selected, co...

GJS Helper

The issue you're facing with the UndoManager stack becoming inconsistent after wrapping a component using component.replaceWith inside the component:mount event is a common challenge when modifying the editor's state in a way that doesn't...

#6142Sep 10, 2024by rhoenerSBS2 answers
0 reactions

Redo of Pages not working properly

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v128 Reproducible demo link https://app.grapesjs.com/studio Describe the bug After adding a Page, removing it with undo and adding back with redo, the page is not working properly. The Layer Manager does not update...

artf

Thanks for the report @rhoenerSBS

GJS Helper

This is indeed a bug in GrapesJS's undo/redo mechanism, specifically when handling page additions and removals. The behavior you've described is consistent with an incomplete restoration of the page's internal state after a 'redo' operatio...

#6116Sep 3, 2024by SamMousa4 answers
4 reactions

AsDocument not working as expected

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 128 Reproducible demo link https://jsfiddle.net/sammousa/bxgsdc12/11/ Describe the bug How to reproduce the bug?Load an HTML string with a non empty <head>, using the option {asDocument: true}.Export the data via ed...

SamMousa

Thank you, but that's not really the point. I'm fully able to make a workaround, but that does not fix the bug. The bug is that an export via getProjectData() followed by an import via loadProjectData() should result in the same state. Fur...

artf

The bug is that an export via getProjectData() followed by an import via loadProjectData() should result in the same state. Yeah definitely not expected, we'll look into it. Appreciate the easily reproducible steps on the demo ๐Ÿ‘

artf

Thanks @SamMousa detailed bug reports are always welcome. If a direction is requested, we're happy to guide you ๐Ÿ™‡โ€โ™‚๏ธ

#6102Aug 31, 2024by Alababdiy3 answers
5 reactions

Traits Not Displayed After Reloading Editor for Custom Component

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome 91VReproducible demo link https://jsfiddle.net/8tsj5vpb/Describe the bug I'm encountering an issue with GrapesJS where traits defined for a custom component are not being displayed after reloading the editor. The trai...

mohamedsalem401

@Alababdiy I was unable to reproduce the issue using the link provided. However, it seems like the issue is that GrapesJS doesn't allow adding or defining a component after it has been initialized.

mohamedsalem401

Hey @Alababdiy, I wasn't able to reproduce the issue you described in the JSFiddle.

GJS Helper

You've encountered a common issue related to how GrapesJS persists and re-identifies custom components after reloading the editor. The traits for your custom component disappear because GrapesJS is not correctly re-associating the loaded c...

#6096Aug 30, 2024by kanaihyakumar4 answers
2 reactions

Resizable Box Disappears on Component Reselection

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfiddle.net/kanaihyakumar/oedg76nt/ Describe the bug Description When selecting any component on the canvas, it highlights the bottom resize box as per the settings. However, upon cli...

kanaihyakumar

Earlier, I needed to be more clearer about the steps to reproduce the issue. Here is the refined steps to produce the issue. Steps to Reproduce the Issue:Click on the section directly.Observe the resizable options displayed.Click in an are...

kanaihyakumar

Trust me, I was lucky that I was able to find this tragic behavior of clicking different places inside section was behaving but different.

artf

I don't see it disappearing if not when you press the click but that is expected as it gets ready to be dragged

#6092Aug 26, 2024by MdShadabAhamad3 answers
0 reactions

@artf , I have a question that , can we implement custom js in studio? means is there any embed js code functionality ?

@artf , I have a question that , can we implement custom js in studio? means is there any embed js code functionality ? Originally posted by @MdShadabAhamad in https://github.com/GrapesJS/grapesjs/discussions/6080#discussioncomment-10449335

artf

@MdShadabAhamad please avoid opening issues from discussion, thanks

icoco

looks no studio source code , where you can find the studio?

GJS Helper

Yes, GrapesJS provides robust functionality to implement and embed custom JavaScript code within your web pages, both for dynamic content on the canvas and for the final exported output. There are several methods to achieve this, depending...

#6087Aug 24, 2024by leo-budgetsimple3 answers
1 reactions

Undo doesn't work after a Component's innerHTML is changed

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Latest Reproducible demo link https://jsfiddle.net/condsjm1/ Describe the bug How to reproduce the bug?Change a Component's innerHTML Press CTRL + Z What is the expected behavior? To undo the content What is the current be...

artf

UndoManager tracks component state changes, not its DOM. This should work in your case element.components('Hello Planet')

leo-budgetsimple

@artf Thanks!

GJS Helper

The issue you're encountering is due to directly manipulating the component's innerHTML property, which bypasses GrapesJS's internal change tracking mechanism. GrapesJS's undo/redo manager (part of the Editor instance) only registers chang...

#6086Aug 23, 2024by jdkcoder3 answers
1 reactions

Cannot read properties of undefined (reading 'lastComponent') & resizable feature not work

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Edge v128Reproducible demo linkshttps://codesandbox.io/p/devbox/github/jdkcoder/cv-builderhttps://stackblitz.com/github/jdkcoder/cv-builder Describe the bug I'm using GrapesJS in Nuxt.js 3 project, the error Cannot read prop...

artf

You can skip removing the components (instance.value.Components.clear()) as you're destroying the editor anyway This shouldn't generate any error

WilliamDASILVA

@jdkcoder By commenting the reRender function we don't have the issue anymore. The lastComponent error comes from the this.get('selected') in Editor being undefined at some point. And by checking the debugger, it indeed becomes undefined w...

GJS Helper

It looks like you're encountering two distinct issues in your GrapesJS Nuxt.js 3 project. Let's break them down and provide solutions. Issue 1: Cannot read properties of undefined (reading 'lastComponent') after clearAll() Root Cause This...

#6081Aug 23, 2024by MdShadabAhamad3 answers
0 reactions

Custom Component not able to visible in grapsJs/studio at first rendering

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? chromeReproducible demo link https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsxDescribe the bug I am not able to see my custom component at the first time of my react application rendering , when i try to sear...

artf

Use the plugins when you want to extend something at the GrapesJS API level

MdShadabAhamad

i also added custom style setupStyleManager but its show blank ,https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsx

GJS Helper

The issue you're experiencing, where your custom component block isn't visible on the first render but appears after searching, is a common timing problem related to how GrapesJS initializes its UI components, specifically the Block Manage...

Browse all topics