Surround <input is="iron-input"> with <iron-input>

Type extension does not work anymore in Polymer 2:
https://polymer-library.polymer-project.org/2.0/docs/about_20#type-extension

Recommendation by Polyer expert was:
Most of the time, you can do
<iron-input params...>
  <input is="iron-input" thoseSameParams...>
</iron-input>

id attributes were kept at the <input> element, not moved to the
<iron-input> element. This may mean that in Polymer 2 some still tests
are still failing that look up input elements by id. Will fix this in
a follow-up change.

The goal was to create a simple non-breaking change across the entire
code base. There might still be some issues running this with Polymer 2.

This change also clean ups iron-input html imports. Some could be
removed, some had to be added.

Change-Id: I48361ff465990246622ec8ad23d80b75f40cc055

polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.html

@@ -100,12 +100,17 @@ limitations under the License.
               <iron-icon id="icon" icon="gr-icons:create"></iron-icon>
             </gr-button>
           </div>
-          <input
+          <iron-input
-              id="editRefInput"
               bind-value="{{section.id}}"
-              is="iron-input"
               type="text"
               on-input="_handleValueChange">
+            <input
+                id="editRefInput"
+                bind-value="{{section.id}}"
+                is="iron-input"
+                type="text"
+                on-input="_handleValueChange">
+          </iron-input>
           <gr-button
               link
               id="deleteBtn"

polygerrit-ui/app/elements/admin/gr-admin-group-list/gr-admin-group-list.html

@@ -18,7 +18,6 @@ limitations under the License.
 <link rel="import" href="/bower_components/polymer/polymer.html">
 
 <link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-table-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../core/gr-navigation/gr-navigation.html">

polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html

@@ -69,23 +69,33 @@ limitations under the License.
       <section class$="[[_computeBranchClass(baseChange)]]">
         <span class="title">Provide base commit sha1 for change</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
-              id="baseCommitInput"
               maxlength="40"
               placeholder="(optional)"
               bind-value="{{baseCommit}}">
+            <input
+                is="iron-input"
+                id="baseCommitInput"
+                maxlength="40"
+                placeholder="(optional)"
+                bind-value="{{baseCommit}}">
+          </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Enter topic for new change</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
-              id="tagNameInput"
               maxlength="1024"
               placeholder="(optional)"
               bind-value="{{topic}}">
+            <input
+                is="iron-input"
+                id="tagNameInput"
+                maxlength="1024"
+                placeholder="(optional)"
+                bind-value="{{topic}}">
+          </iron-input>
         </span>
       </section>
       <section id="description">

polygerrit-ui/app/elements/admin/gr-create-group-dialog/gr-create-group-dialog.html

@@ -39,10 +39,13 @@ limitations under the License.
       <div id="form">
         <section>
           <span class="title">Group name</span>
-          <input
+          <iron-input
-              is="iron-input"
-              id="groupNameInput"
               bind-value="{{_name}}">
+            <input
+                is="iron-input"
+                id="groupNameInput"
+                bind-value="{{_name}}">
+          </iron-input>
         </section>
       </div>
     </div>

polygerrit-ui/app/elements/admin/gr-create-pointer-dialog/gr-create-pointer-dialog.html

@@ -44,27 +44,39 @@ limitations under the License.
       <div id="form">
         <section>
           <span class="title">[[detailType]] name</span>
-          <input
+          <iron-input
-              is="iron-input"
-              id="itemNameInput"
               placeholder="[[detailType]] Name"
               bind-value="{{_itemName}}">
+            <input
+                is="iron-input"
+                id="itemNameInput"
+                placeholder="[[detailType]] Name"
+                bind-value="{{_itemName}}">
+          </iron-input>
         </section>
         <section>
           <span class="title">Initial Revision</span>
-          <input
+          <iron-input
-              is="iron-input"
-              id="itemRevisionInput"
               placeholder="Revision (Branch or SHA-1)"
               bind-value="{{_itemRevision}}">
+            <input
+                is="iron-input"
+                id="itemRevisionInput"
+                placeholder="Revision (Branch or SHA-1)"
+                bind-value="{{_itemRevision}}">
+          </iron-input>
         </section>
         <section class$="[[_computeHideItemClass(itemDetail)]]">
           <span class="title">Annotation</span>
-          <input
+          <iron-input
-              is="iron-input"
-              id="itemAnnotationInput"
               placeholder="Annotation (Optional)"
               bind-value="{{_itemAnnotation}}">
+            <input
+                is="iron-input"
+                id="itemAnnotationInput"
+                placeholder="Annotation (Optional)"
+                bind-value="{{_itemAnnotation}}">
+          </iron-input>
         </section>
       </div>
     </div>

polygerrit-ui/app/elements/admin/gr-create-repo-dialog/gr-create-repo-dialog.html

@@ -54,10 +54,13 @@ limitations under the License.
       <div id="form">
         <section>
           <span class="title">Repository name</span>
-          <input is="iron-input"
+          <iron-input autocomplete="on"
-              id="repoNameInput"
+                      bind-value="{{_repoConfig.name}}">
-              autocomplete="on"
+            <input is="iron-input"
-              bind-value="{{_repoConfig.name}}">
+                   id="repoNameInput"
+                   autocomplete="on"
+                   bind-value="{{_repoConfig.name}}">
+          </iron-input>
         </section>
         <section>
           <span class="title">Rights inherit from</span>

polygerrit-ui/app/elements/admin/gr-group-members/gr-group-members.html

@@ -19,7 +19,6 @@ limitations under the License.
 <link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
 <link rel="import" href="/bower_components/polymer/polymer.html">
 <link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
 <link rel="import" href="../../../styles/gr-subpage-styles.html">
 <link rel="import" href="../../../styles/gr-table-styles.html">

polygerrit-ui/app/elements/admin/gr-group/gr-group.html

@@ -17,7 +17,6 @@ limitations under the License.
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
 <link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
 <link rel="import" href="../../../styles/gr-subpage-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">

polygerrit-ui/app/elements/admin/gr-plugin-config-array-editor/gr-plugin-config-array-editor.html

@@ -83,11 +83,15 @@ limitations under the License.
         <div class="row placeholder">None configured.</div>
       </template>
       <div class$="row [[_computeShowInputRow(disabled)]]">
-        <input
+        <iron-input
-            is="iron-input"
-            id="input"
             on-keydown="_handleInputKeydown"
-            bind-value="{{_newValue}}"/>
+            bind-value="{{_newValue}}">
+          <input
+              is="iron-input"
+              id="input"
+              on-keydown="_handleInputKeydown"
+              bind-value="{{_newValue}}">
+        </iron-input>
         <gr-button
             id="addButton"
             disabled$="[[!_newValue.length]]"

polygerrit-ui/app/elements/admin/gr-repo-commands/gr-repo-commands.html

@@ -17,7 +17,6 @@ limitations under the License.
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
 <link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
 <link rel="import" href="../../../styles/gr-subpage-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">

polygerrit-ui/app/elements/admin/gr-repo-detail-list/gr-repo-detail-list.html

@@ -124,10 +124,14 @@ limitations under the License.
                       class="editBtn">
                     edit
                   </gr-button>
-                  <input
+                  <iron-input
-                      is=iron-input
                       bind-value="{{_revisedRef}}"
                       class="editItem">
+                    <input
+                        is=iron-input
+                        bind-value="{{_revisedRef}}"
+                        class="editItem">
+                  </iron-input>
                   <gr-button
                       link
                       on-tap="_handleCancelRevision"

polygerrit-ui/app/elements/admin/gr-repo-list/gr-repo-list.html

@@ -17,7 +17,6 @@ limitations under the License.
 <link rel="import" href="/bower_components/polymer/polymer.html">
 
 <link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-table-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../shared/gr-dialog/gr-dialog.html">

polygerrit-ui/app/elements/admin/gr-repo-plugin-config/gr-repo-plugin-config.html

@@ -87,12 +87,18 @@ limitations under the License.
                 </gr-select>
               </template>
               <template is="dom-if" if="[[_isString(option.info.type)]]">
-                <input
+                <iron-input
-                    is="iron-input"
                     value="[[option.info.value]]"
                     on-input="_handleStringChange"
                     data-option-key$="[[option._key]]"
-                    disabled$="[[_computeDisabled(option.info.editable)]]"></input>
+                    disabled$="[[_computeDisabled(option.info.editable)]]">
+                  <input
+                      is="iron-input"
+                      value="[[option.info.value]]"
+                      on-input="_handleStringChange"
+                      data-option-key$="[[option._key]]"
+                      disabled$="[[_computeDisabled(option.info.editable)]]">
+                </iron-input>
               </template>
               <template is="dom-if" if="[[option.info.inherited_value]]">
                 <span class="inherited">

polygerrit-ui/app/elements/admin/gr-repo/gr-repo.html

@@ -270,12 +270,17 @@ limitations under the License.
               <section>
                 <span class="title">Maximum Git object size limit</span>
                 <span class="value">
-                  <input
+                  <iron-input
-                      id="maxGitObjSizeInput"
                       bind-value="{{_repoConfig.max_object_size_limit.configured_value}}"
-                      is="iron-input"
                       type="text"
                       disabled$="[[_readOnly]]">
+                    <input
+                        id="maxGitObjSizeInput"
+                        bind-value="{{_repoConfig.max_object_size_limit.configured_value}}"
+                        is="iron-input"
+                        type="text"
+                        disabled$="[[_readOnly]]">
+                  </iron-input>
                   <template is="dom-if" if="[[_repoConfig.max_object_size_limit.value]]">
                     effective: [[_repoConfig.max_object_size_limit.value]] bytes
                   </template>

polygerrit-ui/app/elements/change/gr-change-actions/gr-change-actions.html

@@ -19,7 +19,6 @@ limitations under the License.
 
 <link rel="import" href="../../../behaviors/gr-patch-set-behavior/gr-patch-set-behavior.html">
 <link rel="import" href="../../../behaviors/rest-client-behavior/rest-client-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../admin/gr-create-change-dialog/gr-create-change-dialog.html">
 <link rel="import" href="../../core/gr-navigation/gr-navigation.html">
 <link rel="import" href="../../core/gr-reporting/gr-reporting.html">

polygerrit-ui/app/elements/change/gr-confirm-cherrypick-dialog/gr-confirm-cherrypick-dialog.html

@@ -15,8 +15,9 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
 <link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
@@ -77,12 +78,17 @@ limitations under the License.
         <label for="baseInput">
           Provide base commit sha1 for cherry-pick
         </label>
-        <input
+        <iron-input
-            is="iron-input"
-            id="baseCommitInput"
             maxlength="40"
             placeholder="(optional)"
             bind-value="{{baseCommit}}">
+          <input
+              is="iron-input"
+              id="baseCommitInput"
+              maxlength="40"
+              placeholder="(optional)"
+              bind-value="{{baseCommit}}">
+        </iron-input>
         <label for="messageInput">
           Cherry Pick Commit Message
         </label>

polygerrit-ui/app/elements/change/gr-included-in-dialog/gr-included-in-dialog.html

@@ -16,6 +16,7 @@ limitations under the License.
 -->
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 
@@ -77,11 +78,15 @@ limitations under the License.
             link
             on-tap="_handleCloseTap">Close</gr-button>
       </span>
-      <input
+      <iron-input
-          id="filterInput"
-          is="iron-input"
           placeholder="Filter"
           on-bind-value-changed="_onFilterChanged">
+        <input
+            id="filterInput"
+            is="iron-input"
+            placeholder="Filter"
+            on-bind-value-changed="_onFilterChanged">
+      </iron-input>
     </header>
     <div class$="[[_computeLoadingClass(_loaded)]]">Loading...</div>
     <template

polygerrit-ui/app/elements/change/gr-reviewer-list/gr-reviewer-list.html

@@ -16,7 +16,6 @@ limitations under the License.
 -->
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../shared/gr-account-chip/gr-account-chip.html">
 <link rel="import" href="../../shared/gr-button/gr-button.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">

polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html

@@ -21,6 +21,7 @@ limitations under the License.
 <link rel="import" href="../../../behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior.html">
 <link rel="import" href="../../../behaviors/rest-client-behavior/rest-client-behavior.html">
 <link rel="import" href="/bower_components/iron-dropdown/iron-dropdown.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../core/gr-navigation/gr-navigation.html">
 <link rel="import" href="../../core/gr-reporting/gr-reporting.html">
@@ -303,7 +304,9 @@ limitations under the License.
           <gr-endpoint-decorator name="annotation-toggler">
             <span hidden id="annotation-span">
               <label for="annotation-checkbox" id="annotation-label"></label>
-              <input is="iron-input" type="checkbox" id="annotation-checkbox" disabled>
+              <iron-input type="checkbox" disabled>
+                <input is="iron-input" type="checkbox" id="annotation-checkbox" disabled>
+              </iron-input>
             </span>
           </gr-endpoint-decorator>
         </div>

polygerrit-ui/app/elements/documentation/gr-documentation-search/gr-documentation-search.html

@@ -18,7 +18,6 @@ limitations under the License.
 
 <link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
 <link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-table-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../shared/gr-list-view/gr-list-view.html">

polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls.html

@@ -132,11 +132,16 @@ limitations under the License.
               placeholder="Enter an existing full file path."
               query="[[_query]]"
               text="{{_path}}"></gr-autocomplete>
-          <input
+          <iron-input
-              class="newPathInput"
+              class="newPathIronInput"
-              is="iron-input"
               bind-value="{{_newPath}}"
-              placeholder="Enter the new path."/>
+              placeholder="Enter the new path.">
+            <input
+                class="newPathInput"
+                is="iron-input"
+                bind-value="{{_newPath}}"
+                placeholder="Enter the new path.">
+          </iron-input>
         </div>
       </gr-dialog>
       <gr-dialog
@@ -148,10 +153,14 @@ limitations under the License.
           on-cancel="_handleDialogCancel">
         <div class="header" slot="header">Restore this file?</div>
         <div class="main" slot="main">
-          <input
+          <iron-input
-              is="iron-input"
               disabled
-              bind-value="{{_path}}"/>
+              bind-value="{{_path}}">
+            <input
+                is="iron-input"
+                disabled
+                bind-value="{{_path}}">
+          </iron-input>
         </div>
       </gr-dialog>
     </gr-overlay>

polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls_test.html

@@ -191,6 +191,9 @@ suite('gr-edit-controls tests', () => {
     let navStub;
     let renameStub;
     let renameAutocomplete;
+    const inputSelector = Polymer.Element ?
+        '.newPathIronInput' :
+        '.newPathInput';
 
     setup(() => {
       navStub = sandbox.stub(Gerrit.Nav, 'navigateToChange');
@@ -210,7 +213,7 @@ suite('gr-edit-controls tests', () => {
         assert.isTrue(queryStub.called);
         assert.isTrue(element.$.renameDialog.disabled);
 
-        element.$.renameDialog.querySelector('.newPathInput').bindValue =
+        element.$.renameDialog.querySelector(inputSelector).bindValue =
             'src/test.newPath';
 
         assert.isFalse(element.$.renameDialog.disabled);
@@ -238,7 +241,7 @@ suite('gr-edit-controls tests', () => {
         assert.isTrue(queryStub.called);
         assert.isTrue(element.$.renameDialog.disabled);
 
-        element.$.renameDialog.querySelector('.newPathInput').bindValue =
+        element.$.renameDialog.querySelector(inputSelector).bindValue =
             'src/test.newPath';
 
         assert.isFalse(element.$.renameDialog.disabled);
@@ -260,7 +263,7 @@ suite('gr-edit-controls tests', () => {
         assert.isTrue(element.$.renameDialog.disabled);
         element.$.renameDialog.querySelector('gr-autocomplete').text =
             'src/test.cpp';
-        element.$.renameDialog.querySelector('.newPathInput').bindValue =
+        element.$.renameDialog.querySelector(inputSelector).bindValue =
             'src/test.newPath';
         assert.isFalse(element.$.renameDialog.disabled);
         MockInteractions.tap(element.$.renameDialog.$$('gr-button'));

polygerrit-ui/app/elements/settings/gr-account-info/gr-account-info.html

@@ -79,12 +79,17 @@ limitations under the License.
         <span
             hidden$="[[!usernameMutable]]"
             class="value">
-          <input
+          <iron-input
-              is="iron-input"
-              id="usernameInput"
               disabled="[[_saving]]"
               on-keydown="_handleKeydown"
               bind-value="{{_username}}">
+            <input
+                is="iron-input"
+                id="usernameInput"
+                disabled="[[_saving]]"
+                on-keydown="_handleKeydown"
+                bind-value="{{_username}}">
+          </iron-input>
         </span>
       </section>
       <section id="nameSection">
@@ -95,24 +100,34 @@ limitations under the License.
         <span
             hidden$="[[!nameMutable]]"
             class="value">
-          <input
+          <iron-input
-              is="iron-input"
-              id="nameInput"
               disabled="[[_saving]]"
               on-keydown="_handleKeydown"
               bind-value="{{_account.name}}">
+            <input
+                is="iron-input"
+                id="nameInput"
+                disabled="[[_saving]]"
+                on-keydown="_handleKeydown"
+                bind-value="{{_account.name}}">
+          </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Status (e.g. "Vacation")</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
-              id="statusInput"
               disabled="[[_saving]]"
               on-keydown="_handleKeydown"
               bind-value="{{_account.status}}">
-          </span>
+            <input
+                is="iron-input"
+                id="statusInput"
+                disabled="[[_saving]]"
+                on-keydown="_handleKeydown"
+                bind-value="{{_account.status}}">
+          </iron-input>
+        </span>
       </section>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>

polygerrit-ui/app/elements/settings/gr-change-table-editor/gr-change-table-editor.html

@@ -16,7 +16,6 @@ limitations under the License.
 -->
 <link rel="import" href="../../../behaviors/gr-change-table-behavior/gr-change-table-behavior.html">
 <link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../shared/gr-button/gr-button.html">
 <link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">

polygerrit-ui/app/elements/settings/gr-cla-view/gr-cla-view.html

@@ -95,7 +95,13 @@ limitations under the License.
         </div>
         <div class$="agreementsTextBox [[_computeHideAgreementClass(_agreementName, _serverConfig.auth.contributor_agreements)]]">
           <h3 class="smallHeading">Complete the agreement:</h3>
-          <input id="input-agreements" is="iron-input" bind-value="{{_agreementsText}}" placeholder="Enter 'I agree' here" />
+          <iron-input bind-value="{{_agreementsText}}"
+                      placeholder="Enter 'I agree' here">
+            <input id="input-agreements"
+                   is="iron-input"
+                   bind-value="{{_agreementsText}}"
+                   placeholder="Enter 'I agree' here">
+          </iron-input>
           <gr-button on-tap="_handleSaveAgreements" disabled="[[_disableAgreementsText(_agreementsText)]]">
             Submit
           </gr-button>

polygerrit-ui/app/elements/settings/gr-edit-preferences/gr-edit-preferences.html

@@ -16,6 +16,7 @@ limitations under the License.
 -->
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
@@ -29,40 +30,64 @@ limitations under the License.
       <section>
         <span class="title">Tab width</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{editPrefs.tab_size}}"
               on-keypress="_handleEditPrefsChanged"
               on-change="_handleEditPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{editPrefs.tab_size}}"
+                on-keypress="_handleEditPrefsChanged"
+                on-change="_handleEditPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Columns</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{editPrefs.line_length}}"
               on-keypress="_handleEditPrefsChanged"
               on-change="_handleEditPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{editPrefs.line_length}}"
+                on-keypress="_handleEditPrefsChanged"
+                on-change="_handleEditPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Indent unit</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{editPrefs.indent_unit}}"
               on-keypress="_handleEditPrefsChanged"
               on-change="_handleEditPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{editPrefs.indent_unit}}"
+                on-keypress="_handleEditPrefsChanged"
+                on-change="_handleEditPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section>

polygerrit-ui/app/elements/settings/gr-email-editor/gr-email-editor.html

@@ -63,14 +63,22 @@ limitations under the License.
             <tr>
               <td class="emailColumn">[[item.email]]</td>
               <td class="preferredControl" on-tap="_handlePreferredControlTap">
-                <input
+                <iron-input
-                    is="iron-input"
                     class="preferredRadio"
                     type="radio"
                     on-change="_handlePreferredChange"
                     name="preferred"
                     value="[[item.email]]"
                     checked$="[[item.preferred]]">
+                  <input
+                      is="iron-input"
+                      class="preferredRadio"
+                      type="radio"
+                      on-change="_handlePreferredChange"
+                      name="preferred"
+                      value="[[item.email]]"
+                      checked$="[[item.preferred]]">
+                </iron-input>
               </td>
               <td>
                 <gr-button

polygerrit-ui/app/elements/settings/gr-menu-editor/gr-menu-editor.html

@@ -85,19 +85,30 @@ limitations under the License.
         <tfoot>
           <tr>
             <th>
-              <input
+              <iron-input
-                  is="iron-input"
                   placeholder="New Title"
                   on-keydown="_handleInputKeydown"
                   bind-value="{{_newName}}">
+                <input
+                    is="iron-input"
+                    placeholder="New Title"
+                    on-keydown="_handleInputKeydown"
+                    bind-value="{{_newName}}">
+              </iron-input>
             </th>
             <th>
-              <input
+              <iron-input
                   class="newUrlInput"
-                  is="iron-input"
                   placeholder="New URL"
                   on-keydown="_handleInputKeydown"
                   bind-value="{{_newUrl}}">
+                <input
+                    class="newUrlInput"
+                    is="iron-input"
+                    placeholder="New URL"
+                    on-keydown="_handleInputKeydown"
+                    bind-value="{{_newUrl}}">
+              </iron-input>
             </th>
             <th></th>
             <th></th>

polygerrit-ui/app/elements/settings/gr-registration-dialog/gr-registration-dialog.html

@@ -16,6 +16,7 @@ limitations under the License.
 -->
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../../styles/gr-form-styles.html">
 <link rel="import" href="../../core/gr-navigation/gr-navigation.html">
 <link rel="import" href="../../shared/gr-button/gr-button.html">
@@ -81,19 +82,27 @@ limitations under the License.
         <hr>
         <section>
           <div class="title">Full Name</div>
-          <input
+          <iron-input
-              is="iron-input"
-              id="name"
               bind-value="{{_account.name}}"
               disabled="[[_saving]]">
+            <input
+                is="iron-input"
+                id="name"
+                bind-value="{{_account.name}}"
+                disabled="[[_saving]]">
+          </iron-input>
         </section>
         <section class$="[[_computeUsernameClass(_usernameMutable)]]">
           <div class="title">Username</div>
-          <input
+          <iron-input
-              is="iron-input"
-              id="username"
               bind-value="{{_account.username}}"
               disabled="[[_saving]]">
+            <input
+                is="iron-input"
+                id="username"
+                bind-value="{{_account.username}}"
+                disabled="[[_saving]]">
+          </iron-input>
         </section>
         <section>
           <div class="title">Preferred Email</div>

polygerrit-ui/app/elements/settings/gr-settings-view/gr-settings-view.html

@@ -16,6 +16,7 @@ limitations under the License.
 -->
 
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 
 <link rel="import" href="../../../behaviors/docs-url-behavior/docs-url-behavior.html">
 <link rel="import" href="/bower_components/paper-toggle-button/paper-toggle-button.html">
@@ -49,7 +50,7 @@ limitations under the License.
       :host {
         color: var(--primary-text-color);
       }
-      #newEmailInput {
+      .newEmailInput {
         width: 20em;
       }
       #email {
@@ -365,14 +366,22 @@ limitations under the License.
           <section>
             <span class="title">New email address</span>
             <span class="value">
-              <input
+              <iron-input
-                  id="newEmailInput"
+                  class="newEmailInput"
                   bind-value="{{_newEmail}}"
-                  is="iron-input"
                   type="text"
                   disabled="[[_addingEmail]]"
                   on-keydown="_handleNewEmailKeydown"
                   placeholder="email@example.com">
+                <input
+                    class="newEmailInput"
+                    bind-value="{{_newEmail}}"
+                    is="iron-input"
+                    type="text"
+                    disabled="[[_addingEmail]]"
+                    on-keydown="_handleNewEmailKeydown"
+                    placeholder="email@example.com">
+              </iron-input>
             </span>
           </section>
           <section

polygerrit-ui/app/elements/settings/gr-watched-projects-editor/gr-watched-projects-editor.html

@@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 <link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
 <link rel="import" href="../../shared/gr-button/gr-button.html">
 <link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
@@ -103,11 +104,15 @@ limitations under the License.
                   placeholder="Repo"></gr-autocomplete>
             </th>
             <th colspan$="[[_getTypeCount()]]">
-              <input
+              <iron-input
-                  id="newFilter"
                   class="newFilterInput"
-                  is="iron-input"
                   placeholder="branch:name, or other search expression">
+                <input
+                    id="newFilter"
+                    class="newFilterInput"
+                    is="iron-input"
+                    placeholder="branch:name, or other search expression">
+              </iron-input>
             </th>
             <th>
               <gr-button link on-tap="_handleAddProject">Add</gr-button>

polygerrit-ui/app/elements/shared/gr-copy-clipboard/gr-copy-clipboard.html

@@ -47,20 +47,29 @@ limitations under the License.
       }
     </style>
     <div class="text">
-        <input id="input" is="iron-input"
+      <iron-input
+          class$="copyText [[_computeInputClass(hideInput)]]"
+          type="text"
+          bind-value="[[text]]"
+          on-tap="_handleInputTap"
+          readonly>
+        <input
+            id="input"
+            is="iron-input"
             class$="copyText [[_computeInputClass(hideInput)]]"
             type="text"
             bind-value="[[text]]"
             on-tap="_handleInputTap"
             readonly>
-        <gr-button id="button"
+      </iron-input>
-            link
+      <gr-button id="button"
-            has-tooltip="[[hasTooltip]]"
+          link
-            class="copyToClipboard"
+          has-tooltip="[[hasTooltip]]"
-            title="[[buttonTitle]]"
+          class="copyToClipboard"
-            on-tap="_copyToClipboard">
+          title="[[buttonTitle]]"
-          <iron-icon id="icon" icon="gr-icons:content-copy"></iron-icon>
+          on-tap="_copyToClipboard">
-        </gr-button>
+        <iron-icon id="icon" icon="gr-icons:content-copy"></iron-icon>
+      </gr-button>
     </div>
   </template>
   <script src="gr-copy-clipboard.js"></script>

polygerrit-ui/app/elements/shared/gr-diff-preferences/gr-diff-preferences.html

@@ -60,43 +60,67 @@ limitations under the License.
       <section>
         <span class="title">Diff width</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
-              id="columnsInput"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{diffPrefs.line_length}}"
               on-keypress="_handleDiffPrefsChanged"
               on-change="_handleDiffPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                id="columnsInput"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{diffPrefs.line_length}}"
+                on-keypress="_handleDiffPrefsChanged"
+                on-change="_handleDiffPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Tab width</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
-              id="tabSizeInput"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{diffPrefs.tab_size}}"
               on-keypress="_handleDiffPrefsChanged"
               on-change="_handleDiffPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                id="tabSizeInput"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{diffPrefs.tab_size}}"
+                on-keypress="_handleDiffPrefsChanged"
+                on-change="_handleDiffPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section hidden$="[[!diffPrefs.font_size]]">
         <span class="title">Font size</span>
         <span class="value">
-          <input
+          <iron-input
-              is="iron-input"
               type="number"
-              id="fontSizeInput"
               prevent-invalid-input
               allowed-pattern="[0-9]"
               bind-value="{{diffPrefs.font_size}}"
               on-keypress="_handleDiffPrefsChanged"
               on-change="_handleDiffPrefsChanged">
+            <input
+                is="iron-input"
+                type="number"
+                id="fontSizeInput"
+                prevent-invalid-input
+                allowed-pattern="[0-9]"
+                bind-value="{{diffPrefs.font_size}}"
+                on-keypress="_handleDiffPrefsChanged"
+                on-change="_handleDiffPrefsChanged">
+          </iron-input>
         </span>
       </section>
       <section>

polygerrit-ui/app/elements/shared/gr-js-api-interface/gr-annotation-actions-js-api_test.html

@@ -30,7 +30,9 @@ limitations under the License.
   <template>
     <span hidden id="annotation-span">
       <label for="annotation-checkbox" id="annotation-label"></label>
-      <input is="iron-input" type="checkbox" id="annotation-checkbox" disabled>
+      <iron-input type="checkbox" disabled>
+        <input is="iron-input" type="checkbox" id="annotation-checkbox" disabled>
+      </iron-input>
     </span>
   </template>
 </test-fixture>

polygerrit-ui/app/elements/shared/gr-list-view/gr-list-view.html

@@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <link rel="import" href="/bower_components/polymer/polymer.html">
+<link rel="import" href="/bower_components/iron-input/iron-input.html">
 
 <link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
 <link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
@@ -68,10 +69,15 @@ limitations under the License.
     <div id="topContainer">
       <div class="filterContainer">
         <label>Filter:</label>
-        <input is="iron-input"
+        <iron-input
             type="text"
-            id="filter"
             bind-value="{{filter}}">
+          <input
+              is="iron-input"
+              type="text"
+              id="filter"
+              bind-value="{{filter}}">
+        </iron-input>
       </div>
       <div id="createNewContainer"
           class$="[[_computeCreateClass(createNew)]]">