GrapesJS Issues

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

877 issues found

πŸ” question
#5354Sep 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

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

#5346Aug 30, 2023by pittleCheung3 answers
0 reactions

Deleting a component without deleting its corresponding style

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? latest version of Chrome Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug? <img width="1665" alt="image" src="https://github.com/GrapesJS/grapesjs/assets/114127651/657cbaf6-7e...

pittleCheung

Extended idea from https://github.com/GrapesJS/grapesjs/issues/1855

artf

Here it's explained how to create components with related styles https://grapesjs.com/docs/modules/Components.html#components-css Only in that case, it would be safe for the editor to delete related styles.

GJS Helper

The issue you're encountering, where deleting a component does not remove its corresponding styles, leading to redundant CSS, is a common challenge in web builders like GrapesJS. This behavior is by design in GrapesJS's CssComposer for sev...

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

#5339Aug 26, 2023by rozek2 answers
0 reactions

DragMode:'absolute' behaves strange

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 I want the components in my editor to be moveable by dragging. After some research, I found that is needed to ac...

rozek

sorry - this was a problem on my side which became obvious within the editor only - sorry for bothering!

GJS Helper

The issue you've described with dragMode: 'absolute' causing components to appear offset is indeed a bug stemming from a fundamental HTML violation: duplicate id attributes within the DOM. Your analysis and screenshots accurately pinpoint...

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

#5331Aug 24, 2023by rozek3 answers
0 reactions

Color picker may extend viewport

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 This bug is similar to issue #596 which has been locked because of a lack of conversation. This version may...

artf

Thanks @rozek the PR is always welcome, so I'll be happy to review it.

artf

Closing for now as it doesn't seem to be reproducible

GJS Helper

Thank you for reporting this issue and providing such a detailed analysis and a working solution! You've accurately identified a common UI problem where dynamically positioned elements, like a color picker, can extend beyond the viewport b...

#5330Aug 24, 2023by rozek3 answers
0 reactions

Latest version (commit 4f0c5b1) no longer compiles without errors

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? none Reproducible demo link none Describe the bug yarn build fails with two errors: This may just be a problem with TypeScript being too picky, becauseyou may disable the error messages using // @ts-ignore and compile agai...

artf

Thanks @rozek I'll fix it now

rozek

thank you very much!

GJS Helper

Thank you for reporting this issue. You've accurately identified a TypeScript compilation error (TS2532: Object is possibly 'undefined') occurring in the test/specs/utils/Sorter.ts file when running yarn build on GrapesJS commit 4f0c5b1. R...

#5328Aug 22, 2023by sdimitrenco2 answers
0 reactions

Editable text after remove focus of RTE, returns back previous state of content.

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfiddle.net/sdimitrenco/wao1rh0q/30/ Describe the bug That is my components struct If I change the text in the span tag in the text editor, then remove focus from that word, it return...

artf

You shouldn't have "content" inside your text span, indeed if you replace it with "components": "[email protected]", it will work properly.

GJS Helper

The issue you're experiencing, where editable text within a nested span (a text component) inside a link component reverts to its previous state after losing focus, is a known synchronization challenge in GrapesJS when dealing with nested...

Browse all topics