diff --git a/iron-iconset-svg.html b/iron-iconset-svg.html
index 63e7dbc..2123d02 100644
--- a/iron-iconset-svg.html
+++ b/iron-iconset-svg.html
@@ -187,20 +187,33 @@
     },
 
     /**
-     *
-     * When name is changed, register iconset metadata
-     *
+     * Fire 'iron-iconset-added' event at next microtask.
      */
-    _nameChanged: function() {
-      this._meta.value = null;
-      this._meta.key = this.name;
-      this._meta.value = this;
-
+    _fireIronIconsetAdded: function() {
       this.async(function() {
         this.fire('iron-iconset-added', this, {node: window});
       });
     },
 
+    /**
+     *
+     * When name is changed, register iconset metadata
+     *
+     */
+     _nameChanged: function() {
+       this._meta.value = null;
+       this._meta.key = this.name;
+       this._meta.value = this;
+       if (this.ownerDocument && this.ownerDocument.readyState === 'loading') {
+         // Document still loading. It could be that not all icons in the iconset are parsed yet.
+         this.ownerDocument.addEventListener('DOMContentLoaded', function() {
+           this._fireIronIconsetAdded();
+         }.bind(this));
+       } else {
+         this._fireIronIconsetAdded();
+       }
+     },
+
     /**
      * Create a map of child SVG elements by id.
      *
diff --git a/test/imported.html b/test/imported.html
new file mode 100644
index 0000000..e0a2173
--- /dev/null
+++ b/test/imported.html
@@ -0,0 +1,11 @@
+<iron-iconset-svg name="imported-icons" size="20">
+  <svg>
+    <defs>
+      <circle id="circle" cx="20" cy="20" r="10"></circle>
+      <rect id="square" x="0" y="0" width="20" height="20"></rect>
+      <symbol id="rect" viewBox="0 0 50 25">
+        <rect x="0" y="0" width="50" height="25"></rect>
+      </symbol>
+    </defs>
+  </svg>
+</iron-iconset-svg>
diff --git a/test/iron-iconset-svg.html b/test/iron-iconset-svg.html
index a65b1ae..a709abf 100644
--- a/test/iron-iconset-svg.html
+++ b/test/iron-iconset-svg.html
@@ -88,6 +88,12 @@
     </template>
   </test-fixture>
 
+  <test-fixture id="ImportIconsetSvg">
+    <template>
+      <iron-icon icon="imported-icons:rect"></iron-icon>
+    </template>
+  </test-fixture>
+
   <script>
 
 
@@ -282,6 +288,39 @@
 
     });
 
+    suite('Late-loading iconset', function () {
+      var icon;
+      var fired;
+
+      setup(function () {
+        icon = fixture('ImportIconsetSvg');
+        fired = false;
+        window.addEventListener('iron-iconset-added', function(ev) {
+          if (ev.detail.name === 'imported-icons') {
+            fired = true;
+          }
+        });
+      });
+
+      test('icons appear after iconset is loaded.', function (done) {
+        var children = Polymer.dom(icon.root).querySelectorAll('img,svg');
+        expect(children.length).to.be.eql(0);
+        icon.importHref('imported.html', function () {
+          flush(function () {
+            if (!fired) {
+              // In Chrome with wc-shadydom=true&wc-ce=true importHref has no effect on
+              // already-loaded custom elements.
+              done();
+              return;
+            }
+            children = Polymer.dom(icon.root).querySelectorAll('img,svg');
+            expect(children.length).to.be.eql(1);
+            done();
+          });
+        });
+      });
+    });
+
   </script>
 
 </body>