diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js
index b23535f8b..a87061cf5 100644
--- a/src/dom_components/model/Component.js
+++ b/src/dom_components/model/Component.js
@@ -163,6 +163,7 @@ module.exports = Backbone.Model.extend(Styleable).extend({
     this.listenTo(this, 'change:script', this.scriptUpdated);
     this.listenTo(this, 'change:traits', this.traitsUpdated);
     this.listenTo(this, 'change:tagName', this.tagUpdated);
+    this.listenTo(this, 'change:attributes', this.attrUpdated);
     this.loadTraits();
     this.initClasses();
     this.initComponents();
@@ -218,6 +219,17 @@ module.exports = Backbone.Model.extend(Styleable).extend({
   },
 
 
+  /**
+   * Emit changes for each updated attribute
+   */
+  attrUpdated() {
+    const attrPrev = { ...this.previous('attributes') };
+    const attrCurrent = { ...this.get('attributes') };
+    const diff = shallowDiff(attrPrev, attrCurrent);
+    keys(diff).forEach(pr => this.trigger(`change:attributes:${pr}`));
+  },
+
+
   /**
    * Update attributes of the model
    * @param {Object} attrs Key value attributes