polymer paper-dropdown-menu displayed incorrect when dynamically adds new paper-item element

[Xiao Cao]

Hi everyone

I met a problem when developing a website with dart polymer. In my polymer element, here is a dropdown list

<paper-dropdown-menu>
  <paper-dropdown>
    <core-menu>
        <template repeat="{{enumerator in enumeratorList}}">
          <paper-item name="{{enumerator}}"> {{enumerator}} </paper-item>
        </template>
    </core-menu>
  </paper-dropdown>
</paper-dropdown-menu>

The enumeratorList is an observable list. If I add several elements to the list and open the dropdown menu, the display is correct.

However if I open the dropdown-menu first and then add the several elements dynamically in dart, then open the dropdown menu again. It would display like this

Seems that the paper-dropdown-menu can not detect the paper-items and adjust its size to fit.

If I click on the up/down arrow in the right of the dropdown menu repeatedly, I can even got the error message in chrome console : Uncaught TypeError: Cannot read property 'position' of null

Anyone could help how to solve it? Thanks very much!!!