Skip to content

Commit 894009b

Browse files
committed
fix: ngZone bug
1 parent 9e88f25 commit 894009b

File tree

8 files changed

+25
-29
lines changed

8 files changed

+25
-29
lines changed

src/app/CustomErrorHandler.ts

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,35 @@
1-
import { Injectable } from '@angular/core';
1+
import { Injectable, Injector, NgZone } from '@angular/core';
22
import { Router } from '@angular/router';
33
import { SentryErrorHandler } from '@sentry/angular';
44
import { environment } from 'src/environments/environment';
55
import { TaskManagerService } from './services/task-manager.service';
66
import { UserStateService } from './services/user-state-service';
7-
import { IErrorNavigationState } from './pages/participant/error-page/error-page.component';
7+
import { IErrorNavigationState } from './pages/error-page/error-page.component';
88

99
@Injectable()
1010
export default class CustomErrorHandler extends SentryErrorHandler {
1111
constructor(
1212
private _router: Router,
1313
private taskManager: TaskManagerService,
14-
private userStateService: UserStateService
14+
private userStateService: UserStateService,
15+
private injector: Injector
1516
) {
1617
super();
1718
}
1819

1920
handleError(error: string | Error): void {
20-
this._router.navigate(['/task-error'], {
21-
state: {
22-
taskIndex: this.taskManager?.currentStudyTask?.taskOrder,
23-
studyId: this.taskManager?.currentStudyTask?.studyId,
24-
stackTrace: error instanceof Error ? error.stack : error,
25-
userId: this.userStateService.currentlyLoggedInUserId,
26-
} as IErrorNavigationState,
21+
const ngZone = this.injector.get(NgZone);
22+
ngZone.run(() => {
23+
this._router.navigate(['task-error'], {
24+
state: {
25+
taskIndex: this.taskManager?.currentStudyTask?.taskOrder,
26+
studyId: this.taskManager?.currentStudyTask?.studyId,
27+
stackTrace: error instanceof Error ? error.stack : error,
28+
userId: this.userStateService.currentlyLoggedInUserId,
29+
} as IErrorNavigationState,
30+
});
2731
});
32+
2833
if (environment.production) {
2934
super.handleError(error);
3035
}

src/app/app.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import { OrganizationMemberModule } from './pages/organization-member/organizati
2727
import { SharedModule } from './pages/shared/shared.module';
2828
import { SnackbarComponent } from './services/snackbar/snackbar.component';
2929
import CustomErrorHandler from './CustomErrorHandler';
30+
import { ErrorPageComponent } from './pages/error-page/error-page.component';
3031

3132
export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
3233
return new TranslateHttpLoader(http, '../assets/translate/', '.json');
@@ -35,6 +36,7 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
3536
@NgModule({
3637
declarations: [
3738
AppComponent,
39+
ErrorPageComponent,
3840
LoginComponent,
3941
CrowdSourceLoginComponent,
4042
ConfirmationComponent,

src/app/pages/participant/error-page/error-page.component.html renamed to src/app/pages/error-page/error-page.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@
33
<div style="width: 50%">
44
<h6 style="font-size: 2rem; color: salmon" class="mb-4">We encountered an error.</h6>
55
<div style="font-size: 1.5rem; line-height: normal" class="mb-4">
6-
While running the task, we ran into an error. In order to report this and help us fix it as fast as
6+
While running the platform, we ran into an error. In order to report this and help us fix it as fast as
77
possible, please do the following:
88
</div>
99
<div class="steps-container">
1010
<div class="number-container text">1</div>
1111
<div class="content-container">
1212
<span class="my-3" style="font-size: 1.5rem; line-height: normal">
13-
The task information and error is displayed below. Please click the
13+
The relevant information and error is displayed below. Please click the
1414
<span style="color: #3f51b5">Copy Error</span> button to copy it to your clipboard.
1515
</span>
1616
<div style="background-color: rgb(233, 233, 233); padding: 1rem; border-radius: 8px">

src/app/pages/participant/error-page/error-page.component.ts renamed to src/app/pages/error-page/error-page.component.ts

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { Component, OnInit } from '@angular/core';
22
import { Router } from '@angular/router';
3-
import { SessionStorageService } from '../../../services/sessionStorage.service';
4-
import { SnackbarService } from '../../../services/snackbar/snackbar.service';
3+
import { SessionStorageService } from '../../services/sessionStorage.service';
4+
import { SnackbarService } from '../../services/snackbar/snackbar.service';
55
import { Role } from 'src/app/models/enums';
66
import { UserStateService } from 'src/app/services/user-state-service';
77

@@ -15,15 +15,10 @@ export interface IErrorNavigationState {
1515
@Component({
1616
selector: 'app-error-page',
1717
templateUrl: './error-page.component.html',
18-
styleUrls: ['./error-page.component.scss', '../final-page/final-page.component.scss'],
18+
styleUrls: ['./error-page.component.scss', '../participant/final-page/final-page.component.scss'],
1919
})
2020
export class ErrorPageComponent implements OnInit {
21-
constructor(
22-
private _snackbar: SnackbarService,
23-
private _router: Router,
24-
private _sessionStorage: SessionStorageService,
25-
private _userStateService: UserStateService
26-
) {
21+
constructor(private _router: Router, private _userStateService: UserStateService) {
2722
const params = this._router.getCurrentNavigation()?.extras?.state as IErrorNavigationState;
2823
this.copyableErrString = `User ID: ${params?.userId}\nStudy ID: ${params?.studyId}\nTask Index: ${params?.taskIndex}\n\n${params?.stackTrace}`;
2924
this.copyableErrString = this.copyableErrString.trim();

src/app/pages/participant/participant.module.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,12 @@ import { FinalPageComponent } from './final-page/final-page.component';
1111
import { ConsentDialogComponent } from './participant-dashboard/participant-studies/consent-dialog/consent-dialog.component';
1212
import { TranslateModule } from '@ngx-translate/core';
1313
import { LanguageDialogComponent } from './participant-dashboard/language-dialog/language-dialog.component';
14-
import { ErrorPageComponent } from './error-page/error-page.component';
1514

1615
@NgModule({
1716
declarations: [
1817
ParticipantDashboardComponent,
1918
ParticipantStudiesComponent,
2019
FinalPageComponent,
21-
ErrorPageComponent,
2220
ConsentDialogComponent,
2321
LanguageDialogComponent,
2422
],

src/app/routing/app-routing.module.ts

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { ResetPasswordLoginComponent } from '../pages/landing-page/forgot-passwo
1212
import { StudyBackgroundComponent } from '../pages/landing-page/study-background/study-background.component';
1313
import { NotFoundComponent } from '../pages/landing-page/not-found/not-found.component';
1414
import { BlankComponent } from '../pages/tasks/blank/blank.component';
15-
import { ErrorPageComponent } from '../pages/participant/error-page/error-page.component';
15+
import { ErrorPageComponent } from '../pages/error-page/error-page.component';
1616

1717
const routes: Routes = [
1818
{
@@ -41,10 +41,6 @@ const routes: Routes = [
4141
path: 'playtask',
4242
component: TaskPlayerComponent,
4343
},
44-
{
45-
path: 'error',
46-
component: ErrorPageComponent,
47-
},
4844
{
4945
path: 'studies',
5046
children: [

src/app/services/task-manager.service.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import { StudyTask } from '../models/StudyTask';
2424
import { UserStateService } from './user-state-service';
2525
import { CrowdSourcedUserService } from './crowdsourced-user.service';
2626
import { snapshotToStudyTasks } from './utils';
27-
import { IErrorNavigationState } from '../pages/participant/error-page/error-page.component';
27+
import { IErrorNavigationState } from '../pages/error-page/error-page.component';
2828

2929
@Injectable({
3030
providedIn: 'root',

0 commit comments

Comments
 (0)