How to resolve "Attributes on element-name were data bound prior to Polymer upgrading the element?

Question

Since the latest version of Polymer (0.2.4) I get the following warning for a bunch of elements:

Attributes on us-requests-list were data bound prior to Polymer upgrading the element. This may result in incorrect binding types.

How do I resolve this warning? I've found the following issue on Github:

https://github.com/Polymer/polymer-dev/issues/20

Where they say:

Bindings made to an element before it is upgraded can end up being attribute bindings where property bindings were expected.

Generally this happens when a user has loaded element definitions out-of-order.

But what does that mean? For me the warning happens for elements that don't have any bindings or attributes at all.

Perhaps someone can explain to me what these words mean so I can be more specific about my question. It seems to me like the warnings happen at random, the only thing I can say about them is that they only happen on custom elements that are nested in other custom elements, but I don't think it happens for all my nested custom elements.

Answer 1

When I've run into this in the past it's meant that I was defining my polymer elements in the wrong order. So if you define two elements my-elem1 and my-elem2 in one document, and my-elem2 depends on my-elem1, then the definition of my-elem1 should come first or you may see bugs like data not propagating as expected.

Answer 2

You can also avoid the warning by adding the element on the Polymer.import's callback using the following code (instead of innerHTML =):

Polymer({
     ready: function() {
         Polymer.import(["urlToImport"],
                        this.elementImportComplete.bind(this));
     },
     elementImportComplete: function() {
         // Do it this way to avoid polymer's data binding warnings (and not 
         // by using innerHTML)
         var el = document.createElement(this.feedTypes[this.type]);
         this.$.container.appendChild(el);
     }
 });