GrapesJS Issues

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

183 issues found

๐Ÿ” documentation
#5408Sep 21, 2023by quentin-bettoum3 answers
0 reactions

Main.scss is missing in 0.21.6

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 118 Reproducible demo link none Describe the bug Hello there, I have themed GrapesJS following the instructions of the doc here: https://grapesjs.com/docs/getting-started.html#theming But with 0.21.6, it's not poss...

joukhar

yeah src folder is missing

artf

Same issue as https://github.com/GrapesJS/grapesjs/issues/5392

GJS Helper

Hello! You've correctly identified a change in how GrapesJS packages its styles starting from version 0.21.x. The main.scss file, along with the entire src/styles/scss directory, is indeed no longer included in the nodemodules/grapesjs fol...

#5388Sep 16, 2023by hannydevelop4 answers
0 reactions

Running Headless Mode Returns Different HTML from Editor

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? ChromeV117.0.5938.62 Reproducible demo link https://codesandbox.io/embed/quizzical-galileo-cqldjh?fontsize=14&hidenavigation=1&theme=dark Describe the bug How to reproduce the bug?Store pages using the store managerTry to...

artf

Hi @hannydevelop you have custom component types but you didn't pass any plugins on grapesjs.init that's why the default div is applied

hannydevelop

Hi @hannydevelop you have custom component types but you didn't pass any plugins on grapesjs.init that's why the default div is applied I'm sorry that I am opening this again, adding the plugin in the normal way returns an error:

artf

@hannydevelop can you please show the code?

#5316Aug 17, 2023by BenKhz3 answers
0 reactions

Editor not subscribing to selector:remove

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v115.0.5790.170 Reproducible demo link https://jsfiddle.net/BenKhz/yfwqc6mu/1/ Referencing The docs hereDescribe the bugOpen Provided fiddle HereSelect a component on canvas and add a class via the selector manager. (...

artf

Hi @BenKhz that's happening because selector* events are related to the global Selectors container (when you remove a selector from the component, the Selector itself is still there as it could be used in other places), if you want to trac...

BenKhz

Ah! I was misunderstanding. Thank you for the clarification. Keep up the good work!

GJS Helper

Thank you for reporting this issue and for your kind words about GrapesJS! You've hit upon a common point of confusion regarding GrapesJS events, and it's an excellent question. Root Cause Explanation The selector:remove event, as document...

#5312Aug 17, 2023by srinivas9772 answers
0 reactions

Issue with rich text editor Indent action for Lists

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome V115Reproducible demo link https://jsfiddle.net/srinivas977/ahgLxv6e/10/Describe the bug How to reproduce the bug? In the provided JSFiddle, include a pair of text lines and select lists. Next, append a sub-list, and...

artf

Unfortunately, as the default implementation relies on the deprecated execCommand, there are too many edge cases to handle and it isn't worth spending time on it anymore. I'd suggest relying on it only for basic formatting (eg. bold, itali...

GJSBlock

Thanks for reporting this, @srinivas977. Great suggestion about Issue with rich text editor Indent action for Lists! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the event...

#5286Aug 8, 2023by saharhagekr2 answers
0 reactions

Border of images and some elements in the wrong position

On smaller laptop screens (macbooks for example), the border of images and some elements are in the wrong position (when i click to move or resize an image) I am not having this issue when the editor gets rendered on bigger screens. I am not sure if there is a config step that i'm missing. Can anyone please assist? Is...

artf

@saharelhage please avoid converting discussions to issues. The GitHub Issues should only be created from here by properly following the template.

GJS Helper

The issue you're experiencing with the selection and resize borders appearing in the wrong position on smaller screens, particularly MacBooks, is a common problem often related to how browsers render content under different scaling conditi...

#5280Aug 7, 2023by fluke7772 answers
0 reactions

Event handler on view not bound to the component

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 115.0.5790.114 Reproducible demo link https://jsfiddle.net/mcraf3se/5/ Describe the bug Hello, just starting with GrapesJS so it is quite likely I am misunderstanding something fundamental. I am struggling w...

artf

The error here is using the arrow function, just replace it with clickOnElement() {

GJS Helper

The issue you're encountering with this being window or undefined inside your custom component's view event handler is a common JavaScript this binding problem, especially when using arrow functions. It's not a bug in GrapesJS but rather a...

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

#5199Jun 23, 2023by rmadeiraneto3 answers
0 reactions

Changes in component's attributes being reproduced in all the instances instead of just one

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v114 Reproducible demo link https://jsfiddle.net/rmadeiraneto/t659usxv/39/ Describe the bug How to reproduce the bug?Go to the blocks list and drag the custom component "example" to the canvasThree elements that are...

artf

Thanks @rmadeiraneto for the report. Yeah, unfortunately that's an issue if you're mutating arrays/objects properties in that way and to avoid that you have 2 options:Avoid direct mutations (assign new references when you have to update th...

rmadeiraneto

@artf using defaults as a function works, thanks for quick response and for providing the alternative fix on this issue. About the first suggestion, I think it's not about people should mutate or not the object, because we're talking about...

GJS Helper

The issue you've described is a common JavaScript pitfall related to how mutable objects (like arrays and objects) are handled when assigned as default values. In GrapesJS, when you define a component with defaults that include arrays or o...

#5175Jun 10, 2023by krishnaeverestengineering4 answers
0 reactions

Move method is not working as expected

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://codesandbox.io/s/adoring-margulis-873kdv Describe the bug Context Move component method doesn't work as expected. This piece of code doesn't work as expected. this piece of code should...

krishnaeverestengineering

Fix for this issue: https://github.com/GrapesJS/grapesjs/pull/5176

artf

Thanks @krishnaeverestengineering but this is actually the expected behaviour for moving the component inside the same parent. This is because the at should account also for the index of the component itself. So, if you try to move "Compon...

krishnaeverestengineering

Thanks @krishnaeverestengineering but this is actually the expected behaviour for moving the component inside the same parent. This is because the at should account also for the index of the component itself. So, if you try to move "Compon...

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

Browse all topics