title: Polymer Paper-Input not working or rendering
body: <p>I am trying to use the paper-input element in my page, but it didn't seem to work.
  I then tried to run the code for the demo on the Polymer site, but that didn't work either, and I was getting simple text fields rather than Polymer's paper-input element. I am using the exact same code as the sample i.e. </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
    &lt;meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"&gt;
  
    &lt;title&gt;paper-input&lt;/title&gt;
  
    &lt;script src="..components/webcomponentsjs/webcomponents.js"&gt;&lt;/script&gt;
  
    &lt;link href="..components/paper-input/paper-autogrow-textarea.html" rel="import"&gt;
    &lt;link href="..components/paper-input/paper-input-decorator.html" rel="import"&gt;
    &lt;link href="..components/paper-input/paper-input.html" rel="import"&gt;
  
    &lt;style shim-shadowdom&gt;
  
      body {
        font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
        font-size: 14px;
        margin: 0;
        padding: 24px;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -webkit-touch-callout: none;
      }
  
      section {
        padding: 20px 0;
      }
  
      section &gt; div {
        padding: 14px;
        font-size: 16px;
      }
  
      paper-input {
        width: 80%;
      }
  
      paper-input-decorator {
        max-width: 80%;
      }
  
      @media only screen and (min-width : 320px) {
        paper-input {
          width: 100%;
        }
  
        paper-input-decorator {
          max-width: 100%;
        }
      }
  
      paper-input.narrow {
        width: 150px;
      }
  
      .custom /deep/ ::-webkit-input-placeholder {
        color: #f4b400;
      }
  
      .custom /deep/ ::-moz-placeholder {
        color: #f4b400;
      }
  
      .custom /deep/ :-ms-input-placeholder {
        color: #f4b400;
      }
  
      .custom /deep/ .label-text,
      .custom /deep/ .error {
        color: #f4b400;
      }
  
      .custom /deep/ .unfocused-underline {
        background-color: #f4b400;
      }
  
      .custom[focused] /deep/ .floated-label .label-text {
        color: #0f9d58;
      }
  
      .custom /deep/ .focused-underline {
        background-color: #0f9d58;
      }
  
      .custom.invalid /deep/ .floated-label .label-text,
      .custom /deep/ .error {
        color: #f06292;
      }
  
      .custom.invalid /deep/ .focused-underline {
        background-color: #f06292;
      }
  
      .custom {
        color: #1a237e;
      }
  
    &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body unresolved&gt;
  
    &lt;section&gt;
  
      &lt;div&gt;Standalone&lt;/div&gt;
  
      &lt;br&gt;
  
      &lt;paper-input label="label"&gt;&lt;/paper-input&gt;
  
      &lt;br&gt;
  
      &lt;paper-input label="floating label" floatingLabel&gt;&lt;/paper-input&gt;
  
      &lt;br&gt;
  
      &lt;paper-input label="disabled" disabled&gt;&lt;/paper-input&gt;
  
    &lt;/section&gt;
  
    &lt;section&gt;
  
      &lt;div&gt;Decorator&lt;/div&gt;
  
      &lt;br&gt;
  
      &lt;paper-input-decorator label="with core-input"&gt;
        &lt;input is="core-input"&gt;
      &lt;/paper-input-decorator&gt;
  
      &lt;br&gt;
  
      &lt;paper-input-decorator label="with core-input + floatingLabel" floatingLabel&gt;
        &lt;input is="core-input"&gt;
      &lt;/paper-input-decorator&gt;
  
      &lt;br&gt;
  
      &lt;paper-input-decorator label="with autogrowing text area"&gt;
        &lt;paper-autogrow-textarea&gt;
          &lt;textarea&gt;&lt;/textarea&gt;
        &lt;/paper-autogrow-textarea&gt;
      &lt;/paper-input-decorator&gt;
  
      &lt;br&gt;
  
      &lt;paper-input-decorator label="with autogrowing text area + floatingLabel" floatingLabel&gt;
        &lt;paper-autogrow-textarea&gt;
          &lt;textarea&gt;&lt;/textarea&gt;
        &lt;/paper-autogrow-textarea&gt;
      &lt;/paper-input-decorator&gt;
  
    &lt;/section&gt;
  
    &lt;section&gt;
  
      &lt;div&gt;Auto-Validation&lt;/div&gt;
  
      &lt;paper-input-decorator label="required" floatingLabel error="input is required!" autoValidate&gt;
        &lt;input is="core-input" required&gt;
      &lt;/paper-input-decorator&gt;
  
    &lt;/section&gt;
  
    &lt;section&gt;
  
      &lt;div&gt;Custom styling&lt;/div&gt;
  
      &lt;br&gt;
  
      &lt;paper-input class="custom" label="paper-input"&gt;&lt;/paper-input&gt;
  
      &lt;br&gt;
  
      &lt;paper-input-decorator class="custom" label="decorator"&gt;
        &lt;input is="core-input"&gt;
      &lt;/paper-input-decorator&gt;
  
    &lt;/section&gt;
  
    &lt;script&gt;
  
      document.body.addEventListener('change', function(e) {
        console.log('change', e.target);
      });
  
    &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>