Fix oppia#15413: ViewDestroyedError Frontend flake and other flakes a…

…lso present. (oppia#16030) * Fix ViewDestroyedError frontend flake * Fix more FE flakes
aishacodes · Sep 10, 2022 · 7751fb0 · 7751fb0
1 parent 40a1d9c
commit 7751fb0
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 3 deletions.
diff --git a/...es/pages/blog-dashboard-page/modal-templates/upload-blog-post-thumbnail.component.spec.ts b/...es/pages/blog-dashboard-page/modal-templates/upload-blog-post-thumbnail.component.spec.ts
@@ -26,7 +26,7 @@ import { ImageUploaderComponent } from 'components/forms/custom-forms-directives
 import { WindowDimensionsService } from 'services/contextual/window-dimensions.service';
 import { of } from 'rxjs';
 
-describe('Upload Blog Post Thumbnail Modal Component', () => {
+describe('Upload Blog Post Thumbnail Component', () => {
   let fixture: ComponentFixture<UploadBlogPostThumbnailComponent>;
   let componentInstance: UploadBlogPostThumbnailComponent;
   let windowDimensionsService: WindowDimensionsService;

diff --git a/...mplates/pages/blog-dashboard-page/modal-templates/upload-blog-post-thumbnail.component.ts b/...mplates/pages/blog-dashboard-page/modal-templates/upload-blog-post-thumbnail.component.ts
@@ -94,8 +94,15 @@ export class UploadBlogPostThumbnailComponent implements OnInit {
         this.uploadedImage = decodeURIComponent(
           (e.target as FileReader).result as string);
       }
-      this.changeDetectorRef.detectChanges();
-      this.initializeCropper();
+      try {
+        this.changeDetectorRef.detectChanges();
+        this.initializeCropper();
+      } catch (viewDestroyedError) {
+        // This try catch block handles the following error in FE tests:
+        // ViewDestroyedError:
+        //   Attempt to use a destroyed view: detectChanges thrown.
+        // No further action is needed.
+      }
     };
     reader.readAsDataURL(file);
   }

diff --git a/core/templates/pages/contributor-dashboard-page/contributor-dashboard-page.component.spec.ts b/core/templates/pages/contributor-dashboard-page/contributor-dashboard-page.component.spec.ts
@@ -163,6 +163,11 @@ describe('Contributor dashboard page', () => {
       fakeAsync(() => {
         getTranslatableTopicNamesAsyncSpy.and.returnValue(
           Promise.resolve([]));
+        // The `topicName` is set to undefined below since ngOnInit() does not
+        // initialize the variable as undefined. This means that if another
+        // frontend test is run before this test, the topicName will be set to
+        // the value of the previous test.
+        component.topicName = undefined;
 
         component.ngOnInit();
         tick();

diff --git a/core/templates/pages/exploration-editor-page/preview-tab/preview-tab.component.spec.ts b/core/templates/pages/exploration-editor-page/preview-tab/preview-tab.component.spec.ts
@@ -37,6 +37,7 @@ import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ExplorationDataService } from '../services/exploration-data.service';
 import { ExplorationBackendDict } from 'domain/exploration/ExplorationObjectFactory';
 import { NumberAttemptsService } from 'pages/exploration-player-page/services/number-attempts.service';
+import { RouterService } from '../services/router.service';
 
 
 class MockNgbModalRef {
@@ -67,6 +68,7 @@ describe('Preview Tab Component', () => {
   let explorationParamChangesService: ExplorationParamChangesService;
   let explorationStatesService: ExplorationStatesService;
   let graphDataService: GraphDataService;
+  let routerService: RouterService;
   let stateEditorService: StateEditorService;
   let stateObjectFactory: StateObjectFactory;
   let paramChangeObjectFactory: ParamChangeObjectFactory;
@@ -129,6 +131,7 @@ describe('Preview Tab Component', () => {
     fixture = TestBed.createComponent(PreviewTabComponent);
     component = fixture.componentInstance;
     numberAttemptsService = TestBed.inject(NumberAttemptsService);
+    routerService = TestBed.inject(RouterService);
     paramChangeObjectFactory = TestBed.inject(ParamChangeObjectFactory);
     stateObjectFactory = TestBed.inject(StateObjectFactory);
     explorationEngineService = TestBed.inject(ExplorationEngineService);
@@ -236,6 +239,7 @@ describe('Preview Tab Component', () => {
     fakeAsync(() => {
       spyOn(explorationFeaturesService, 'areParametersEnabled')
         .and.returnValue(false);
+      spyOn(routerService, 'navigateToMainTab');
       component.allParams = {};
 
       expect(component.showParameterSummary()).toBe(false);
@@ -255,6 +259,7 @@ describe('Preview Tab Component', () => {
       flushMicrotasks();
 
       expect(ngbModal.open).toHaveBeenCalled();
+      expect(routerService.navigateToMainTab).toHaveBeenCalled();
     }));
 
   it('should getManualParamChanges', fakeAsync(() => {