GrapesJS Issues

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

220 issues found

πŸ” canvas
#4247Apr 7, 2022by gustavohleal2 answers
0 reactions

Components disappearing/not being rendered at cloning, moving or adding

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chromium v96 Reproducible demo link https://grapesjs.com/demo-mjml.html Describe the bug How to reproduce the bug?Add a one column componentSelect the columnClick the copy button on the toolbarRepeat the steps 2 and 3 with...

artf

Sorry but demo-mjml is a plugin and not related directly to the core. As I see no issues with the default renderer of components that might be related to the mjml renderer of components and I have no reason to keep this issue open. Despite...

GJSBlock

Thanks for reporting this, @gustavohleal. Great question about Components disappearing/not being rendered at cloning, moving or adding. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJ...

#4208Mar 22, 2022by ronaldohoch4 answers
2 reactions

Style click state bug in every element

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Brave Last, tested on chrome last and Safari Last. Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?I have a video: https://www.loom.com/share/508e91098bf247bd93d525f2efa00a36...

artf

Thanks for the report @ronaldohoch This will be fixed in the next release.

ronaldohoch

@artf worked! Thank you 😊

ronaldohoch

@artf I couldn't run it locally because several tests didn't pass, is it like that with you too? Can I try to fix them? e.g.:

#4196Mar 15, 2022by shelendravashishtha24 answers
0 reactions

Ids gets changed while trying to set components on the canvas using json

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link no link Describe the bug How to reproduce the bug?... use a demo json that can generate some component on the canvas, set an id in attributes ... use editor.setComponents(json)... set style us...

artf

Hi @shelendravashishtha2 can you please indicate the exact steps (I need to know what is the json you're referring to)

JonathanRiche

I've seen this happen to if you don't save a reference to the CSS before using the editor.setComponents() method All of the CSS markeup from the elements id selector/reference is removed when using editor.setComponents() method The exact s...

JonathanRiche

I think I found the issue on my end using editor.getComponents().toJSON(); adds an empty "style":"" field to some of the components which is clearing out there CSS ie "components": [ { "type": "box", "style": "", "attributes": { "id": "ic7...

#4192Mar 11, 2022by drashtibpatel2 answers
0 reactions

Drag boundary issue with dragMode: absolute/translate

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome, firefox Reproducible demo link https://jsfiddle.net/drashti/9xk5ph8j/1/ Describe the bug I am using the Grape JS builder for my client to setup the builder and templates. For that I want the setDragMode "absolute o...

artf

No, at the moment is not possible. The dragMode is not real public and documented feature so I'm collecting all the issues and features to support here: https://github.com/artf/grapesjs/issues/3770#issuecomment-944915841

GJSBlock

Thanks for reporting this, @drashtibpatel. The issue with Drag boundary issue with dragMode: absolute/translate appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and D...

#4188Mar 9, 2022by levinhtin1 answer
0 reactions

SVG <linearGradient> tag become <lineargradient> in canvas

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Microsoft Edge Version 99.0.1150.30 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?I have created a custom block with SVG, ex:When I drop component into canvas, linearGradie...

GJSBlock

Thanks for reporting this, @levinhtin. Great question about SVG <linearGradient> tag become <lineargradient> in canvas. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation...

#4175Mar 3, 2022by sandeepyerkala2 answers
0 reactions

Offset lines are missing when reload frame

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 99.0.4844.51 Reproducible demo link https://jsfiddle.net/rakam/5o8te64y/19/ Describe the bug How to reproduce the bug?Add few components.After adding, reload frame by clicking on the right context menu.Offset lines...

artf

Sorry but I don't see right now any point of supporting/fixing the native reload of the iframe.

GJSBlock

Thanks for reporting this, @sandeepyerkala. Great question about Offset lines are missing when reload frame. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for your specifi...

#4157Feb 24, 2022by Adham3803 answers
0 reactions

Resizing canvas makes componenents end up with wrong positions once exported with dmode 'absolute'

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Microsoft edge 98.0.1108.56 Reproducible demo link https://jsfiddle.net/473b2tah/1/ Describe the bug The canvas resize is cool but does not take into account that one might be working with px offsets because of dmode which...

Adham380

I have sort of found a workaround... Set the .gjs-frame-wrapper to the desired width in CSS and transform: translate (- x px, 0px) for the iframe in CSS. The Canvas is not the correct width then (slightly smaller) but everything seems to w...

artf

https://github.com/artf/grapesjs/issues/3770#issuecomment-1059784514

GJSBlock

Thanks for reporting this, @Adham380. The issue with Resizing canvas makes componenents end up with wrong positions once exported with dmode 'absolute' appears to be a race condition or state management timing problem. This typically happe...

#4138Feb 12, 2022by yadavAtIrisdame4 answers
0 reactions

Unexpected behavior in style manager

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Version 1.35.101 Chromium: 98.0.4758.87 (Official Build) (64-bit) Reproducible demo link https://codesandbox.io/s/strange-sun-qgdcq?file=/index.jsDescribe the bug How to reproduce the bug?drop the component in canvasselect t...

artf

Thanks for the report @yadavAtIrisdame but I'm not able to reproduce it from your demo or the official one. Can you describe the exact steps?

yadavAtIrisdame

@artf I'm unable to reproduce this bug. in most cases, The Style Manager works as expected. but, all of a sudden, they start acting like(shown in image). Particularly margin and padding properties.

artf

Sorry but unfortunately without the proper reproducible demo, I can't do much. I'll be happy to fix it if anybody is able to provide the reproducible steps.

#4127Feb 5, 2022by jcsofts1 answer
0 reactions

[X] I confirm to use the latest version of GrapesJS

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 97.0.4692.99 (Official Build) (x86_64) Reproducible demo link no Describe the bug How to reproduce the bug?...... What is the expected behavior? ... What is the current behavior? get errors when use the ifra...

GJSBlock

Thanks for reporting this, @jcsofts. Great question about *. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() event listener...

#4116Feb 1, 2022by saudAtIrisdame4 answers
0 reactions

Flex Property not working in style manager

GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Version 1.34.81 Chromium: 97.0.4692.99 (Official Build) (64-bit) Reproducible demo link https://codesandbox.io/s/strange-sun-qgdcq?file=/index.js Describe the bug How to reproduce the bug?create custom type componentdrop t...

Vac1911

I diagnosed the issue after finding the same problem independently. Looking at StyleManager.select() https://github.com/artf/grapesjs/blob/75cd582a8d1a91096276bc4dccc7475a269ad45c/src/style_manager/index.js#L339-L395 On line 369, every pro...

saudAtIrisdame

@Vac1911 @artf I got it, but what's the solution, how can I fix this problem? is this grapejs issue or mine?

Vac1911

@saudAtIrisdame It seems to be a grapejs issue. I fixed it for myself changing the source code, reordering the select method to check visibility last. Here is the dist file after running build:js https://gist.github.com/Vac1911/4c89f2a4880...

Browse all topics