Getting The List Of Polymer Published Properties

Is there a way of getting the list of all published properties defined in a polymer component? (e.g. get the available properties of component public API)

Solution 1:

It's best to use element.publish to get the list of published properties for an element. (In polymer 1.0 element.properties does the same).

element.getAttribute('attributes) won't include the publish properties that are setup in a publish block.

Solution 2:

You can access the element definition (i.e. the polymer-element itself) through the element property. So

document.querySelector('sample-component')
  .element.getAttribute('attributes')

gives you 'foo1 foo2' (btw. inside an element you can simply write this.element.)

Be aware that this only works after Polymer has registered and processed all elements, so depending on where you want to use this statement, you may have to put it into a polymer-ready event handler:

<script>addEventListener('polymer-ready', function() {
    console.log(document.querySelector('sample-component')
      .element.getAttribute('attributes'));
  });
</script>

Update:

If you want to get a list of all published properties (i.e. the ones in the attributes attribute plus the ones of the publish: {} property), you can use

Object.keys(document.querySelector('sample-component').publish)

which gives you ['foo1', 'foo2'].

Share