Update class selector on style target change

src/selector_manager/view/ClassTagsView.js

@@ -52,7 +52,11 @@ module.exports = Backbone.View.extend({
     this.target = this.config.em;
     this.em = this.target;
 
-    //this.listenTo(this.getStyleEmitter(), 'update', this.componentChanged);
+    this.listenTo(
+      this.getStyleEmitter(),
+      'styleManager:update',
+      this.componentChanged
+    );
     this.listenTo(this.target, 'component:toggled', this.componentChanged);
     this.listenTo(this.target, 'component:update:classes', this.updateSelector);
 
@@ -141,10 +145,8 @@ module.exports = Backbone.View.extend({
    * @param  {Object} e
    * @private
    */
-  componentChanged(e) {
+  componentChanged(target) {
-    console.log('componentChanged');
+    this.compTarget = target;
-    this.compTarget = this.getTarget();
-    const target = this.compTarget;
     let validSelectors = [];
 
     if (target) {
@@ -155,7 +157,7 @@ module.exports = Backbone.View.extend({
     }
 
     this.collection.reset(validSelectors);
-    this.updateStateVis();
+    this.updateStateVis(target);
   },
 
   getTarget() {
@@ -168,12 +170,12 @@ module.exports = Backbone.View.extend({
    * inside collection
    * @private
    */
-  updateStateVis() {
+  updateStateVis(target) {
     const em = this.em;
     const avoidInline = em && em.getConfig('avoidInlineStyle');
     const display = this.collection.length || avoidInline ? 'block' : 'none';
     this.getStatesC().css('display', display);
-    this.updateSelector();
+    this.updateSelector(target);
   },
 
   /**
@@ -181,9 +183,9 @@ module.exports = Backbone.View.extend({
    * @return {this}
    * @private
    */
-  updateSelector() {
+  updateSelector(target) {
     const { pfx, collection, el } = this;
-    const selected = this.getTarget();
+    const selected = target || this.getTarget();
     this.compTarget = selected;
     if (!selected || !selected.get) return;
 

src/style_manager/view/SectorsView.js

@@ -118,7 +118,7 @@ module.exports = Backbone.View.extend({
     const state = !config.devicePreviewMode ? model.get('state') : '';
     const pt = this.propTarget;
     pt.model = model;
-    pt.trigger('update');
+    pt.trigger('styleManager:update', model);
     return model;
   },