Polymer paper-button not rendering

Question

I downloaded the Polymer starter kit (Polymer 1.0) and have been trying to add a simple paper button to my webpage, but it is not rendering correctly. Here is the relevant code:

<section data-route="home">
      <paper-material elevation="1">

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

        <button>Try Me</button>

        <paper-icon-button icon="refresh" label="label"></paper-icon-button>
        <paper-button raisedButton>search!</paper-button>

      </paper-material>

    </section>

The first button doesn't show up at all, the second normal button does, the third button works, but the label doesn't show up, and the final button renders as text and isn't clickable

Answer 1

Had the same problem, doesn't seem to load the paper-button element by default.

Fixed it by adding to the /app/index.html page before the paper-button was called.

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

Or add it to /app/elements/elements.html

Answer 2

paper-button doesn't have a label attribute or raisedButton attribute. If you want the button to have a label, you have to write it like a typical button tag. If you want it to have a shadow, you'll have to add a raised attribute instead. The paper-icon-button also doesn't have a label attribute. If you want to display something like that, you can try this instead:

<paper-button raised>
  <iron-icon icon="add"></iron-icon>
  <span>Add Something new</span>
</paper-button>