Sentry

package.json

 {
   "name": "mycard-mobile",
-  "version": "1.0.19",
+  "version": "1.0.20",
   "license": "UNLISENCED",
   "scripts": {
     "ng": "ng",
@@ -26,6 +26,7 @@
     "hammerjs": "^2.0.8",
     "lodash": "^4.17.10",
     "material-design-icons": "^3.0.1",
+    "raven-js": "^3.26.2",
     "rxjs": "^5.5.10",
     "webdav": "^1.5.2",
     "zone.js": "^0.8.26"

src/app/app.module.ts

-import { NgModule } from '@angular/core';
+import { ErrorHandler, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { HttpModule, JsonpModule } from '@angular/http';
 import {
@@ -23,6 +23,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import 'hammerjs';
 import 'rxjs/Rx';
+import * as Raven from 'raven-js';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -37,6 +38,14 @@ import { WatchComponent } from './watch/watch.component';
 import { WindbotComponent } from './windbot/windbot.component';
 import { YGOProService } from './ygopro.service';
 
+Raven.config('https://a43997ca0d3a4aee8640ab90af35144b@sentry.io/1227659').install();
+
+export class RavenErrorHandler implements ErrorHandler {
+  handleError(err: any): void {
+    Raven.captureException(err);
+  }
+}
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -74,7 +83,7 @@ import { YGOProService } from './ygopro.service';
     MatMenuModule,
     MatProgressSpinnerModule
   ],
-  providers: [YGOProService, StorageService],
+  providers: [YGOProService, StorageService, { provide: ErrorHandler, useClass: RavenErrorHandler }],
   bootstrap: [AppComponent],
   entryComponents: [MatchDialogComponent, ResultDialogComponent]
 })

src/app/lobby/lobby.component.html

@@ -25,7 +25,7 @@
   </button>
   <mat-menu #menu="matMenu">
     <a [href]="login.logout()" mat-menu-item>切换用户</a>
-    <button mat-menu-item>大厅版本 {{version}}</button>
+    <button mat-menu-item (click)="error()">大厅版本 {{version}}</button>
     <button mat-menu-item *ngIf="build">应用版本 {{build.version_name}}</button>
   </mat-menu>
 </mat-toolbar>

src/app/lobby/lobby.component.ts

@@ -14,28 +14,31 @@ import { YGOProService } from '../ygopro.service';
   animations: [routerTransition2]
 })
 export class LobbyComponent {
-
-  @HostBinding('@routerTransition2')
-  animation: '';
+  @HostBinding('@routerTransition2') animation: '';
 
   version = environment.version;
   build: BuildConfig;
 
   searchCtrl = new FormControl();
-  suggestion = this.searchCtrl.valueChanges.filter(name => name).flatMap(name => this.jsonp.get('http://www.ourocg.cn/Suggest.aspx', {
-    params: {callback: 'JSONP_CALLBACK', key: name}
-  }).map(response => response.json().result));
+  suggestion = this.searchCtrl.valueChanges.filter(name => name).flatMap(name =>
+    this.jsonp
+      .get('http://www.ourocg.cn/Suggest.aspx', {
+        params: { callback: 'JSONP_CALLBACK', key: name }
+      })
+      .map(response => response.json().result)
+  );
 
   key: string;
 
   arena_url: string;
 
-  constructor(public login: LoginService,
-              public ygopro: YGOProService,
-              private http: Http,
-              private jsonp: Jsonp,
-              public storage: StorageService) {
-
+  constructor(
+    public login: LoginService,
+    public ygopro: YGOProService,
+    private http: Http,
+    private jsonp: Jsonp,
+    public storage: StorageService
+  ) {
     const arena_url = new URL('https://mycard.moe/ygopro/arena');
     arena_url.searchParams.set('sso', login.token);
     this.arena_url = arena_url.toString();
@@ -55,6 +58,10 @@ export class LobbyComponent {
     url.searchParams.set('key', key);
     open(url.toString());
   }
+
+  error() {
+    throw new Error('Sentry test');
+  }
 }
 
 interface BuildConfig {