GrapesJS Issues

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

743 issues found

๐Ÿ” bug
#6250Oct 23, 2024by maxming23332 answers
0 reactions

Clone page prompt 'Converting circular structure to JSON'

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome 129.0.6668.101Reproducible demo link https://grapesjs.com/demoDescribe the bug How to reproduce the bug? open https://grapesjs.com/demo run this script in DevTools: What is the expected behavior? Successfully copied w...

maxming2333

In addition to the above method, is there any other way to copy the page?

GJS Helper

The TypeError: Converting circular structure to JSON you're encountering when cloning a GrapesJS page's main component and adding it to a new page is a common issue related to how GrapesJS components are serialized for storage. This happen...

#6249Oct 23, 2024by yashvi20263 answers
0 reactions

Intialized custom color picker

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? ChromeReproducible demo link ---Describe the bug editor.getModel().initBaseColorPicker(DomElement, { / spectrum options / }); after initailization when the palete opens i want to set a color to it ? @artf Code of Conduct[X]...

NeonLexie

This looks interesting. I wouldn't mind taking a crack at it.

yashvi2026

GJS Helper

To set an initial color for a custom color picker initialized with editor.getModel().initBaseColorPicker(), you need to pass the color option within the Spectrum.js options object. GrapesJS's initBaseColorPicker method internally uses Spec...

#6248Oct 22, 2024by Frubl2 answers
1 reactions

ShowOffsets bug when iframe body has zoom

GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfiddle.net/a2hbxg0y/1/ Describe the bug How to reproduce the bug?Open dev tools and write element style for iframe body - zoom: n; What is the current behavior? When hovering over an...

artf

You shouldn't edit the zoom of the iframe, use the native API

GJS Helper

You've identified a specific bug in GrapesJS related to the showOffsets feature when the iframe body has a CSS zoom property applied. This is a valid observation, and I can confirm the behavior you described. Issue Confirmation When zoom i...

#6211Oct 11, 2024by jlafosse4 answers
0 reactions

Too much recursion

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 131.0.2 Reproducible demo link https://grapesjs.com/demo-newsletter-editor.html Describe the bug How to reproduce the bug?Go to the grapesjs demo, then import the following html:Open your browser console.Rapidly cl...

artf

Hey @jlafosse thanks for the report. I'd not expect that issue with the latest version: <img width="123" alt="Screenshot 2024-10-21 at 19 00 04" src="https://github.com/user-attachments/assets/ff074a31-cd19-4547-bb27-596c92e16d64"> Can you...

jlafosse

Indeed, that appears to have fixed the issue! Thank you!

artf

๐Ÿ™Œ closing then, thanks ๐Ÿ™‡โ€โ™‚๏ธ

#6202Oct 9, 2024by klipto-inc2 answers
0 reactions

Javascript CDN not working on grapejs canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? 129 Reproducible demo link https://grapesjs.com/demo Describe the bug const newEditor = grapesjs.init({ fromElement: true, // Allow components from HTML container: "#editor", canvas: { scripts: [ "https://cdn.jsdelivr.net/...

artf

@klipto-inc please create the bug report with a proper reproducible live demo

GJS Helper

The issue you're encountering with Preline.js not working on the GrapesJS canvas, despite being included via canvas.scripts, is a common timing problem with UI libraries that rely on DOMContentLoaded for initialization. Root Cause Many Jav...

#6180Sep 30, 2024by padcom4 answers
1 reactions

Trait's `setValue()` method not called when value changes

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome latest Reproducible demo link https://codesandbox.io/p/sandbox/withered-rgb-xmw8gk Describe the bug How to reproduce the bug?Open code sandboxSelect "body" (type: 'wrapper') - observe alert about getting value from...

padcom

Thank you! I verified and it is working as expected!

padcom

From what I can see the Trait.setValue() is not called when the value comes from an input. Instead the setTargetValue() is called which doesn't check if the setValue() method of the trait definition is there. Also, the Trait.setValue() che...

padcom

I tried following this discussion to get it working but as you can see in the sandbox it just doesn't work.

#6172Sep 25, 2024by yashvi20262 answers
0 reactions

Need dark theme support in editor

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link --- Describe the bug It would be great if you add theme switching in the editor, allowing me to toggle between dark and light themes based on my preference.Code of Conduct [X] I agree to follo...

artf

Please use the discussions instead of bug issues

GJS Helper

GrapesJS does not come with a built-in dark/light theme switcher, as its UI is highly customizable via CSS. However, you can easily implement dark theme support by leveraging GrapesJS's extensive use of CSS variables and by toggling a cust...

#6171Sep 24, 2024by rhoenerSBS2 answers
0 reactions

Track custom storable with UndoManager

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v129 Reproducible demo link not applicable Describe the bug HI @artf, I am currently implementing an editor with grapesjs in which it is possible to add chapters alongside the already existing pages. I implemented a...

artf

Hey @rhoenerSBS please avoid opening bug issues for questions.

GJS Helper

The GrapesJS UndoManager primarily tracks changes to the editor's core models (components, styles, pages, assets) by listening to specific events, notably change:state. To make it track changes to your custom ChapterStorage module, which i...

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

Browse all topics