Last Updated: February 25, 2016
·
1.263K
· tdebailleul

Sencha Touch 2: Crash reporter

This is a Crash Reporer for Sencha Touch 2, bases on what the Popcorn Maker team did.

app/util/CrashReporter.js

Ext.define('Ext.util.CrashReporter', {
  singleton: true,

  // Number of event to send to the server
  MAX_EVENT_QUEUE_LENGTH: 10,

  // Array containing the list of fired events
  eventQueue: [],

  // Array containing the list of tracked events    
  eventNames: [
    'ready',
    'trackevent'
  ],

  // crashReport object sent to the server
  crashReport: {},

  parseUrl: function (href) {
    var l = document.createElement("a");
    l.href = href;
    return l;
  },

  // Only deal with errors we cause (i.e., same origin scripts).
  shouldHandle: function (url) {
    var uriScript = this.parseUrl(url);
    return uriScript.hostname === window.location.hostname;
  },

  addEventToQueue: function (e) {
    this.eventQueue.push(e);
    if ( this.eventQueue.length > this.MAX_EVENT_QUEUE_LENGTH) {
      this.eventQueue.shift();
    }
  },

  init: function () {
    var me = this;

    Ext.Array.each(me.eventNames, function(name, index, events) {
      // Listen to the event and call this.addEventToQeue when fired
    }, this);

    // Cache existing window.onerror
    var _onerror = window.onerror ? window.onerror : function () { return true; };

    window.onerror = function (message, url, lineno) {
      if (!window.XMLHttpRequest) {
        return _onerror();
      }

      if (!me.shouldHandle(url)) {
        return _onerror();
      }

      function attemptRecovery() {
        window.onbeforeunload = null;
        window.location.reload(true);
      }

      function sendErrorReportSuccess() {
        attemptRecovery();
      }

      function sendErrorReportFailure() {
        attemptRecovery();
      }

      function sendErrorReport() {
        // Ext.Ajax.request to send the report to the server
        Ext.Ajax.request({
          url: YOUR_CRASH_REPORT_URL,
          params: me.crashReport,
          method: 'POST',
          success: sendErrorReportSuccess,
          failure: sendErrorReportFailure,
          scope: this
        });
      }

      me.crashReport = {
        date: (new Date()).toDateString(),
        message: message,
        appUrl: window.location.href,
        scriptUrl: url,
        lineno: lineno,
        eventList: me.eventQueue,
        userAgent: navigator.userAgent
      };

      try {
        sendErrorReport();
      } catch(e) {
        attemptRecovery();
      }

      return _onerror();
    };
  }
}, function () {
  Ext.onSetup(function () {
    Ext.CrashReporter = Ext.util.CrashReporter;
  });
});

app.js

Ext.Loader.setPath({
  'Ext.util.CrashReporter': './app/util/CrashReporter.js'
});

...

requires: [
  'Ext.util.CrashReporter'
]

...

launch: function () {
  Ext.CrashReporter.init();
  ...
}

--

Also: David Humphrey's article (Web App JavaScript Crash Reporting)[http://vocamus.net/dave/?p=1532],
Original (crashreport.js)[https://github.com/mozilla/butter/blob/master/src/crashreporter.js]