on-click event handling issue

[GrimmKull]

When handling click events in paper-icon-button

<paper-icon-button icon="check" on-click="_onClick"></paper-icon-button>

The MouseEvent parameter value handled in _onClick will have different srcElement, target and toElement values (iron-icon or paper-icon-button) depending on where you click on the paper-icon-button.

Can it be fixed so that the events are handled only in the parent element, paper-icon-button so that the attributes of that element are accessible when handling the click event?

For example:

...
<paper-icon-button id="{{item.hash}}" icon="check" on-click="_onClick"></paper-icon-button>

...

...

_onClick: function(event) {
    console.log("Item id=", event.srcElement.id);
},

...

[stephanieder]

+1 wanted to open the same issue, thank :p

[stephanieder]

So if we want a custom element of the button and if we click on the icon of the button, we are forced to move up the hierarchy of nodes with the path to get it.

[GrimmKull]

There is a workaround but it is not pretty.

...

_onClick: function(event) {
    var id = event.srcElement.id;

    if (id === 'icon') id = event.srcElement.parentElement.id;

    console.log("Item id=", id);
},

...

[clintfoster]

Using event.currentTarget instead of event.target works as expected, e.g. event.currentTarget.getAttribute() returns the attribute of the paper-icon-button instead of the parent iron-element.