Skip to content

Connection errors (net::ERR_CONNECTION_REFUSED) trigger the on-response handler instead of on-error #63

@ghost

Description

If <iron-ajax> makes a request and can't connect to the server (e.g. the webserver is down) it triggers the on-response handler.
I expect it to trigger the on-error handler and set lastError, as it does e.g. for a 404 response.

Possibly related to #19 and #17.

For clarity, below is a complete example (my-elem.html and index.html) and the steps I'm taking.

  • Start a webserver, e.g. python3 -m http.server
  • Open http://localhost:8000
  • Stop the webserver
  • Clicking the first button does <iron-ajax>.generateRequest() → the on-response handler runs and prints ev.detail.response null, ev.detail.xhr.status 0. Afterwards, the xhr.addEventListener('error', …) handler runs (at
    this.rejectCompletes(error);
    ). But my on-error handler doesn't run and lastError is not set.
  • Clicking the second button makes a plain XMLHttpRequest which correctly handles this net::ERR_CONNECTION_REFUSED case by running its onerror handler.
  • my-elem.html
<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="bower_components/iron-ajax/iron-ajax.html">

<dom-module id="my-elem">
  <template>
    <iron-ajax id="ajax" url="/dummy"
      on-response="handleResp"
      on-error="handleErr"></iron-ajax>
    <button on-click="useIronAjax">Iron-Ajax</button>
    <button on-click="useXHR">XmlHttpRequest</button>
  </template>
</dom-module>

<script>
Polymer({
  is: 'my-elem',

  handleResp: function(ev) {
    console.log('Response', ev.detail.response, 'status', ev.detail.xhr.status);
  },

  handleErr: function(ev) {
    console.log('Error');
  },

  useIronAjax: function() {
    this.$.ajax.generateRequest();
  },

  useXHR: function() {
    var xhr = new XMLHttpRequest();
    xhr.onerror = function() {
      console.log('XHR error');
    }
    xhr.open('GET', '/dummy', true);
    xhr.send();
  }
});
</script>
  • index.html
<!DOCTYPE html>
<html>
  <head>
    <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
    <link rel="import" href="my-elem.html">
  </head>
  <body>
    <my-elem></my-elem>
  </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions