GrapesJS Issues

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

336 issues found

πŸ” style-manager
#4434Jul 10, 2022by Singwai2 answers
1 reactions

CSS Parser's shape doesn't allow the CSS property to be defined more than once.

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? AnyReproducible demo link https://grapesjs.com/demo.htmlDescribe the bug The bug is related to ParserCss.js. https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserCss.js#L7-L8 The parser expects the results to be...

artf

Yeah, this is something we don't support currently, but I think it might be nice to handle also those cases.

GJSBlock

Thanks for reporting this, @Singwai. The issue with CSS Parser's shape doesn't allow the CSS property to be defined more than once. appears to be a race condition or state management timing problem. This typically happens when component li...

#4432Jul 9, 2022by booellean2 answers
0 reactions

Undo Manager creates Duplicate CSS during custom command

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? 103.0.5060.66 (Official Build) (64-bit) (cohort: Stable) Reproducible demo link https://codesandbox.io/s/cranky-morning-fh5diz?file=/index.js Describe the bug How to reproduce the bug?Drop the custom block "picture" into t...

artf

I'm not sure exactly what is happening but I'd suggest switching to styleable:change event and pass its options to setStyle, eg.

GJSBlock

Thanks for reporting this, @booellean. Great question about Undo Manager creates Duplicate CSS during custom command. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation f...

#4413Jun 27, 2022by YaseenHajajweh2 answers
1 reactions

StyleManager.addProperty , type: 'select' , Cannot read properties of undefined (reading 'replace')

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome Version 103.0.5060.53 (Official Build) (x86_64)Reproducible demo link private projectDescribe the bug i am trying to add property to my custom sector , and the property type (Select) , once the builder ready i got thi...

YaseenHajajweh

@artf , sorry i found the solution

GJSBlock

Thanks for reporting this, @YaseenHajajweh. The issue with StyleManager.addProperty , type: 'select' , Cannot read properties of undefined (reading 'replace') appears to be a race condition or state management timing problem. This typicall...

#4411Jun 27, 2022by zgeist4 answers
2 reactions

XSS when add class name to Selector Manager

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v102 Reproducible demo link https://jsfiddle.net/szLp8h4n Describe the bug How to reproduce the bug?Select any componentAdd class name to Selector Manager like <a href="#"onclick='alert(123)'>check</a>After click on...

artf

Thanks for the report, will be fixed in the next release.

Rawne

Also running into this XSS bug. For example adding "><img src=x onerror=alert('XSS')> to the classes of a component will cause it to pop up as well.

zgeist

Thanks a lot!

#4400Jun 21, 2022by shelendravashishtha23 answers
1 reactions

Bootstrap Carousel Slider is not working

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?... Add Bootstrap in GrapesJS init function... Add Slider component as per bootstrap documentation... Slider shows only first image and image...

artf

Sorry but the issue tracker is mainly for bugs in the core grapesjs module and I believe in this case you should instantiate the bootstrap.Carousel manually via JS (eg. by creating a custom component with JS) as the editor has to load canv...

shelendravashishtha2

Hi Arthur, is there any way of getting screen sized specific styles in grapesjs, like different styles based on media query styles ?

GJSBlock

Thanks for reporting this, @shelendravashishtha2. Great question about Bootstrap Carousel Slider is not working. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS documentation for yo...

#4376Jun 13, 2022by iamqinglong2 answers
0 reactions

Unselected custom component will also listen to event 'styleable:change'

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome 100 Reproducible demo link https://grapesjs.com/demo.html Describe the bug How to reproduce the bug?Drop two or more custom component <img width="1230" alt="Screen Shot 2022-06-10 at 3 11 54 PM" src="https://user-im...

artf

Hi @iamqinglong this is the expected behavior as you're creating a listener on the editor model, but you can check the selected component in this way

GJSBlock

Thanks for reporting this, @iamqinglong. Great question about Unselected custom component will also listen to event 'styleable:change'. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the Grapes...

#4371Jun 10, 2022by clonefunnels4 answers
3 reactions

All editors broken after last update that broke storage manager.

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://www.teamfunnels.net/login.php demo demo Describe the bug Please help me understand how to fix everything that this update broke. I don't understand why you wouldn't make it compatible...

Vac1911

@clonefunnels I made a quick function to load data with backwards compatibility:

Vac1911

@artf Quick sidenote: editor.loadProjectData should be added to the type declarations

artf

Please, read the release notes carefully https://github.com/artf/grapesjs/releases/tag/v0.19.4 https://github.com/artf/grapesjs/pull/4223#issuecomment-1152331298

#4356May 31, 2022by Justin83032 answers
0 reactions

Selector:remove event does not exist

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 101 Reproducible demo link https://jsfiddle.net/sdrf72wx/1/ Describe the bug How to reproduce the bug?execute the code below on the initialization of the editoradd and remove a selector of a componentLook at the con...

artf

Hi @Justin8303 selector:remove refers to the global container of selectors so it's only triggered when the selector is actually removed from the global collection and not from the component. When you remove the selector from the component,...

GJSBlock

Thanks for reporting this, @Justin8303. Great question about selector:remove event does not exist. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific modu...

#4350May 26, 2022by ronaldohoch3 answers
1 reactions

Style Manager don't update background when component is selected

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Brave Browser V1.39.111 Reproducible demo link https://jsfiddle.net/e7oau8v6/ Describe the bug How to reproduce the bug?Thow a column in canvas.Select the text componentGo to style tab and find background on decorationsSet...

artf

Hi @ronaldohoch the issue here is with your custom type background and the way you're adding it is not correct (proper usage of the API). The addType is mainly for adding new UI inputs, if you don't need a new type of UI (like in your case...

tuongnguyendev

Hi @artf , I have a problem quite similar to @ronaldohoch when use the latest version of GrapesJS Background image preview show error link Details are in the image below:

GJSBlock

Thanks for reporting this, @ronaldohoch. Great question about Style Manager don't update background when component is selected. The recommended approach with StyleManager is to use the event-driven API. Start here: Check the GrapesJS docum...

#4341May 20, 2022by senthil177cse4 answers
0 reactions

While adding border style for Html component css json only fetching for border selector not fetching selector of border-width, border-style, border-colorBUG:

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome v101.0.4951.54 Reproducible demo link https://jsfiddle.net/7sn5h91r/7/ Describe the bug my issue is for style border property width, style and color not updating in json even i have checked in https://grapesjs.com/d...

aharishsundhar

@artf how to resolve this problem i'm face the same issues in my side latest version v0.18.4 padding: 0 0 0 0, padding-top: "", padding-bottom: "", padding-right: "", padding-left: "",

senthil177cse

Hi @aharishsundhar .. As per my knowledge instead of using padding: 0 0 0 0; you can add only pading-top, padding-bottom,padding-left,padding-right...

aharishsundhar

@senthil177cse im getting the same issues on padding : 0 0 0 0; created also the padding-top create but empty properties coming how to fix the problem is its issues with grapesjs v0.18.4?

Browse all topics