Polymer 1.0 Events from marker info window are not firing

[Ribukshin]

I have following template:

<google-map-marker id="marker" latitude="[[asset.latitude]]" longitude="[[asset.longitude]]" title="[[asset.lastUpdated]]"

      icon="[[_getIcon(asset.speed, asset.lastUpdated, asset.heading, asset.status)]]" click-events="true">

      <div class="title">[[asset.id]] <paper-icon-button id="markerid" icon="launch" on-tap="markerClicked"></paper-icon-button></div>

      <div class="body">[[asset.speed]] mph</div>

      <div class="body">[[_getDate(asset.lastUpdated)]]</div>

    </google-map-marker>

My markerClicked is a simple function that fires a custom event.

Clicking or tapping on the paper-icon-button does nothing. No event is generated. I tried replacing on-tap with a listener block as below and even that didn't make any difference.

listeners: {

        'markerid.tap': 'markerClicked'

      }

Any pointers what could be wrong? Is it a known issue or bug?

Following is the complete source:

<!--

@license

Copyright (c) 2015 The Polymer Project Authors. All rights reserved.

This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt

The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt

The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt

Code distributed by Google as part of the polymer project is also

subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt

-->

<link rel="import" href="../../bower_components/polymer/polymer.html">

<link rel="import" href="../../bower_components/paper-styles/typography.html">

<link rel="import" href="../../bower_components/google-map/google-map-marker.html">

<link rel="import" href="../../bower_components/google-apis/google-maps-api.html">

<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">

<dom-module id="aae-map-marker">

  <template >

    <style>

      :host {

        display: block;

      }

      span {

        @apply(--paper-font-body1);

      }

      .markerinfo {

        margin: 2px;

      }

      .card-content {

        line-height: 70%;

      }

      .title {

        @apply(--paper-font-title);

      }

      .body {

        @apply(--paper-font-body1);

      }

    </style>

    <google-map-marker id="marker" latitude="[[asset.latitude]]" longitude="[[asset.longitude]]" title="[[asset.lastUpdated]]"

      click-events="true">

      <div class="title">[[asset.id]] <paper-icon-button id="markerid" icon="launch" on-tap="markerClicked"></paper-icon-button></div>

      <div class="body">[[asset.speed]] mph</div>

      <div class="body">[[_getDate(asset.lastUpdated)]]</div>

    </google-map-marker>

  </template>

  <script>

    Polymer({

      is: 'aae-map-marker',

      properties: {

        asset: {

          type: Object

        }

      },

      listeners: {

        'markerid.tap': 'markerClicked'

      },

      marker: function() {

        this.$.marker;

      },

      _getDate: function(timestamp) {

        var date = new Date(timestamp);

        return date.toLocaleString();

      },

      markerClicked: function() {

        this.$.marker.fire('iron-signal', {name: 'assetupdate', data: this.asset});

        console.log("Asset Update signal fired");

      }

    });

  </script>

</dom-module>

-Naren