GrapesJS Issues

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

336 issues found

๐Ÿ” style-manager
#5232Jul 11, 2023by bgrand-ch4 answers
5 reactions

Worker - Headless "document is not defined"

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? 114.0.5735.133 Reproducible demo link Impossible to add a worker to reproduce. Describe the bug How to reproduce the bug?Add a web worker.Initialize GrapesJS with "headless" option inside the worker.Add a plugin with "edit...

artf

Hi @bgrand-ch unfortunately everything that involves the parser (HTML/CSS) requires the DOM related API to be available. For the CSS maybe you can try to use parser-postcss plugin, I'd expect it to work in the worker environment

bgrand-ch

Hi @artf, thanks a lot for your quick answer ๐Ÿ˜„ I will try this week.

bgrand-ch

@artf The Post CSS parser plugin works perfectly in a web worker! Thanks for your help.

#5229Jul 10, 2023by joukhar4 answers
1 reactions

Textnode with content "null" is rendered as "null" not whitespace

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome Version 114.0.5735.199 (Official Build) (64-bit)Reproducible demo link N/ADescribe the bug How to reproduce the bug?Drop this component <div class=\"flex items-center rounded shadow-md overflow-hidden max-w-xl relativ...

artf

Probably in the first week of August

artf

Hi @joukhar is it happening with the latest version? I'm able to see nulls in the export code if I use your exact JSON example (that should be fixable), but I'm unable to generate those textnodes with nulls by using your HTML example, can...

joukhar

thanks for the replay, if you need demo so please give me some time until i make one , i will comment again when im finished it the problem happens only when u store it and load it, but when u drop the component for the first time nothing...

#5221Jul 7, 2023by Staubgeborener2 answers
0 reactions

Desktop Version on incorrectly mobile device

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Safari 16.5Reproducible demo link https://grapesjs.com/demo.html https://staubgeborener.de/Describe the bug I was trying out the official demo. I changed nothing, but simply click the view code button and download the html a...

artf

This is not related to the core but simply a missing meta tag in the exported HTML from the demo.html If you want to submit a PR I'll be happy to merge it there

GJS Helper

The issue you're experiencing is not a bug in GrapesJS itself, but rather a common oversight when deploying responsive web pages. The root cause is the absence of the viewport meta tag in the <head> section of your exported HTML file. Root...

#5207Jun 28, 2023by gxanshu3 answers
1 reactions

Duplicated CSS while multi page creation

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/s/withered-bush-wv29dx?file=/index.js Describe the bug How to reproduce the bug?... create multi pages in grapesjs.init()... check the styles of each page What is...

artf

This is intentional and I'm not planning to change this behaviour as you can easily create specific CSS selectors if you need different styles per page. The big benefit of this approach is to allow reusing selectors across pages.

hasan-aa

I think I'm experiencing an issue with this approach. I'm saving the pages to server like this: and loading them like this in a loop: The css rules targeting ids are working fine, but the rules with a class are duplicating even when loaded...

GJS Helper

The issue you're encountering with duplicated CSS across multiple pages in GrapesJS is a common point of confusion related to how GrapesJS manages styles globally within an editor instance. By default, GrapesJS's CssComposer (the component...

#5184Jun 14, 2023by acantepie2 answers
1 reactions

Toolbar of ckeditor components is not correctly refreshed

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 113.0.5672.126 (Build officiel) (64 bits)Reproducible demo link https://grapesjs.com/demo-newsletter-editor.htmlDescribe the bug How to reproduce the bug?Go on demo website : https://grapesjs.com/demo-newsletter-edit...

artf

Thanks @acantepie please open the issue in the proper repo as this is not core related one

GJS Helper

The issue you're encountering, where the Rich Text Editor (RTE) toolbar in GrapesJS doesn't correctly refresh its state (e.g., bold, italic buttons) when switching between multiple text components, is a known synchronization challenge. Thi...

#5173Jun 9, 2023by FaisalShaikhHA3 answers
1 reactions

Editor.Css.setRule API not working as expected, it is not updating the rule existing rule.

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 112.0.5615.137 (Official Build) (arm64) Reproducible demo link https://jsfiddle.net/yhj6qa1u/6/ Describe the bug How to reproduce the bug?Select a component and add some style using Style Manager.Use editor.Css.set...

artf

Hi @FaisalShaikhHA this is expected behaviour but I guess the documentation of setRule is a bit misleading. The rule is actually updated (it doesn't create a new one with the same selector) but styles are simply replaced. This is what you...

FaisalShaikhHA

Thanks @artf for the clarification

GJS Helper

The behavior you're observing with editor.Css.setRule is not a bug but rather how the GrapesJS CSS Composer API is designed to handle rule updates. When you call editor.Css.setRule(selector, styleObject), if a rule with that exact selector...

#5156May 31, 2023by loclovepop3 answers
0 reactions

Cannot drag drop in mobile screen even add grapejs-touch

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome, IOSReproducible demo link https://www.lovepoptestsite.com/products/disney-s-hocus-pocus-black-flame-candle-pop-up-card?variant=40356218077273&preview_link=124907487321 password: ilovecardsDescribe the bug How to repr...

loclovepop

screencast-www.lovepoptestsite.com-2023.06.01-001711.webm This is video of bug

artf

I see the touch plugin works properly, ensure to have the mobile device enabled on load (eg. not simulated post load) so the polyfill could be loaded properly.

GJS Helper

The issue you're experiencing with drag-and-drop not working on mobile screens when GrapesJS is embedded in your "test store" environment, despite using grapesjs-touch, is a common problem in complex web applications. It typically stems fr...

#5154May 31, 2023by jmtt894 answers
6 reactions

TS2416: Property '_up' in type 'PropertyStack' is not assignable to the same property in base type 'PropertyComposite<PropertyStackProps>'

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? ---- Reproducible demo link https://codesandbox.io/p/sandbox/pensive-browser-mfhxp8 Describe the bug How to reproduce the bug?Create Angular ProjectAdd grapeJS dependencyinclude "allowSyntheticDefaultImports": true on tsco...

marktamis

I copied over some of the settings of the tsconfig from a working vite gjs project into my stenciljs project and now it is running correctly. I think you need to do some tweaking to your angular tsconfig and it should not throw the error a...

Deepakanandrao

"skipLibCheck": true, did the trick. Thank you @marktamis ๐Ÿ‘

artf

Yeah "skipLibCheck": true is necessary here until I find the fix for that TS output ๐Ÿ˜ž

#5135May 22, 2023by duclet2 answers
0 reactions

Incorrect type definition for StyleManager.addProperty

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? All Reproducible demo link None Describe the bug How to reproduce the bug?Per the definition here: https://github.com/GrapesJS/grapesjs/blob/dev/src/stylemanager/index.ts#L304, you should be providing the options as option...

SachinPuthiyoth

Seems like the type definition in StyleManagerConfig.sectors is unchanged : https://github.com/GrapesJS/grapesjs/blob/5c890449a52f526bc480d6dc649ff5e01ec59140/src/stylemanager/config/config.ts#L8 Shouldn't we be updating this to use Proper...

GJS Helper

Thank you for reporting this issue. Upon reviewing the GrapesJS source code, specifically the dev branch and the latest stable release (0.21.10), it appears that the PropertyProps interface does include the options property. Therefore, the...

#5131May 20, 2023by sdimitrenco2 answers
0 reactions

After JSON.stringify Components have not all fields

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? ChromeReproducible demo link https://jsfiddle.net/sdimitrenco/rn8u4pc0/7/Describe the bug I'm not sure it's a bug or not, but for me, behavior look strange I have a component List that includes, component ol and component li...

artf

If the property is of the same value as the default definition, it's skipped. This is controlled by avoidDefaults config option and it's highly recommended to keep it true to have small JSONs as possible.

GJS Helper

This behavior is not a bug but an intentional optimization within GrapesJS, which leverages Backbone.js models. When you serialize GrapesJS components to JSON, attributes that match their default values for that specific component type are...

Browse all topics