search

PolymerElements / iron-doc-viewer

Polymer documentation viewer elements
17 stars 16 forks source link

Show combined element attributes & properties #125

Open samuelli opened 7 years ago

samuelli commented 7 years ago

Currently only properties are shown. This is fine for Polymer use cases, where all attributes are propagated as properties. However, analyzer supports vanilla custom elements, for which attributes are properties are distinct.

Attributes are picked up by analyzer. Sample source of observedAttributes. https://github.com/samuelli/progress-bar/blob/ab8acaa186da2377a20b3e5f6f3b0501a8921dcc/progress-bar.html#L90 But iron-doc-element does not display the attribute: https://www.webcomponents.org/element/samuelli/progress-bar/v2.0.0

I propose that we show a list as follows:

Attributes & properties

attribute-property (HTML attribute) This is an attribute which is also a property attributeProperty (JS property)

my-attribute (HTML attribute) This is just an attribute not found in properties

myProperty (JS property) This is just a property not found in attributes

The "HTML attribute" and "JS property" could just be shortened to "HTML" and "JS" and could be displayed as little tags like MDN does. image image

We have seen related requests to show separate attribute/property annotations:

Another related issue previously was annotations were too subtle & we could utilise the same tag concept: https://github.com/webcomponents/webcomponents.org/issues/796

samuelli commented 7 years ago

New related user report: https://github.com/webcomponents/webcomponents.org/issues/965

arthurevans commented 7 years ago

Would love to see HTML attr. names for props that have associated attributes. That's often a source of confusion. And there are some Polymer elements that use vanilla attributes. +100!