INT-3328: fix tests

Author: michalnieruchalski-tiugo

tinymce-angular-component/src/test/ts/browser/DisabledPropertyTest.ts

@@ -2,12 +2,14 @@ import { Assertions } from '@ephox/agar';
 import '../alien/InitTestEnvironment';
 
 import { EditorComponent } from '../../../main/ts/public_api';
-import { beforeEach, describe, it } from '@ephox/bedrock-client';
+import { after, before, context, describe, it } from '@ephox/bedrock-client';
 import { eachVersionContext, editorHook } from '../alien/TestHooks';
 import { Editor } from 'tinymce';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
 import { Component, ViewChild } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { VersionLoader } from '@tinymce/miniature';
+import { deleteTinymce } from '../alien/TestHelpers';
 
 describe('DisabledPropertyTest', () => {
   const getMode = (editor: Editor) => {
@@ -108,7 +110,7 @@ describe('DisabledPropertyTest', () => {
     });
   });
 
-  eachVersionContext([ '7' ], () => {
+  context('With version 7', () => {
     @Component({
       imports: [ FormsModule, EditorComponent ],
       template: `<editor [(ngModel)]="text" [disabled]="true" />`,
@@ -120,22 +122,42 @@ describe('DisabledPropertyTest', () => {
       @ViewChild(EditorComponent) public editorRef!: EditorComponent;
     }
 
+    const waitForEditorInitialized = (editor: Editor) => new Promise<void>((resolve) => {
+      if (editor.initialized) {
+        resolve();
+      }
+      editor.once('init', () => resolve());
+    });
+
     let fixture: ComponentFixture<TestHostComponent>;
     let testHost: TestHostComponent;
+    let tinyEditor: Editor;
+
+    before(async () => {
+      await VersionLoader.pLoadVersion('7');
 
-    beforeEach(async () => {
       await TestBed.configureTestingModule({
         imports: [ TestHostComponent ]
       }).compileComponents();
 
       fixture = TestBed.createComponent(TestHostComponent);
       testHost = fixture.componentInstance;
       fixture.detectChanges();
+      tinyEditor = testHost.editorRef.editor!;
+    });
+
+    after(() => {
+      deleteTinymce();
     });
 
-    it('INT-3328: disabled property should work with [ngModel] when TinyMCE has been loaded before editor component has been created', () => {
-      const tinyEditor = testHost.editorRef.editor;
+    it('INT-3328: disabled property should work with [ngModel] when TinyMCE has been loaded before editor component has been created', async () => {
       assertDisabledOption(tinyEditor!, true);
+      /*
+        I have to wait until the editor is fully initialized before using deleteTinymce() in after block.
+        There's for example theme.js script that starts to load after editor instance has been created.
+        If I remove tinymce from window too soon the theme.js will fail alongside with this test case.
+      */
+      await waitForEditorInitialized(tinyEditor!);
     });
   });
 });