feat: Handle DOMError and DOMException gracefully (#1310)

Author: kamilogorek

src/raven.js

@@ -6,10 +6,12 @@ var md5 = require('../vendor/md5/md5');
 var RavenConfigError = require('./configError');
 
 var utils = require('./utils');
+var isErrorEvent = utils.isErrorEvent;
+var isDOMError = utils.isDOMError;
+var isDOMException = utils.isDOMException;
 var isError = utils.isError;
 var isObject = utils.isObject;
 var isPlainObject = utils.isPlainObject;
-var isErrorEvent = utils.isErrorEvent;
 var isUndefined = utils.isUndefined;
 var isFunction = utils.isFunction;
 var isString = utils.isString;
@@ -469,6 +471,23 @@ Raven.prototype = {
     if (isErrorEvent(ex) && ex.error) {
       // If it is an ErrorEvent with `error` property, extract it to get actual Error
       ex = ex.error;
+    } else if (isDOMError(ex) || isDOMException(ex)) {
+      // If it is a DOMError or DOMException (which are legacy APIs, but still supported in some browsers)
+      // then we just extract the name and message, as they don't provide anything else
+      // https://developer.mozilla.org/en-US/docs/Web/API/DOMError
+      // https://developer.mozilla.org/en-US/docs/Web/API/DOMException
+      var name = ex.name || (isDOMError(ex) ? 'DOMError' : 'DOMException');
+      var message = ex.message ? name + ': ' + ex.message : name;
+
+      return this.captureMessage(
+        message,
+        objectMerge(options, {
+          // neither DOMError or DOMException provide stack trace and we most likely wont get it this way as well
+          // but it's barely any overhead so we may at least try
+          stacktrace: true,
+          trimHeadFrames: options.trimHeadFrames + 1
+        })
+      );
     } else if (isError(ex)) {
       // we have a real Error object
       ex = ex;
@@ -480,6 +499,7 @@ Raven.prototype = {
       ex = new Error(options.message);
     } else {
       // If none of previous checks were valid, then it means that
+      // it's not a DOMError/DOMException
       // it's not a plain Object
       // it's not a valid ErrorEvent (one with an error property)
       // it's not an Error

src/utils.js

@@ -12,7 +12,7 @@ function isObject(what) {
 // Yanked from https://git.io/vS8DV re-used under CC0
 // with some tiny modifications
 function isError(value) {
-  switch ({}.toString.call(value)) {
+  switch (Object.prototype.toString.call(value)) {
     case '[object Error]':
       return true;
     case '[object Exception]':
@@ -25,7 +25,15 @@ function isError(value) {
 }
 
 function isErrorEvent(value) {
-  return supportsErrorEvent() && {}.toString.call(value) === '[object ErrorEvent]';
+  return Object.prototype.toString.call(value) === '[object ErrorEvent]';
+}
+
+function isDOMError(value) {
+  return Object.prototype.toString.call(value) === '[object DOMError]';
+}
+
+function isDOMException(value) {
+  return Object.prototype.toString.call(value) === '[object DOMException]';
 }
 
 function isUndefined(what) {
@@ -68,6 +76,24 @@ function supportsErrorEvent() {
   }
 }
 
+function supportsDOMError() {
+  try {
+    new DOMError(''); // eslint-disable-line no-new
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
+
+function supportsDOMException() {
+  try {
+    new DOMException(''); // eslint-disable-line no-new
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
+
 function supportsFetch() {
   if (!('fetch' in _window)) return false;
 
@@ -583,13 +609,17 @@ module.exports = {
   isObject: isObject,
   isError: isError,
   isErrorEvent: isErrorEvent,
+  isDOMError: isDOMError,
+  isDOMException: isDOMException,
   isUndefined: isUndefined,
   isFunction: isFunction,
   isPlainObject: isPlainObject,
   isString: isString,
   isArray: isArray,
   isEmptyObject: isEmptyObject,
   supportsErrorEvent: supportsErrorEvent,
+  supportsDOMError: supportsDOMError,
+  supportsDOMException: supportsDOMException,
   supportsFetch: supportsFetch,
   supportsReferrerPolicy: supportsReferrerPolicy,
   supportsPromiseRejectionEvent: supportsPromiseRejectionEvent,

test/raven.test.js

@@ -23,6 +23,8 @@ _Raven.prototype._getUuid = function() {
 var utils = require('../src/utils');
 var joinRegExp = utils.joinRegExp;
 var supportsErrorEvent = utils.supportsErrorEvent;
+var supportsDOMError = utils.supportsDOMError;
+var supportsDOMException = utils.supportsDOMException;
 var supportsFetch = utils.supportsFetch;
 var supportsReferrerPolicy = utils.supportsReferrerPolicy;
 var supportsPromiseRejectionEvent = utils.supportsPromiseRejectionEvent;
@@ -3124,6 +3126,29 @@ describe('Raven (public API)', function() {
       });
     }
 
+    if (supportsDOMError()) {
+      it('should just pull name and message from DOMError and call captureMessage', function() {
+        var error = new DOMError('pickleRick', 'Morty');
+        this.sinon.stub(Raven, 'isSetup').returns(true);
+        this.sinon.spy(Raven, 'captureMessage');
+        Raven.captureException(error);
+        var call = Raven.captureMessage.getCall(0).args[0];
+        assert.equal(call, 'pickleRick: Morty');
+      });
+    }
+
+    if (supportsDOMException()) {
+      it('should just pull name and message from DOMException and call captureMessage', function() {
+        // Yes, in DOMException order of arguments is reversed...
+        var error = new DOMException('Morty', 'pickleRick');
+        this.sinon.stub(Raven, 'isSetup').returns(true);
+        this.sinon.spy(Raven, 'captureMessage');
+        Raven.captureException(error);
+        var call = Raven.captureMessage.getCall(0).args[0];
+        assert.equal(call, 'pickleRick: Morty');
+      });
+    }
+
     it("should treat Schrodinger's Error in the same way as regular Error", function() {
       // Schrodinger's Error is an object that is and is not an Error at the same time
       // Like... error, but not really.

test/utils.test.js

@@ -12,9 +12,13 @@ var isString = utils.isString;
 var isArray = utils.isArray;
 var isObject = utils.isObject;
 var isEmptyObject = utils.isEmptyObject;
+var isDOMError = utils.isDOMError;
+var isDOMException = utils.isDOMException;
 var isError = utils.isError;
 var isErrorEvent = utils.isErrorEvent;
 var supportsErrorEvent = utils.supportsErrorEvent;
+var supportsDOMError = utils.supportsDOMError;
+var supportsDOMException = utils.supportsDOMException;
 var wrappedCallback = utils.wrappedCallback;
 var joinRegExp = utils.joinRegExp;
 var objectMerge = utils.objectMerge;
@@ -113,6 +117,24 @@ describe('utils', function() {
     });
   }
 
+  if (supportsDOMError()) {
+    describe('isDOMError', function() {
+      it('should work as advertised', function() {
+        assert.isFalse(isDOMError(new Error()));
+        assert.isTrue(isDOMError(new DOMError('')));
+      });
+    });
+  }
+
+  if (supportsDOMException()) {
+    describe('isDOMException', function() {
+      it('should work as advertised', function() {
+        assert.isFalse(isDOMException(new Error()));
+        assert.isTrue(isDOMException(new DOMException('')));
+      });
+    });
+  }
+
   describe('isError', function() {
     function testErrorFromDifferentContext(createError) {
       var iframe = document.createElement('iframe');