standalone working with upgraded js, jupyterlab extension not currenlty working with latest

Author: SimonBiggs

scriptedforms/src/app/phosphor-angular-loader.ts

@@ -20,7 +20,7 @@ import {
 } from '@phosphor/widgets';
 
 import {
-  PromiseDelegate
+  PromiseDelegate, UUID
 } from '@phosphor/coreutils';
 
 import {
@@ -107,6 +107,7 @@ export class AngularWidget<C, M> extends Widget {
 
   constructor(ngComponent: Type<C>, angularLoader: AngularLoader<M>, options?: Widget.IOptions) {
     super(options);
+    console.log(`Created an Angular Widget ${UUID.uuid4()}`)
     angularLoader.loaderReady.promise
     .then(() => {
       this.ngZone = angularLoader.ngZone;
@@ -127,6 +128,7 @@ export class AngularWidget<C, M> extends Widget {
   }
 
   dispose(): void {
+    console.log('AngularWidget DISPOSED')
     this.ngZone.run(() => {
       this.componentRef.destroy();
     });

scriptedforms/src/app/widget.ts

@@ -96,10 +96,12 @@ export class AngularWrapperWidget extends AngularWidget<
   }
 }
 
+const sleep = (ms: number) => new Promise(_ => setTimeout(_, ms));
+
 export class ScriptedFormsWidget extends Widget {
   _context: DocumentRegistry.Context;
   private _content: AngularWrapperWidget;
-  toolbar = new Toolbar();
+  private _toolbar: Toolbar
   id: 'ScriptedForms';
 
   constructor(options: IScriptedFormsWidget.IOptions) {
@@ -112,12 +114,14 @@ export class ScriptedFormsWidget extends Widget {
     this.addClass('scripted-form-widget');
 
     const layout = (this.layout = new BoxLayout());
-    this.toolbar.addClass('jp-NotebookPanel-toolbar');
-    this.toolbar.addClass('custom-toolbar');
-    layout.addWidget(this.toolbar);
-    BoxLayout.setStretch(this.toolbar, 0);
+    const toolbar = new Toolbar();
+    this._toolbar = toolbar;
+    toolbar.addClass('jp-NotebookPanel-toolbar');
+    toolbar.addClass('custom-toolbar');
+    layout.addWidget(toolbar);
+    BoxLayout.setStretch(toolbar, 0);
 
-    const angularWrapperWidgetOptions = Object.assign({ toolbar: this.toolbar }, options);
+    const angularWrapperWidgetOptions = Object.assign({ toolbar }, options);
 
     this._content = new AngularWrapperWidget(angularWrapperWidgetOptions);
     this._content.addClass('form-container');
@@ -126,12 +130,17 @@ export class ScriptedFormsWidget extends Widget {
     BoxLayout.setStretch(this._content, 1);
 
     this._content.initiliseScriptedForms();
+    // sleep(4000).then(() => {this._content.initiliseScriptedForms();});
   }
 
   get content() {
     return this._content;
   }
 
+  get toolbar() {
+    return this._toolbar;
+  }
+
   get revealed() {
     return Promise.resolve();
   }