Replace iron-{ajax/request} with gr- wrappers

This removes the repetitiveness of always having to specify json-prefix and debounce-duration on requests with the auto attribute set. Change-Id: I0ef6b752866602742621d98d4b4666bc977c8b47
2015-12-09 13:02:48 -05:00 · 2015-12-09 13:02:48 -05:00 · 5f7e6df39e
commit 5f7e6df39e
parent 38045359ea
9 changed files with 121 additions and 69 deletions
--- a/polygerrit-ui/app/elements/gr-ajax.html
+++ b/polygerrit-ui/app/elements/gr-ajax.html
@ -15,14 +15,19 @@ limitations under the License.
 -->

 <link rel="import" href="../bower_components/polymer/polymer.html">
+<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">

 <dom-module id="gr-ajax">
  <template>
    <iron-ajax id="xhr"
-        auto="{{auto}}"
-        url="{{url}}"
-        params="{{params}}"
+        auto="[[auto]]"
+        url="[[url]]"
+        params="[[params]]"
        json-prefix=")]}'"
+        last-response="{{lastResponse}}"
+        loading="{{loading}}"
+        on-response="_handleResponse"
+        on-error="_handleError"
        debounce-duration="300"></iron-ajax>
  </template>
  <script>
@ -32,12 +37,31 @@ limitations under the License.
    Polymer({
      is: 'gr-ajax',

+      /**
+       * Fired when a response is received.
+       * This event does not have a gr- prefix in order to maintain a similar
+       * API to iron-ajax.
+       *
+       * @event response
+       */
+
+      /**
+       * Fired when an error is received.
+       * This event does not have a gr- prefix in order to maintain a similar
+       * API to iron-ajax.
+       *
+       * @event error
+       */
+
      hostAttributes: {
        hidden: true
      },

      properties: {
-        auto: Boolean,
+        auto: {
+          type: Boolean,
+          value: false,
+        },
        url: String,
        params: {
          type: Object,
@ -45,23 +69,26 @@ limitations under the License.
            return {};
          },
        },
-        response: {
+        lastResponse: {
          type: Object,
          notify: true,
        },
+        loading: {
+          type: Boolean,
+          notify: true,
+        },
      },

-      listeners: {
-        'xhr.response': '_handleResponse',
-        'xhr.error': '_handleResponse',
+      generateRequest: function() {
+        return this.$.xhr.generateRequest();
      },

      _handleResponse: function(e, req) {
-        if (req.status >= 200 && req.status < 300) {
-          this.response = req.response;
-        } else {
-          this.response = {};
-        }
+        this.fire('response', req, {bubbles: false});
+      },
+
+      _handleError: function(e, req) {
+        this.fire('error', req, {bubbles: false});
      },

    });
--- a/polygerrit-ui/app/elements/gr-app.html
+++ b/polygerrit-ui/app/elements/gr-app.html
@ -84,8 +84,8 @@ limitations under the License.
        margin-left: var(--default-horizontal-margin);
      }
    </style>
-    <gr-ajax auto url="/accounts/self/detail" response="{{account}}"></gr-ajax>
-    <gr-ajax auto url="/config/server/info" response="{{config}}"></gr-ajax>
+    <gr-ajax auto url="/accounts/self/detail" last-response="{{account}}"></gr-ajax>
+    <gr-ajax auto url="/config/server/info" last-response="{{config}}"></gr-ajax>
    <header role="banner">
      <a href="/" class="bigTitle">PolyGerrit</a>
      <div class="headerRightItems">
--- a/polygerrit-ui/app/elements/gr-change-list-view.html
+++ b/polygerrit-ui/app/elements/gr-change-list-view.html
@ -15,7 +15,7 @@ limitations under the License.
 -->

 <link rel="import" href="../bower_components/polymer/polymer.html">
-<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">
+<link rel="import" href="gr-ajax.html">
 <link rel="import" href="gr-change-list.html">

 <dom-module id="gr-change-list-view">
@ -45,13 +45,11 @@ limitations under the License.
        display: none !important;
      }
    </style>
-    <iron-ajax
+    <gr-ajax
        auto
        url="/changes/"
        params="[[_computeQueryParams(query, offset)]]"
-        json-prefix=")]}'"
-        last-response="{{_changes}}"
-        debounce-duration="300"></iron-ajax>
+        last-response="{{_changes}}"></gr-ajax>
    <gr-change-list changes="{{_changes}}"></gr-change-list>
    <nav>
      <a href$="[[_computeNavLink(query, offset, -1)]]"
--- a/polygerrit-ui/app/elements/gr-change-view.html
+++ b/polygerrit-ui/app/elements/gr-change-view.html
@ -16,7 +16,7 @@ limitations under the License.

 <link rel="import" href="../bower_components/polymer/polymer.html">
 <link rel="import" href="../bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
-<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">
+<link rel="import" href="gr-ajax.html">
 <link rel="import" href="gr-date-formatter.html">
 <link rel="import" href="gr-file-list.html">
 <link rel="import" href="gr-messages-list.html">
@ -64,16 +64,14 @@ limitations under the License.
        padding: 0 var(--default-horizontal-margin) 10px;
      }
    </style>
-    <iron-ajax id="detailXHR"
+    <gr-ajax id="detailXHR"
        url="[[_computeDetailPath(changeNum)]]"
        params="[[_computeDetailQueryParams()]]"
-        json-prefix=")]}'"
        last-response="{{change}}"
-        loading="{{_loading}}"></iron-ajax>
-    <iron-ajax id="commentsXHR"
+        loading="{{_loading}}"></gr-ajax>
+    <gr-ajax id="commentsXHR"
        url="[[_computeCommentsPath(changeNum)]]"
-        json-prefix=")]}'"
-        last-response="{{comments}}"></iron-ajax>
+        last-response="{{comments}}"></gr-ajax>
    <template is="dom-if" if="{{_loading}}">
      <div class="container loading">Loading...</div>
    </template>
--- a/polygerrit-ui/app/elements/gr-dashboard-view.html
+++ b/polygerrit-ui/app/elements/gr-dashboard-view.html
@ -29,13 +29,11 @@ limitations under the License.
        width: 100%;
      }
    </style>
-    <iron-ajax id="xhr"
+    <gr-ajax
        auto
        url="/changes/"
        params="[[_computeQueryParams()]]"
-        last-response="{{_results}}"
-        json-prefix=")]}'"
-        debounce-duration="300"></iron-ajax>
+        last-response="{{_results}}"></gr-ajax>
    <gr-change-list groups="{{_results}}"
        group-titles="[[_groupTitles]]"></gr-change-list>
  </template>
--- a/polygerrit-ui/app/elements/gr-diff-comment.html
+++ b/polygerrit-ui/app/elements/gr-diff-comment.html
@ -17,8 +17,8 @@ limitations under the License.
 <link rel="import" href="../bower_components/polymer/polymer.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-ajax/iron-request.html">
 <link rel="import" href="gr-date-formatter.html">
+<link rel="import" href="gr-request.html">

 <dom-module id="gr-diff-comment">
  <template>
@ -321,16 +321,11 @@ limitations under the License.
      },

      _send: function(method, url) {
-        var xhr = document.createElement('iron-request');
+        var xhr = document.createElement('gr-request');
        this._xhrPromise = xhr.send({
          method: method,
-          headers: {
-            'Content-Type': 'application/json',
-            'X-Gerrit-Auth': util.getCookie('XSRF_TOKEN'),
-          },
          url: url,
          body: this.comment,
-          jsonPrefix: ')]}\'',
        });
        return this._xhrPromise;
      },
--- a/polygerrit-ui/app/elements/gr-diff-view.html
+++ b/polygerrit-ui/app/elements/gr-diff-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-a11y-keys-behavior/iron-a11y-keys-behavior.html">
+<link rel="import" href="gr-ajax.html">
 <link rel="import" href="gr-diff-comment-thread.html">

 <dom-module id="gr-diff-view">
@ -106,45 +107,33 @@ limitations under the License.
        background-color: #9f9;
      }
    </style>
-    <iron-ajax id="changeDetailXHR"
+    <gr-ajax id="changeDetailXHR"
        auto
        url="[[_computeChangeDetailPath(_changeNum)]]"
        params="[[_computeChangeDetailQueryParams()]]"
-        json-prefix=")]}'"
-        last-response="{{_change}}"
-        debounce-duration="300"></iron-ajax>
-    <iron-ajax
-        id="diffXHR"
+        last-response="{{_change}}"></gr-ajax>
+    <gr-ajax id="diffXHR"
        url="[[_computeDiffPath(_changeNum, _patchNum, _path)]]"
-        json-prefix=")]}'"
-        on-response="_handleDiffResponse"></iron-ajax>
-    <iron-ajax
-        id="leftCommentsXHR"
+        on-response="_handleDiffResponse"></gr-ajax>
+    <gr-ajax id="leftCommentsXHR"
        url="[[_computeCommentsPath(_changeNum, _basePatchNum)]]"
        json-prefix=")]}'"
-        on-response="_handleLeftCommentsResponse"></iron-ajax>
-    <iron-ajax
-        id="rightCommentsXHR"
+        on-response="_handleLeftCommentsResponse"></gr-ajax>
+    <gr-ajax id="rightCommentsXHR"
        url="[[_computeCommentsPath(_changeNum, _patchNum)]]"
-        json-prefix=")]}'"
-        on-response="_handleRightCommentsResponse"></iron-ajax>
+        on-response="_handleRightCommentsResponse"></gr-ajax>
    <!-- TODO(andybons): This is populated in gr-change-view. Use that instead
         of incurring an extra ajax call. -->
-    <iron-ajax
-        id="filesXHR"
+    <gr-ajax id="filesXHR"
        url="[[_computeFilesPath(_changeNum, _patchNum)]]"
-        json-prefix=")]}'"
-        on-response="_handleFilesResponse"></iron-ajax>
-    <iron-ajax
-        id="leftDraftsXHR"
+        on-response="_handleFilesResponse"></gr-ajax>
+    <gr-ajax id="leftDraftsXHR"
        url="[[_computeDraftsPath(_changeNum, _basePatchNum)]]"
-        json-prefix=")]}'"
-        on-response="_handleLeftDraftsResponse"></iron-ajax>
-    <iron-ajax
-        id="rightDraftsXHR"
+        on-response="_handleLeftDraftsResponse"></gr-ajax>
+    <gr-ajax id="rightDraftsXHR"
        url="[[_computeDraftsPath(_changeNum, _patchNum)]]"
-        json-prefix=")]}'"
-        on-response="_handleRightDraftsResponse"></iron-ajax>
+        on-response="_handleRightDraftsResponse"></gr-ajax>
+
    <h3>
      <a href$="[[_computeChangePath(_changeNum)]]">[[_changeNum]]</a><span>:</span>
      <span>[[_change.subject]]</span> — <span>[[params.path]]</span>
@ -480,7 +469,7 @@ limitations under the License.
        el.comments = comments;
        el.changeNum = this._changeNum;
        // Assign the element's patchNum to the right side patchNum if the
-        // passed patchNum is 'PARENT' do to the odd behavior of the REST API.
+        // passed patchNum is 'PARENT' due to the odd behavior of the REST API.
        // Don't overwrite patchNum since 'PARENT' is used for other properties.
        el.patchNum = patchNum == 'PARENT' ? this._patchNum : patchNum;

--- a/polygerrit-ui/app/elements/gr-file-list.html
+++ b/polygerrit-ui/app/elements/gr-file-list.html
@ -15,6 +15,7 @@ limitations under the License.
 -->

 <link rel="import" href="../bower_components/polymer/polymer.html">
+<link rel="import" href="gr-ajax.html">

 <dom-module id="gr-file-list">
  <template>
@ -43,10 +44,9 @@ limitations under the License.
        width: 20px;
      }
    </style>
-    <iron-ajax id="xhr"
+    <gr-ajax id="xhr"
        url="[[_computeFilesURL(changeNum, revision)]]"
-        json-prefix=")]}'"
-        on-response="_handleResponse"></iron-ajax>
+        on-response="_handleResponse"></gr-ajax>
    <div class="tableContainer">
      <table>
        <tr>
--- a/polygerrit-ui/app/elements/gr-request.html
+++ b/polygerrit-ui/app/elements/gr-request.html
@ -0,0 +1,47 @@
+<!--
+Copyright (C) 2015 The Android Open Source Project
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+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-ajax/iron-request.html">
+
+<dom-module id="gr-request">
+  <template>
+    <iron-request id="xhr"></iron-request>
+  </template>
+  <script>
+  (function() {
+    'use strict';
+
+    Polymer({
+      is: 'gr-request',
+
+      hostAttributes: {
+        hidden: true
+      },
+
+      send: function(options) {
+        options.headers = options.headers || {};
+        options.headers['content-type'] =
+            options.headers['content-type'] || 'application/json';
+        options.headers['x-gerrit-auth'] = options.headers['x-gerrit-auth'] ||
+            util.getCookie('XSRF_TOKEN');
+        options.jsonPrefix = options.jsonPrefix || ')]}\'';
+        return this.$.xhr.send(options);
+      },
+    });
+  })();
+  </script>
+</dom-module>