Using Polymer Web Components and invoke password saving prompt

Question

Polymer uses non-standard tags like paper-input etc. For example image a login form created with Polymer:

<paper-input id="email" floatingLabel inputValue="{{emailValue}}" label="Email"></paper-input>
<paper-input id="password" type="password" inputValue="{{passwordValue}}" label="Password"></paper-input>
<paper-button on-tap={{loginFunction}} label="Login"></paper-button>

How to utilize browser password storing capabilities and remember passwords entered into a Polymer form?

Answer 1

Use paper-input-decorator, which simply wraps native inputs, e.g.:

  <paper-input-decorator label="Username" floatingLabel>
    <input is="core-input" name="username">
  </paper-input-decorator>

  <paper-input-decorator label="Password" floatingLabel>
    <input is="core-input" name="password" type="password">
  </paper-input-decorator>

Here's a JSBin of the above in case that's useful: http://jsbin.com/wumepu/2/edit?html,output