GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? any Reproducible demo link no Describe the bug Since the move from artf to GrapesJS I believe many links are still to the original repo https://github.com/GrapesJS/grapesjs/search?q=artf Should I try to replace it or do we...
lexoyo
I did a PR, I hope I didn't miss anything, I had to test almost each link
artf
I think some stuff are redirecting but others might be broken, I'd appreciate a PR if anyone is willing to help π
GJSBlock
Thanks for reporting this, @lexoyo. The issue with broken links in the docs appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modifications overlap, creating a...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome v108.0.5359.98 Reproducible demo link https://codesandbox.io/s/grapes-js-template-literal-forked-6kgvrb?file=/src/App.js Describe the bug I'm trying to create a custom component that recognizes inner html component...
artf
Read carefully this guide, everything inside script is outside of the editor scope. You can update the component itself by using component.components method or specify the components: '<div ....' directly in definition.
GJSBlock
Thanks for reporting this, @panditlakshya. Great question about Grapesjs fails to recognize component types when setting innerHTML through script.. The recommended approach with Canvas is to use the event-driven API. Start here: Check the...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome LatestReproducible demo link https://codesandbox.io/s/silent-river-ifczcvDescribe the bug How to reproduce the bug?Visit the siteSee console. Pay attention to the * and body selector Expected result Should not be dupl...
artf
There are default styles applied that you can simply disable (pass an empty string) https://github.com/GrapesJS/grapesjs/blob/a83847b1b35e69e5a5810ccf1eb1e1384bf0aab1/src/editor/config/config.ts#L143-L147
GJSBlock
Thanks for reporting this, @handhikadj. Great question about setStyle/getCss() produces duplicated css. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for your specif...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Edge 109.0.1518.70 Reproducible demo link https://jsfiddle.net/rudacs/kr2x1mnh/ Describe the bug How to reproduce the bug?Change some property in StyleManager.Change the width property on the StyleManager. What is the expe...
artf
Hey @rudacs did you try instead using style:property:update?
rudacs
This event worked. Was it changed to this one? And for a single property? How do I get what was the component and property changed? Tranks.
SagarMaria
came here because I have the same issue. Using the suggested style:property:update seems to work, but for some reason it fires on every click. Also, how can we target a particular style property change, i.e. text-align?
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 109.0.5414.87 Reproducible demo link https://jsfiddle.net/o45ncveu/6/ Describe the bug How to reproduce the bug?open fiddle linkhover for some components before the time-outwait the time out to add a margin and chan...
artf
Unfortunately this is expected, you have to use editor.refresh() after "external" layout changes.
GJSBlock
Thanks for reporting this, @LukasSouza. Security and dependency issues are important. The GrapesJS team actively works on keeping dependencies up-to-date. For you right now: Run npm audit fix to see available patches Check for a newer Grap...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v108Reproducible demo link https://grapesjs.com/demo.htmlDescribe the bug How to reproduce the bug?Setup grapesjs editorImport following template https://pastebin.com/d9S2M0iSAt the very bottom of the template you wil...
artf
You just need to enable this option: https://grapesjs.com/docs/modules/Selectors.html#component-first-selectors
GJSBlock
Thanks for reporting this, @zoilorys. Great question about Editing CSS property sets a style to a common class instead of element. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS do...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Brave last version Reproducible demo link https://grapesjs.com/demo Describe the bug How to reproduce the bug?Open the demo pageOpen the developer toolsRun: let projectData = editor.getProjectData()Run: editor.DomComponent...
allenhwkim
@ronaldohoch with Edge browser, it works with the command you provided. let projectData = editor.getProjectData(); editor.DomComponents.clear(); editor.loadProjectData(projectData); I don't think GrapesJS support Brave browser, which is no...
ronaldohoch
I also run the command editor.runCommand("core:component-outline") and it didn't shows again, i needed to click on the button twice to make it appear
ronaldohoch
Hi @allenhwkim, thanks for the comment. But embarrassing I didn't test it in other browsers. I believe my customers don't use Brave, so I'm going to drop that part. However, doing all these tests, I managed to make it work the way I want,...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome 108.0.5359.125Reproducible demo link https://codesandbox.io/s/frosty-darkness-7po7xlDescribe the bug How to reproduce the bug?use myBlockclick test button What is the expected behavior? this.on("change:list1", this.ha...
artf
Listeners don't see deep changes so you have to create a new array in that case
chaegumi
Thanks @artf. I use JSON.stringify and JSON.parse to deal my data.
GJSBlock
Thanks for reporting this, @chaegumi. Great question about this.on('change:attributes:type', this.handleTypeChange) do not support array type. The recommended approach with Components is to use the event-driven API. Start here: Check the G...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox v91.4.1 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Go to the grapesjs basic demo: https://grapesjs.com/demo.htmlClear the canvasAdd a component LinkExecute edito...
artf
This is expected due to some logic related to the rich text editor. You can use component.getInnerHTML() to get the inner HTML or component.components() to get inner components.
GJSBlock
Thanks for reporting this, @NicoGGG. Great question about Component content is set to empty string after inline editing. The recommended approach with Canvas is to use the event-driven API. Start here: Check the GrapesJS documentation for...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 109 Reproducible demo link https://grapesjs.com/demo.html Describe the bug Hello, I noticed that when I load multiple pages in the projectData that have the same id used in the HTML, grapes will automatically incre...
artf
hey @bgrand-ch I think one day all grapesjs entities will have a global uid, so in long-term, I'd expect this issue to be fixed π€
quentin-bettoum
At first, I wanted to generate all the pages together to have a single CSS output for all the pages. But now I'm trying another solution for the styles. So for the id problem, generating each page separately could be a solution. Thanks for...
bgrand-ch
Grapes to use some data attributes (something like data-grapes-id) as unique identifiers to leave the id free for some frontend scripts. I like this idea π―