2016-08-18 10 views
12

Есть ли способ в Angular2 для улучшения стека вызовов для асинхронного кода? Я всегда думал, что это одна из сильных сторон зоны, чтобы отслеживать контексты исполнения setTimeout(), исходящие события, обещания и т. Д.?Angular2: Better/Deeper Zone Stacks для отладки

Я построил пример plunker, который показывает общий сценарий, который делает невозможным отслеживание ошибки.

У меня есть следующий пример сценария:

@Component({ 
    selector: 'my-component', 
    template: ` 
    <div> 
     <button (click)="doSmth()">Cause an async error!</button> 
    </div> 
    ` 
}) 
export class MyComponent { 
    @Output() error = new EventEmitter<any>(true); 

    public doSmth(): void { 
    this.error.emit('Oh snap!'); 
    } 
} 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <my-component (error)="handleError($event)"></my-component> 
    </div> 
    `, 
}) 
export class App { 
    private error = ""; 

    public handleError(reason: any): void { 
    Promise.reject(reason) 
    } 
} 

@NgModule({ 
    imports: [ BrowserModule ], 
    declarations: [ App, MyComponent ], 
    bootstrap: [ App ] 
}) 
export class AppModule {} 

Plunker: "О! Привязать" https://embed.plnkr.co/rnkxRH9G0FzA3DcBHfKO/

Это отрезала производит асинхронные ошибки при нажатии кнопки. Эта ошибка будет испускаться через EventEmitter, который будет обрабатываться в компоненте App, который просто вызывает необработанное отклонение Promise.

Стек вызовов, которые я получаю теперь выглядит следующим образом:

Error: Oh Snap! 
at resolvePromise (zone.js:538) 
at Function.ZoneAwarePromise.reject (zone.js:594) 
at App.handleError (app.ts:34) 
at DebugAppView._View_App0._handle_error_3_0 (App.ngfactory.js:82) //not my file 
at eval (core.umd.js:12718) 
at eval (core.umd.js:9180) 
at ZoneDelegate.invokeTask (zone.js:356) 
at Object.onInvokeTask (core.umd.js:9236) 
at ZoneDelegate.invokeTask (zone.js:355) 
at Zone.runTask (zone.js:256) 

Который даст мне никаких шансов отследить фактическое триггер ошибки происхождения в более сложных приложениях.

Я также встроил сценарий «long-stack-trace-zone», который не имеет никакого эффекта.

Вопрос: Что мне нужно сделать, чтобы получить лучшие следы стека? Или это вообще возможно?

Заранее спасибо.

ответ

1

Решение состоит в том, чтобы использовать «Chrome DevTools» в режиме разрыва на Exception.

Для этого, в Devtools Chrome, вы должны:

  1. Break on uncaught exceptions
  2. Использование Blackboxing для того, чтобы разорвать только в коде вы заинтересованы в