6

我不是在寻找如何调试 javascript。我对手头的工具非常熟悉，虽然不熟悉 Firefox 的新调试，因为他们构建了自己的“萤火虫”。

我真的只是在寻找一种简单的方法来读取堆栈跟踪，因为对象/函数很容易被传递以通过 Ember 自己的调用机制运行。很容易忘记正在调用的函数以及它所附加的 this 的绑定。有没有人在调试 ember 的堆栈时想到任何技巧或肺炎？

更新： 这不是异步调试的问题http://www.html5rocks.com/en/tutorials/developertools/async-call-stack/

4

1 回答 1

6

首先，您将要使用 ember 的调试版本，而不是缩小的生产版本。这将在控制台中为您提供更好的 ember 信息。

其次，对我有很大帮助的事情是在我的路由、视图和控制器的所有事件中添加调试。

我的主 App 类上有一个名为 debugMode 的属性，然后是一个日志函数。

window.App = Ember.Application.create({

    debugMode: false,

    log: function(message, location, data) {
      if (this.debugMode) {
        if (data != null) {
          if (typeof data === 'object') {
            data = Ember.inspect(data);
          }
          console.log('DEBUG: ' + this.appName + ' : ' + location + ' : ' + message);
          return console.log('DEBUG: ' + this.appName + ' : (continued) data: ' + data);
        } else {
          return console.log('DEBUG: ' + this.appName + ' : ' + location + ' : ' + message);
        }
    }
}

日志函数接收消息、位置，然后是可选的相关数据。

因此，下面是两个日志记录示例：

  1. 记录一个函数，并传入数据

    App.ProfileController = Ember.ObjectController.extend({

  setProfile: function() {
    App.log("setting current user's profile", 'App.ProfileController.setProfile', App.currentUser);
  //do other stuff with the profile
  }
})

  2. 记录控制器/视图/路由的初始化

    App.EventController = Ember.ObjectController.extend({
  init: function() {
    this._super();
    App.log('initializing event controller', 'App.EventController.init');
    return this.set('isLoading', false);
  }
})

然后，您将获得很好的控制台信息，以尝试诊断问题发生的位置，如下所示：

DEBUG: My App Name : App.ApplicationController : application controller initializing
DEBUG: My App Name : App.ApplicationRoute.setupController : setupController called
DEBUG: My App Name : (continued) data: {target: <App.Router:ember249>, namespace: App, container: [object Object], _debugContainerKey: 
DEBUG: My App Name : App.accountController.setCurrentUser : setting applications currentUser object
DEBUG: My App Name : (continued) data: {"id":3,"username":"bob","firstName":"Bob","lastName":"W","updatedAt":"2013-04-16T06:29:39.731Z"}
DEBUG: My App Name : App.EventController.init : initializing event controller
DEBUG: My App Name : App.EventRoute.setupController : setupController called
DEBUG: My App Name : (continued) data: {target: <App.Router:ember249>, namespace: App, container: [object Object], _debugContainerKey: controller:event, _childContainers: [object Object], isLoading: false}

最后，使用调试

debugger;

在视图/路由/控制器内部

和

{{debugger}}

在你的模板里面

并从控制台或内联使用

Ember.inspect(YOUR_OBJECT);

查看 ember 信息。

于 2013-04-16T23:44:41.090 回答