Update how classes are updated

src/dom_components/model/Component.js

@@ -250,10 +250,7 @@ const Component = Backbone.Model.extend(Styleable).extend(
      * @private
      */
     attrUpdated() {
-      const attrPrev = { ...this.previous('attributes') };
+      this.setAttributes(this.get('attributes'));
-      const attrCurrent = { ...this.get('attributes') };
-      const diff = shallowDiff(attrPrev, attrCurrent);
-      keys(diff).forEach(pr => this.trigger(`change:attributes:${pr}`));
     },
 
     /**
@@ -263,7 +260,7 @@ const Component = Backbone.Model.extend(Styleable).extend(
      * @example
      * component.setAttributes({ id: 'test', 'data-key': 'value' });
      */
-    setAttributes(attrs) {
+    setAttributes(attrs, opts = {}) {
       attrs = { ...attrs };
 
       // Handle classes
@@ -276,7 +273,10 @@ const Component = Backbone.Model.extend(Styleable).extend(
       style && this.setStyle(style);
       delete attrs.style;
 
-      this.set('attributes', attrs);
+      this.set('attributes', attrs, { silent: 1 });
+      const attrPrev = { ...this.previous('attributes') };
+      const diff = shallowDiff(attrPrev, attrs);
+      keys(diff).forEach(pr => this.trigger(`change:attributes:${pr}`));
 
       return this;
     },

test/specs/selector_manager/e2e/ClassManager.js

@@ -97,7 +97,7 @@ module.exports = {
           expect(tagEl.collection.at(0).get('name')).toEqual('test');
         });
 
-        test('Removing from container removes also from selected component', () => {
+        test.only('Removing from container removes also from selected component', () => {
           var model = components.add({});
           gjs.editor.setSelected(model);
           tagEl.addNewTag('test');