Search code examples
dartdart-polymermaterial-designpaper-elements

Bug in rendering paper-button


I have two identical paper-buttons except for there ids:

<paper-button raisedButton
  id='rendered'
  label='patient'
  on-click='{{clickHandler}}'></paper-button>

<paper-button raisedButton
  id='no-render'
  label='patient'
  on-click='{{clickHandler}}'>
</paper-button>

The first button renders with its text label, the second renders without the text label. The only difference is the closing tag. I would expect the the second button should be rendered like the first, but it does not. Is this a bug?

Another observation is that the button's label always defaults to upper-case. Can this be changed?

I am using polymer v 0.12.0-dev and Dart Editor version 1.6.0.dev_03_00 (DEV) Dart SDK version 1.6.0-dev.3.0.


Solution

  • For the second button is rendered differently (without the caption) and I get the error message

    Using textContent to label the button is deprecated. Use the "label" property instead 
    

    Obviously the <paper-button> is designed to recognize if someone adds childnodes, which seems not to be supported.
    The line break between opening and closing tag creates a TextNode children which changes the behavior of the button.

    I guess there was a good intention in the way the button is designed but the result might cause more confustion than help.

    I created a bug report https://github.com/Polymer/paper-button/issues/12