GrapesJS Issues

3,464 parsed GitHub issues โ€” 370 solved ยท 90 open. Search, filter and explore battle-tested answers.

644 issues found

๐Ÿ” components
#1101May 10, 2018by kuldeepcis2 answers
0 reactions

apply css property for mobile/tablet view

Hello @artf , https://jsfiddle.net/66cnd2t4/3/ This is the fiddle for the map issue when you drag a map and add it then in dimensions you will see width auto and its label is in pink which shows it user defined means i have passed it in components style block as such , _("map") && i.add("map", { label: n.labelMap, cat...

artf

First of all, next time use this https://jsfiddle.net/szLp8h4n as a starting point for your fiddles, without all the stuff not regarding the issue. To make properties defined on other devices you have to set the CSS on that media query:

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1100May 9, 2018by kuldeepcis2 answers
0 reactions

unable to update the traits value in the HTML for custom component

I have created a custom component for social icons.When selected this component i have two traits in setting facebook URL and show facebook , when i update the both it gets updated and is reflected in canvas but when i export i don't get the URL for facebook which is set via the traits. Below is the code attached. gra...

artf

Please keep track of your issues here, you're talking about the same case #1089

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1091May 7, 2018by mbleverage3 answers
0 reactions

How to select the first Component

I want to launch the editor with the style manager visible and populated. Meaning that a component is selected by default and the style manager shows the styles related to that selected component. I have been struggling with how to access the model. var domComponents = editor.DomComponents; When I print the following...

artf

Do it when the editor is loaded

mbleverage

Thank you for your time. I just tried this and it is not working. Any other suggestion?

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1083May 4, 2018by pintor-mato2 answers
0 reactions

import template

Hi . I have a json string like this '{ "assets": "[{\"type\":\"image\",\"src\":\"./img/team1.jpg\",\"unitDim\":\"px\",\"height\":0,\"width\":0}]", "css": "* { box-sizing: border-box; } body {margin: 0;}", "styles": "[]", "html": "", "components": "[]"}'. Now I want to import it.

artf

Honestly, I'd recommend following the flow with the storage manager, but in any way, you could achieve it in this way:

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1079May 1, 2018by Coyote63 answers
2 reactions

Improper Bg Repeat CSS Being Set

When importing components and initializing grapesjs, the css background-repeat property is being changed to background-repeat-x and background-repeat-y, which breaks on iOS. Import components: This is how it looks before: Mobile Desktop Initialize GrapesJs, select an element, and then get the output code, and it comes...

Coyote6

Thanks. I added this to my storage manager function... I think it patches the problem for the time being... I am not quite awake yet, so please let me know if I messed something up.

artf

Thanks @Coyote6 we're already aware of this issue. This happens due to the browser's CSS parser and I can't do much about until there will be a possibility to attach custom CSS parsers, hope to implement it soon.

artf

From https://github.com/artf/grapesjs/releases/tag/v0.14.33 you can use custom CSS parsers, the first to be released is grapesjs-parser-postcss

#1061April 24, 2018by Deepak8132 answers
0 reactions

How we can show countdown traits

Hi artf, Please let us know how we get the countdown elements in edit mode means when we set the template html using editor.setComponents(templateHTML); then when we click on countdown element it displays the id and title fields not the Endzone and endText fields. I have tried a lot with setting model type as datetime...

artf

editor.addComponents('<div data-gjs-type="countdown"></div>') You can create a custom template by relying on data-js identifiers

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1058April 21, 2018by tommedema3 answers
1 reactions

[BUG] CSS parser invalidly parses certain duplicate declarations

Tested on latest dev branch commit 39be1e0. This problem occurred on one of my templates, so it's a real world issue. It took me about half a day to create this minified test case, so I hope it helps. If you have a template with the following CSS: A browser renders this correctly as such: <img width="609" alt="screen...

artf

when the browser itself already has a DOM tree and all styling information etc can be retrieved on-demand once a component is selected Probably this is something I've tried to build before grapesjs, and to be honest, after few weeks of wor...

tommedema

@artf it's surprising to me that this is slower because I thought the browser would be heavily optimized for this, but you definitely have more experience with this project so I'll trust in your judgement ;) I'm definitely in favor of an o...

artf

I'd really appreciate a PR. I think the check would be ok inside the add method

#1049April 16, 2018by dsgh1 answer
0 reactions

[Bug] Calling setStyle does not update storage, unlike setComponents

I'm configuring grapesjs in a way to allow users to edit the html and css source (by calling setComponents and setStyle respectively). There is an issue regarding the storeManager where the html is stored correctly, but the css is not. Here is a fiddle showing this: https://jsfiddle.net/szLp8h4n/189/Steps to reproduce...

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1047April 16, 2018by faizansaiyed3 answers
0 reactions

[BUG] Model not able to change after changing value in custom Select dropdown menu.

Hey, I'm using CDN link for grapes js from unpkg.com In my project, I've used custom trait as a drop-down select menu which changes HTML using model.components. But today, the value is not reflecting in editor html.

faizansaiyed

When I used the previous version of GrapesJS, it works fine. [Edit] Not working in Latest @ v0.14.9, but working fine in v0.14.6

artf

Can you show me please your implementation of that trait? A live demo with jsfiddle it's even better

no-response[bot]

This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take ac...

#1030April 12, 2018by francesca-cicileo3 answers
0 reactions

[Question] Firing events with custom components

I'm trying to build a plugin for Grapesjs with some custom components, and I'm having trouble with triggering events and interacting with the component in the code. One problem I am having is that I added an attribute to the model for a custom text component. In the script for that text component, I change the attribu...

arthuralmeidap

Just for tests purposes, try to listen all changes on your model. try with this.listenTo(model, 'change') and see what you get.

artf

@francesca-cicileo 'change:*' is used for model's properties (eg. tagName, removable, etc.), probably you're looking for change:attributes:ATTR-NAME. Be sure to update model's properties properly (eg. model.addAttributes({ attrName: 'value...

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.