GrapesJS Issues

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

220 issues found

๐Ÿ” canvas
#5353Sep 1, 2023by rozek3 answers
0 reactions

Canvas.script entries can not be JS modules

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64)Reproducible demo link noneDescribe the bug links entered into can not refer to JavaScript modules, or you may run into the following error: This makes it r...

artf

rozek

good to know, thanks

GJS Helper

The issue you're encountering, "Uncaught SyntaxError: Cannot use import statement outside a module," arises because the canvas.scripts option in GrapesJS injects script URLs using standard <script> tags. By default, browsers treat these as...

#5352Aug 31, 2023by rozek3 answers
0 reactions

Uncaught SyntaxError: Unexpected token '{' at CanvasView.ts:590:12

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 1.56.20 Chromium: 115.0.5790.171 (Offizieller Build) (arm64) Reproducible demo link none Describe the bug I have a component type with a script When previewing a project using a component of this type, GrapesJS cre...

rozek

that's interesting: defining a separate function and defining the component type as described in the docs works as designed. But it still sounds strange, that an inline function produces a syntax error in the exported HTML...

artf

@rozek good catch, will fix for the next release

GJS Helper

The Uncaught SyntaxError: Unexpected token '{' you're encountering stems from how GrapesJS processes and embeds component scripts defined using the ES6 method shorthand syntax. This issue is a known behavior when the script property is def...

#5342Aug 26, 2023by wsaca1 answer
0 reactions

ScrollCanvas doens't work

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 116.0.3 Reproducible demo link https://grapesjs.com/demo-mjml.html Describe the bug How to reproduce the bug?On the canvas scroll to the bottom and select a componentOpen the layersSelect a component that is at the...

GJS Helper

You've accurately identified a bug in GrapesJS where the scrollCanvas functionality fails to scroll the canvas to bring a selected component into view, particularly when selecting components from the Layers panel. This issue is reproducibl...

#5334Aug 24, 2023by DreamCloudProject4 answers
1 reactions

Selection of custom component type not working in the canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome, Opera, Edge, etc Reproducible demo link https://jsfiddle.net/crszh0jo/6/ Describe the bug I'm trying to make it work the same case as it described here [[QUESTION] Selection of custom components not possible from c...

DreamCloudProject

@artf Yes, you're right. I'm blocking the click propagation, and so the editor doesn't receive the click event, hence can't execute the logic to select the element. I tried setting the click propagation only on the current element by repla...

DreamCloudProject

https://github.com/GrapesJS/grapesjs/assets/7961936/12180b41-4c29-489d-9bcd-1ea025a96a8f This example shows how it works in my editor.

yatoogamii

Hi @DreamCloudProject , it seems like your component Msc-header is locked. it's an attribute which allow the component to be clicked from the layers but not from the canva itself Can you share or verify your component definition and check...

#5319Aug 18, 2023by AFriboulet-ii2 answers
0 reactions

Undo doesn't refresh class on component

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome V116.0.5845.96 Reproducible demo link https://jsfiddle.net/Adrien_Friboulet/npdkshaf/8/ Describe the bug https://github.com/GrapesJS/grapesjs/assets/128728949/e85b65c4-53ad-43d0-9f5f-74dc0a181dd0 How to reproduce th...

artf

Thanks @AFriboulet-ii I will fix it for the next release.

GJS Helper

The issue you've described is a known behavior in GrapesJS where the undo manager correctly reverts the component's model attributes (including its classes collection), but the ComponentView responsible for rendering the component on the c...

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

#5305Aug 13, 2023by rajevar2 answers
0 reactions

"component:add" event triggers when components are moved

GrapesJS version 0.21.4[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome Version 113.0.5672.63 Reproducible demo link https://jsfiddle.net/szLp8h4n/11/Describe the bug How to reproduce the bug? Move any of the text components around in the page. An alert will be displayed. could be...

artf

Hi @rajevar I think you're looking for component:create event, as component:add works as expected (eg. might be used to track any new movement inside a specific component)

GJS Helper

You've correctly identified a common point of confusion with GrapesJS event handling. The component:add event indeed triggers not only when a new component is dragged from the blocks panel onto the canvas but also when an existing componen...

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

#5274Aug 3, 2023by wunksert4 answers
1 reactions

Parser bug inside Remix

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v114 Reproducible demo link https://github.com/wunksert/remix-grapes-error/tree/main Describe the bug How to reproduce the bug?Clone repo abovenpm inpm run dev you'll see that the grapes iframe and boilerplate is re...

artf

@wunksert it seems like the editor initializes on itself multiple times, are you properly clearing the editor instance with destroy (eg. in your useEffect)?

wunksert

It might turn out that a fix for this is more simply solved by me editing structure or naming conventions in my project. Happy to do that if it's faster than changing something in GrapesJS core.

artf

yeah definitely not related to the core

#5268Aug 2, 2023by SLain1233 answers
0 reactions

Autoplay for youtube or vimeo doesn't work

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v115 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Drag and drop video component to canvas.Select youtube or vimeo and add video id.Activate autoplay checkbox.Publis...

SLain123

I can fix the bug myself, but I can't push my branch with fix to repo. It seems like I don't have permission for pushing or create new branch.

artf

@SLain123 you have to create a PR from your fork https://stackoverflow.com/questions/38918942/pull-request-from-a-different-repository

GJS Helper

The issue you're experiencing with YouTube and Vimeo autoplay not working in GrapesJS is not a bug in GrapesJS itself, but rather a consequence of modern browser autoplay policies. Browsers like Chrome, Firefox, and Safari have implemented...

Browse all topics