【问题标题】：Firefox doesn't show custom error messagesFirefox 不显示自定义错误消息
【发布时间】：2016-09-19 18:06:56
【问题描述】：

我正在尝试使用以下代码在 CoffeeScript 中创建一个可扩展的错误类：

class @ExtendableError extends Error
  constructor: (message = '') ->
    super message

    Object.defineProperty @, 'message',
      configurable: true
      enumerable : false
      value : message
      writable : true

    Object.defineProperty @, 'name',
      configurable: true
      enumerable : false
      value : @.constructor.name
      writable : true

    Object.defineProperty @, 'stack',
      configurable: true
      enumerable : false
      value : (new Error(message)).stack
      writable : true

当我尝试使用此代码在 Firefox 中引发以下错误之一时：

throw new ExtendableError('An error message');

我只会将[object Object] 打印到控制台。

当我抛出一个内置错误时：

throw new Error('An error message');

我将所需的错误消息打印到控制台：Error: An error message。

应该注意Error.toString() 和ExtendableError.toString() 都可以正常工作。所以我完全不知道发生了什么。

我在 Chrome 中测试了相同的代码没有问题，我在 Google 中搜索了我们的代码，但没有运气。

有什么想法吗？

更新 1：

有人要求我包含生成的 JavaScript 代码。所以这里是：

// Generated by CoffeeScript 1.10.0
(function() {
  var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
    hasProp = {}.hasOwnProperty;

  this.ExtendableError = (function(superClass) {
    extend(ExtendableError, superClass);

    function ExtendableError(message) {
      if (message == null) {
        message = '';
      }
      ExtendableError.__super__.constructor.call(this, message);
      Object.defineProperty(this, 'message', {
        configurable: true,
        enumerable: false,
        value: message,
        writable: true
      });
      Object.defineProperty(this, 'name', {
        configurable: true,
        enumerable: false,
        value: this.constructor.name,
        writable: true
      });
      Object.defineProperty(this, 'stack', {
        configurable: true,
        enumerable: false,
        value: (new Error(message)).stack,
        writable: true
      });
    }

    return ExtendableError;

  })(Error);

}).call(this);

【问题讨论】：

标签： javascript firefox exception coffeescript console

【解决方案1】：

我将您的文件放在 lib/Error.coffee 中。然后我转换为 Javascript：

 coffee --compile --output dist lib

它创建了文件dist/Error.js。

然后我用这个简单的页面运行你的代码：

 <!DOCTYPE html>
 <html>
 <body>
   <script src="dist/Error.js"></script>
   <script>
     throw new ExtendableError('example error');
   </script>
 </body>
 </html>

我在 Linux 中使用 Firefox 46.0.1 进行了一些测试，但没有发现任何问题，请看我的屏幕截图：

带有检查元素的 Firefox

Firefox 与 Firebug

铬

它在 Chrome 中非常相似。

我猜问题出在你代码的另一部分，也许你正在捕获异常并且你正在用它做一些事情。

如果问题在您的 Firefox 安装中仍然存在，并且您认为它与浏览器的版本有关，您可以使用 BrowserStack 在许多不同版本的浏览器和许多不同的操作系统上测试您的代码。

【讨论】：

你能尝试从 Firefox 的控制台抛出错误吗？现在我认为这个错误只在从控制台抛出 Error 的子类时出现。我也会尝试复制你的结果。
我在控制台中运行“throw new ExtendableError('foo');”它在 Firebug 中有类似的输出，但是在“检查元素”中出现 [object Object]，就像你说的那样
是firefox的“Inspect Element”的问题，我会调查的

【解决方案2】：

我用 ES6 编写了以下代码来生成可扩展的错误，它适用于 Chrome、Firefox 和 Opera。

class CustomError extends Error{ constructor(msg){ super(); console.log(`CustomError: ${msg}`); } }

所以我认为问题在于coffeescript 是如何编译你的代码的。

【讨论】：