GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome/Safai/Firefox Reproducible demo link https://grapesjs.com/docs/getting-started.html#layers Describe the bug How to reproduce the bug? Navigate to the GrapesJS Getting Started documentation at this link. Attempt to r...
GJS Helper
You've accurately identified a layout bug in the GrapesJS "Getting Started" demo regarding the resizing of right-side panels. The drifting behavior you observe is indeed not the expected smooth resizing where the panel's right edge remains...
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?my image link https://topkeeoss.cdn.weberss.com/602907992031105024-public/Beige%20and%20Black%20Spaci...
GJS Helper
The issue you're experiencing where adding a background image to an <img> component doesn't seem to work is not a bug in GrapesJS, but rather a common misunderstanding of how background-image CSS property interacts with HTML <img> elements...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox Reproducible demo link https://jsfiddle.net/497zkrpm/1/ Describe the bug How to reproduce the bug?Select the "Hello World" componentOpen the Style Manager and make sure "myclass" is checked in the classes sectionCh...
artf
Not a bug, the style manager handles only one rule at a time, if you want more advanced usage, you can use the API and implement your functionalities (eg. selecting different rules with the same selector)
MaxDBenson
Not a bug, the style manager handles only one rule at a time, if you want more advanced usage, you can use the API and implement your functionalities (eg. selecting different rules with the same selector) I see. Would you mind elaborating...
GJS Helper
The issue you've encountered with the GrapesJS Style Manager not displaying all rules for the same class is a known behavior stemming from how the editor's internal CssComposer and StyleManager interact with CSS rules. While CSS itself all...
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 https://github.com/GrapesJS/components-tabs question one <img width="1421" alt="image" src="https://github.com/GrapesJS/grapes...
artf
Please, open bug issues only if related to the core library, not plugins.
GJS Helper
The issues you're experiencing with cloning tabs and the entire tabs component in GrapesJS, specifically with the grapesjs-components-tabs plugin, stem from how GrapesJS handles component IDs during the cloning process. The grapesjs-compon...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link Version 118.0.5993.88 (Official Build) (arm64) Describe the bug How to reproduce the bug? Video demo part 1: https://github.com/GrapesJS/grapesjs/assets/8781182/bfbbf6ea-7780-417e-880b-6199289...
artf
Thanks @bryanjamesmiller for all the insights, I'll investigate for a fix.
GJS Helper
This is indeed a valid bug report, and you've accurately identified a classic JavaScript pitfall within GrapesJS's block category handling. The issue arises when a custom block category is named after a built-in Object.prototype method. Ro...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome 117.0.5938.152 Reproducible demo link no Describe the bug How to reproduce the bug?... grapesjs pages multiple page in importing css not access... importing css is not working What is the expected behavior? ... What...
artf
Please follow the bug issue template properlyIf you don't indicate a reproducible demo with relative steps to reproduce the bug, the issue might be CLOSED.
GJS Helper
The issue description "multiple pages in importing css is not accessing" and "importing css is not working" is quite vague, but it points to a common misunderstanding of how GrapesJS handles CSS scoping and external stylesheet imports, esp...
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v117.0.5938.149Reproducible demo link https://jsfiddle.net/9oLrsvya/Describe the bug How to reproduce the bug?Please see the pageManager object in the jsfiddle What is the expected behavior? Looking at the following d...
mapsmarketing
One annoying thing is that the editor is prepending the below default styles which when saving the styles has numerous duplicates of it: Edit: Looking at the docs I finally managed to find protectedCss and when set to empty stops the style...
artf
Hi @mapsmarketing currently GrapesJS is not able to properly import HTML documents as string, so the parser skips elements like html, head, body and returns only what is parsed inside the body, one workaround you could do right now is to p...
mapsmarketing
Hi @artf , I've found a way to get the body attributes along with the styles saving correctly via the following method: I noticed that your Page.toJSON outputs everything of the specified page. However, it doesn't seem to output the styles...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 117.0 Reproducible demo link localhost Describe the bug grapesjs": "^0.21.7", editor.loadProjectData({ "assets": [], "styles": [], "pages": [{ "component": "<div>TEST TEST TEST TEST</div>" }] }) editor freeze Code o...
antoinematyja
Hi, I encountered the same issue using Vue 3 and using a vue ref to store the editor. Not sure if this is a good idea though. A code reproduction would be something like: Fix: don't use a ref ๐
artf
Are you able to provide a reproducible demo? Tried your example and I don't see any freeze....
boardmain
tried with the latest version 21.7 i try to put it online, but i just pasted html from a custom command, the source is pasted, but after it, the editor freeze ( i need to close the page ) for example ~~~ btnImp.onclick = () => { editor.run...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 117.0.5938.134 (Official Build) (64-bit) Reproducible demo link https://jsfiddle.net/ap404703/0e5zop1n/ Describe the bug Example as below Grapes Js file :- // Initialize GrapesJS const editor = grapesjs.init({ canv...
artf
@ChiragS-Prajapati you have to use draggable/droppable component properties to control where components could be dragged and what components can be dropped inside.
GJS Helper
The issue you're encountering, where one section block can be dropped inside another, is a common behavior in GrapesJS by default. GrapesJS treats HTML elements like <div> and <section> as containers, allowing other components to be nested...
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome Reproducible demo link https://jsfiddle.net/a3xgLm7c/3/ Describe the bug How to reproduce the bug?Select the text and apply the text colorSelect the same text and apply the background color What is the expected beha...
mapsmarketing
Hi @kishanp102 , I tried to reproduce the issue with the steps described but both the text and background colours are being applied (please see screenshot). <img width="318" alt="image" src="https://github.com/GrapesJS/grapesjs/assets/7955...
kishanp102
Drag and drop the text component then apply the font color and click outside again click on the text and put the background color it is not applying screencast-jsfiddle.net-2023.10.11-091942.webm
mapsmarketing
Yep, you are right @kishanp102 it doesn't apply a new background colour on it after you've already set one. It's definitely a bug.