Class attribute not removed
Question
Hello ! I noticed a problem with style manager when we add/remove classes. When we remove all classes it doesn't remove then from the generated source.
Steps to reproduce: 1- Select an element to style (preferable one without any class) 2- Add a new class 3- Look the generated source code (View code) the class should be there as expected 4- Remove the class in the style manager (we should not have any class here now) 5- Look the generated source code (View code) the class is still there (should not be there)
Cheers !
Answers (3)
Trying to find the problem I can see that the canvas has the class removed but not the model, I'm trying to find where in code it was supposed to be removed but I'm having a hard time finding it. Anyone has any idea ?
After several attempts I found a place to clear the class from the model but I'm not sure that this is the best place or form to achieve it. In SectorsView.js:targetUpdated()
...
if (classes.length) {
var valid = classes.getStyleable();
var iContainer = cc.get(valid, state, media);
if (!iContainer && valid.length) {
// I stop undo manager here as after adding the CSSRule (generally after
// selecting the component) and calling undo() it will remove the rule from
// the collection, therefore updating it in style manager will not affect it
// #268
um.stop();
iContainer = cc.add(valid, state, media);
iContainer.setStyle(model.getStyle());
model.setStyle({});
um.start();
}
if (!iContainer) {
// In this case it's just a Component without any valid selector
pt.model = model;
pt.trigger('update');
return;
}
// If the state is not empty, there should be a helper rule in play
// The helper rule will get the same style of the iContainer
state && appendStateRule(iContainer.getStyle());
pt.model = iContainer;
pt.trigger('update');
return;
}
///////////////////////////
else delete model.attributes.attributes.class; //if there is no classes then clear it on model ?????
/////////////////////////
...
Hi @mingodad and thanks for this catch, actually the real issue was updating attributes reference here https://github.com/artf/grapesjs/blob/dev/src/dom_components/model/Component.js#L285
I'll publish the fix in the next release
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1877
[FEATURE REQUEST] Custom styles that add/remove custom classes?
Currently, all the style manager values that you change for an element simply update a <style> tag inline in the HTML. Is it possible to ch...
Issue #1369
[BUG] Class of a block doesn't always show in the classes section
Hello everyone, I have added many custom blocks and gave the same css class to all the images in those blocks. Let's call it for now 'image...
Issue #631
How to refresh Classes view for active Component in the Style Manager
I'm using a trait (type=select) to change the class of a component (a "column" component, so classes representing width 1-12). After I have...
Issue #1821
[QUESTIONS] How to apply the style changes to the ID instead of the class?
Hi, I have two elements with the same classes. I want to apply style changes with style manager to one of these two elements. I add ID but...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.