GrapesJS Issues

3,464 parsed GitHub issues — 370 solved · 90 open. Search, filter and explore battle-tested answers.

569 issues found

🔍 canvas
#5378September 11, 2023by Sw33tgt4 answers
0 reactions

Uncaught TypeError: Cannot read properties of undefined (reading 'Canvas') while dragging a component in Layer Manager Panel

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v116.0.5845.97 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Select any component from the canvasOpen the Layer Manager PanelSelect the first "Section" componentUse...

Sw33tgt

I downgraded to v0.21.4 and I don't have the issue anymore, so this is only occurring on the latest version available.

padcom

Having the same issue in the simplest examples. Downgrading do .4 makes it go away. Regression?

artf

Yeah fixed already here. I'll push a new release for the end of this week.

#5363September 5, 2023by rozek4 answers
0 reactions

cannot "sort" elements of layer panel

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 When I try to reorder the elements on my canvas by sorting them in the layer panel, I repeatedly get the followi...

arbisyarifudin

Im facing same issue

rozek

Sorter.ts:500 contains const cv = this.em!.Canvas, which is obviously wrong (as em is null or undefined) Unfortunately, I don't currently understand the code with all its abbreviations - but: would a change of line 499 to if (model?.set &&...

artf

Closing as duplicate of https://github.com/GrapesJS/grapesjs/issues/5355

#5355September 1, 2023by andcmatias1 answer
0 reactions

On move layer

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 116 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Open the layer manager and try to move the componentIt will disable the component and show the errors in the consol...

ClaudeCode

Thanks for reporting this, @andcmatias. Great question about On move layer. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() e...

#5354September 1, 2023by rozek4 answers
0 reactions

canvas.script entries do not respect an "import map"

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 scripts referenced by canvas.scripts can not import third-party modules based on an "import map". if the same mo...

artf

https://github.com/GrapesJS/grapesjs/issues/5353#issuecomment-1704023749

rozek

have you tested them? when trying in the current version of GrapesJS, I get the following (expanded) error message in the browser log:

rozek

trying to use a data URI instead of a file reference failed as well

#5353September 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

ClaudeCode

Thanks for reporting this, @rozek. The error error: javascript if (component && typeof component.method === 'function') { // your code } ``` Root cause analysis: The Canvas doesn't validate state before invoking your method. This creates a...

#5352August 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

ClaudeCode

Thanks for reporting this, @rozek. The issue with Uncaught SyntaxError: Unexpected token '{' at CanvasView.ts:590:12 appears to be a race condition or state management timing problem. This typically happens when component lifecycle events...

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

ClaudeCode

Thanks for reporting this, @wsaca. Great question about scrollCanvas doens't work. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on()...

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

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

ClaudeCode

Thanks for reporting this, @AFriboulet-ii. Great question about Undo doesn't refresh class on component. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific mo...

#5316August 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!

ClaudeCode

Thanks for reporting this, @BenKhz. The issue with Editor not subscribing to selector:remove appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modifications ov...