From 0f0a82389910b94f418f45a42101b083e660431c Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Tue, 29 Sep 2020 14:23:59 -0700
Subject: [PATCH 01/13] add different event to startup

---
 kbase-extension/static/kbase/js/kbaseNarrative.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index db7addf7c0..74d4eef3bd 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -292,7 +292,6 @@ define([
                         isReady: Jupyter.notebook.kernel && Jupyter.notebook.kernel.is_connected()
                     }
                 );
-                console.log('emitted kernel-state-changed event, probably not ready!');
             });
         });
         $([Jupyter.events]).on('delete.Cell', function () {
@@ -784,7 +783,7 @@ define([
                     this.sidePanel.render();
                 }.bind(this));
 
-            $([Jupyter.events]).on('kernel_ready.Kernel',
+            $([Jupyter.events]).on('kernel_connected.Kernel',
                 (e) => {
                     this.loadingWidget.updateProgress('kernel', true);
                     this.jobCommChannel = new JobCommChannel();

From 0b0b9a5625da40175bd94dce42a88ef40cf6e103 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Sun, 4 Oct 2020 23:42:17 -0700
Subject: [PATCH 02/13] add a different event for detecting kernel connections,
 some cleanup and additional tests

---
 .../static/kbase/js/kbaseNarrative.js         | 2006 +++++++++--------
 test/unit/spec/kbaseNarrativeSpec.js          |  102 +-
 2 files changed, 1185 insertions(+), 923 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 74d4eef3bd..64d84021f8 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -42,9 +42,7 @@ define([
     'kb_service/utils',
     'widgets/loadingWidget',
     'kb_service/client/workspace',
-    // for effect
     'bootstrap',
-
 ], function (
     $,
     Promise,
@@ -85,19 +83,19 @@ define([
     KBaseNarrativePrestart.loadJupyterEvents();
 
     /**
-     * @constructor
-     * The base, namespaced Narrative object. This is mainly used at start-up time, and
-     * gets injected into the Jupyter namespace.
-     *
-     * Most of its methods below - init, registerEvents, initAboutDialog, initUpgradeDialog,
-     * checkVersion, updateVersion - are set up at startup time.
-     * This is all done by an injection into static/notebook/js/main.js where the
-     * Narrative object is set up, and Narrative.init is run.
-     *
-     * But, this also has a noteable 'Save' method, that implements another Narrative-
-     * specific piece of functionality. See Narrative.prototype.saveNarrative below.
-     */
-    var Narrative = function () {
+    * @constructor
+    * The base, namespaced Narrative object. This is mainly used at start-up time, and
+    * gets injected into the Jupyter namespace.
+    *
+    * Most of its methods below - init, registerEvents, initAboutDialog, initUpgradeDialog,
+    * checkVersion, updateVersion - are set up at startup time.
+    * This is all done by an injection into static/notebook/js/main.js where the
+    * Narrative object is set up, and Narrative.init is run.
+    *
+    * But, this also has a noteable 'Save' method, that implements another Narrative-
+    * specific piece of functionality. See Narrative.prototype.saveNarrative below.
+    */
+    const Narrative = function () {
         // Maximum narrative size that can be stored in the workspace.
         // This is set by nginx on the backend - this variable is just for
         // communication on error.
@@ -149,14 +147,14 @@ define([
 
         this.loadingWidget = new LoadingWidget({
             node: document.querySelector('#kb-loading-blocker'),
-            timeout: 20000
+            timeout: 20000,
         });
 
         //Jupyter.keyboard_manager.disable();
         return this;
     };
 
-    Narrative.prototype.isLoaded = function () {
+    Narrative.prototype.isLoaded = () => {
         return Jupyter.notebook._fully_loaded;
     };
 
@@ -165,931 +163,1115 @@ define([
         return testMode.toLowerCase() === uiMode;
     };
 
-    Narrative.prototype.getAuthToken = function () {
-        return NarrativeLogin.getAuthToken();
-    };
-
-    Narrative.prototype.getNarrativeRef = function () {
-        return Promise.try(() => {
-            if (this.workspaceRef) {
-                return this.workspaceRef;
-            }
-            else {
-                return new Workspace(Config.url('workspace'), {token: this.getAuthToken()})
-                    .get_workspace_info({id: this.workspaceId})
-                    .then((wsInfo) => {
-                        let narrId = wsInfo[8]['narrative'];
-                        this.workspaceRef = this.workspaceId + '/' + narrId;
-                        return this.workspaceRef;
-                    });
-            }
-        });
-    };
-
-    Narrative.prototype.getUserPermissions = function () {
-        return new Workspace(Config.url('workspace'), {token: this.getAuthToken()})
-            .get_workspace_info({id: this.workspaceId})
-            .then((wsInfo) => {
-                return wsInfo[5];
-            });
-    }
-
-    /**
-     * A wrapper around the Jupyter.notebook.kernel.execute() function.
-     * If any KBase widget needs to make a kernel call, it should go through here.
-     * ...when it's done.
-     */
-    Narrative.prototype.executeKernelCall = function () {
-        console.info('no-op for now');
-    };
-
-    // Wrappers for the Jupyter/Jupyter function so we only maintain it in one place.
-    Narrative.prototype.patchKeyboardMapping = function () {
-        var commonShortcuts = [
-                'a', 'm', 'f', 'y', 'r',
-                '1', '2', '3', '4', '5', '6',
-                'k', 'j', 'b', 'x', 'c', 'v',
-                'z', 'd,d', 's', 'l', 'o', 'h',
-                'i,i', '0,0', 'q', 'shift-j', 'shift-k',
-                'shift-m', 'shift-o', 'shift-v'
-            ],
-            commandShortcuts = [],
-            editShortcuts = [
-                // remove the command palette
-                // since it exposes commands we have "disabled"
-                // by removing keyboard mappings
-                'cmdtrl-shift-p',
-            ];
-
-        commonShortcuts.forEach(function (shortcut) {
-            try {
-                Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
-            } catch (ex) {
-                console.warn('Error removing shortcut "' + shortcut + '"', ex);
-            }
-            try {
-                Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(shortcut);
-            } catch (ex) {
-                // console.warn('Error removing shortcut "'  + shortcut +'"', ex);
-            }
-        });
-
-        commandShortcuts.forEach(function (shortcut) {
-            try {
-                Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
-            } catch (ex) {
-                console.warn('Error removing shortcut "' + shortcut + '"', ex);
-            }
-        });
-
-        editShortcuts.forEach(function (shortcut) {
-            try {
-                Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(shortcut);
-            } catch (ex) {
-                console.warn('Error removing shortcut "' + shortcut + '"', ex);
-            }
-        });
-    };
-
-    Narrative.prototype.disableKeyboardManager = function () {
-        Jupyter.keyboard_manager.disable();
-    };
-
-    Narrative.prototype.enableKeyboardManager = function () {
-        // Jupyter.keyboard_manager.enable();
-    };
-
-    /**
-     * Registers Narrative responses to a few Jupyter events - mainly some
-     * visual effects for managing when the cell toolbar should be shown,
-     * and when saving is being done, but it also disables the keyboard
-     * manager when KBase cells are selected.
-     */
-    Narrative.prototype.registerEvents = function () {
-        var self = this;
-        $([Jupyter.events]).on('before_save.Notebook', function () {
-            $('#kb-save-btn').find('div.fa-save').addClass('fa-spin');
-        });
-        $([Jupyter.events]).on('notebook_saved.Notebook', function () {
-            $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
-            self.stopVersionCheck = false;
-            self.updateDocumentVersion();
-        });
-        $([Jupyter.events]).on('kernel_idle.Kernel', function () {
-            $('#kb-kernel-icon').removeClass().addClass('fa fa-circle-o');
-        });
-        $([Jupyter.events]).on('kernel_busy.Kernel', function () {
-            $('#kb-kernel-icon').removeClass().addClass('fa fa-circle');
+  Narrative.prototype.getAuthToken = function () {
+    return NarrativeLogin.getAuthToken();
+  };
+
+  Narrative.prototype.getNarrativeRef = function () {
+    return Promise.try(() => {
+      if (this.workspaceRef) {
+        return this.workspaceRef;
+      } else {
+        return new Workspace(Config.url('workspace'), {
+          token: this.getAuthToken(),
+        })
+          .get_workspace_info({ id: this.workspaceId })
+          .then((wsInfo) => {
+            let narrId = wsInfo[8]['narrative'];
+            this.workspaceRef = this.workspaceId + '/' + narrId;
+            return this.workspaceRef;
+          });
+      }
+    });
+  };
+
+  Narrative.prototype.getUserPermissions = function () {
+    return new Workspace(Config.url('workspace'), {
+      token: this.getAuthToken(),
+    })
+      .get_workspace_info({ id: this.workspaceId })
+      .then((wsInfo) => {
+        return wsInfo[5];
+      });
+  };
+
+  /**
+   * A wrapper around the Jupyter.notebook.kernel.execute() function.
+   * If any KBase widget needs to make a kernel call, it should go through here.
+   * ...when it's done.
+   */
+  Narrative.prototype.executeKernelCall = function () {
+    console.info('no-op for now');
+  };
+
+  // Wrappers for the Jupyter/Jupyter function so we only maintain it in one place.
+  Narrative.prototype.patchKeyboardMapping = function () {
+    var commonShortcuts = [
+        'a',
+        'm',
+        'f',
+        'y',
+        'r',
+        '1',
+        '2',
+        '3',
+        '4',
+        '5',
+        '6',
+        'k',
+        'j',
+        'b',
+        'x',
+        'c',
+        'v',
+        'z',
+        'd,d',
+        's',
+        'l',
+        'o',
+        'h',
+        'i,i',
+        '0,0',
+        'q',
+        'shift-j',
+        'shift-k',
+        'shift-m',
+        'shift-o',
+        'shift-v',
+      ],
+      commandShortcuts = [],
+      editShortcuts = [
+        // remove the command palette
+        // since it exposes commands we have 'disabled'
+        // by removing keyboard mappings
+        'cmdtrl-shift-p',
+      ];
+
+    commonShortcuts.forEach(function (shortcut) {
+      try {
+        Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
+      } catch (ex) {
+        console.warn('Error removing shortcut "' + shortcut + '"', ex);
+      }
+      try {
+        Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
+          shortcut
+        );
+      } catch (ex) {
+        // console.warn('Error removing shortcut ''  + shortcut +'"', ex);
+      }
+    });
+
+    commandShortcuts.forEach(function (shortcut) {
+      try {
+        Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
+      } catch (ex) {
+        console.warn('Error removing shortcut "' + shortcut + '"', ex);
+      }
+    });
+
+    editShortcuts.forEach(function (shortcut) {
+      try {
+        Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
+          shortcut
+        );
+      } catch (ex) {
+        console.warn('Error removing shortcut "' + shortcut + '"', ex);
+      }
+    });
+  };
+
+  Narrative.prototype.disableKeyboardManager = function () {
+    Jupyter.keyboard_manager.disable();
+  };
+
+  Narrative.prototype.enableKeyboardManager = function () {
+    // Jupyter.keyboard_manager.enable();
+  };
+
+  /**
+   * Registers Narrative responses to a few Jupyter events - mainly some
+   * visual effects for managing when the cell toolbar should be shown,
+   * and when saving is being done, but it also disables the keyboard
+   * manager when KBase cells are selected.
+   */
+  Narrative.prototype.registerEvents = function () {
+    var self = this;
+    $([Jupyter.events]).on('before_save.Notebook', function () {
+      $('#kb-save-btn').find('div.fa-save').addClass('fa-spin');
+    });
+    $([Jupyter.events]).on('notebook_saved.Notebook', function () {
+      $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
+      self.stopVersionCheck = false;
+      self.updateDocumentVersion();
+    });
+    $([Jupyter.events]).on('kernel_idle.Kernel', function () {
+      $('#kb-kernel-icon').removeClass().addClass('fa fa-circle-o');
+    });
+    $([Jupyter.events]).on('kernel_busy.Kernel', function () {
+      $('#kb-kernel-icon').removeClass().addClass('fa fa-circle');
+    });
+    [
+      'kernel_connected.Kernel',
+      'kernel_starting.Kernel',
+      'kernel_ready.Kernel',
+      'kernel_disconnected.Kernel',
+      'kernel_killed.Kernel',
+      'kernel_dead.Kernel',
+    ].forEach(function (e) {
+      $([Jupyter.events]).on(e, function () {
+        self.runtime.bus().emit('kernel-state-changed', {
+          isReady:
+            Jupyter.notebook.kernel && Jupyter.notebook.kernel.is_connected(),
         });
-        [
-            'kernel_connected.Kernel', 'kernel_starting.Kernel', 'kernel_ready.Kernel',
-            'kernel_disconnected.Kernel', 'kernel_killed.Kernel', 'kernel_dead.Kernel'
-        ].forEach(function(e) {
-            $([Jupyter.events]).on(e, function () {
-                self.runtime.bus().emit(
-                    'kernel-state-changed',
-                    {
-                        isReady: Jupyter.notebook.kernel && Jupyter.notebook.kernel.is_connected()
-                    }
-                );
-            });
+      });
+    });
+    $([Jupyter.events]).on(
+      'delete.Cell',
+      function () {
+        // this.enableKeyboardManager();
+      }.bind(this)
+    );
+
+    $([Jupyter.events]).on(
+      'notebook_save_failed.Notebook',
+      function (event, data) {
+        $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
+        this.saveFailed(event, data);
+      }.bind(this)
+    );
+  };
+
+  /**
+   * Initializes the sharing panel and sets up the events
+   * that show and hide it.
+   *
+   * This is a hack and a half because Select2, Bootstrap,
+   * and Safari are all hateful things. Here are the sequence of
+   * events.
+   * 1. Initialize the dialog object.
+   * 2. When it gets invoked, show the dialog.
+   * 3. On the FIRST time it gets shown, after it's done
+   * being rendered (shown.bs.modal event), then build and
+   * show the share panel widget. The select2 thing only wants
+   * to appear and behave correctly after the page loads, and
+   * after there's a visible DOM element for it to render in.
+   */
+  Narrative.prototype.initSharePanel = function () {
+    var sharePanel = $(
+        '<div style="text-align:center"><br><br><img src="' +
+          Config.get('loading_gif') +
+          '"></div>'
+      ),
+      shareWidget = null,
+      shareDialog = new BootstrapDialog({
+        title: 'Change Share Settings',
+        body: sharePanel,
+        closeButton: true,
+      });
+    shareDialog.getElement().one(
+      "shown.bs.modal",
+      function () {
+        shareWidget = new KBaseNarrativeSharePanel(sharePanel.empty(), {
+          ws_name_or_id: this.getWorkspaceName(),
         });
-        $([Jupyter.events]).on('delete.Cell', function () {
-            // this.enableKeyboardManager();
-        }.bind(this));
-
-        $([Jupyter.events]).on('notebook_save_failed.Notebook', function (event, data) {
-            $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
-            this.saveFailed(event, data);
-        }.bind(this));
-    };
-
-
-    /**
-     * Initializes the sharing panel and sets up the events
-     * that show and hide it.
-     *
-     * This is a hack and a half because Select2, Bootstrap,
-     * and Safari are all hateful things. Here are the sequence of
-     * events.
-     * 1. Initialize the dialog object.
-     * 2. When it gets invoked, show the dialog.
-     * 3. On the FIRST time it gets shown, after it's done
-     * being rendered (shown.bs.modal event), then build and
-     * show the share panel widget. The select2 thing only wants
-     * to appear and behave correctly after the page loads, and
-     * after there's a visible DOM element for it to render in.
-     */
-    Narrative.prototype.initSharePanel = function () {
-        var sharePanel = $('<div style="text-align:center"><br><br><img src="' +
-                Config.get('loading_gif') +
-                '"></div>'),
-            shareWidget = null,
-            shareDialog = new BootstrapDialog({
-                title: 'Change Share Settings',
-                body: sharePanel,
-                closeButton: true
-            });
-        shareDialog.getElement().one('shown.bs.modal', function () {
-            shareWidget = new KBaseNarrativeSharePanel(sharePanel.empty(), {
-                ws_name_or_id: this.getWorkspaceName()
-            });
-        }.bind(this));
-        $('#kb-share-btn').click(function () {
-            var narrName = Jupyter.notebook.notebook_name;
-            if (narrName.trim().toLowerCase() === 'untitled' || narrName.trim().length === 0) {
-                Jupyter.save_widget.rename_notebook({
-                    notebook: Jupyter.notebook,
-                    message: 'Please name your Narrative before sharing.',
-                    callback: function () { shareDialog.show(); }
-                });
-                return;
-            }
-            if (shareWidget) {
-                shareWidget.refresh();
-            }
-            shareDialog.show();
-        }.bind(this));
-    };
-
-    Narrative.prototype.initStaticNarrativesPanel = function () {
-        if (!Config.get('features').staticNarratives) {
-            $('#kb-static-btn').remove();
-            return;
+      }.bind(this)
+    );
+    $("#kb-share-btn").click(
+      function () {
+        var narrName = Jupyter.notebook.notebook_name;
+        if (
+          narrName.trim().toLowerCase() === "untitled" ||
+          narrName.trim().length === 0
+        ) {
+          Jupyter.save_widget.rename_notebook({
+            notebook: Jupyter.notebook,
+            message: "Please name your Narrative before sharing.",
+            callback: function () {
+              shareDialog.show();
+            },
+          });
+          return;
         }
-        const staticPanel = $('<div>'),
-            staticDialog = new BootstrapDialog({
-                title: 'Static Narratives',
-                body: staticPanel,
-                closeButton: true
-            }),
-            staticWidget = new StaticNarrativesPanel(staticPanel);
-        $('#kb-static-btn').click(() => {
-            staticWidget.refresh();
-            staticDialog.show();
-        });
-    };
-
-    /**
-     * Expects docInfo to be a workspace object info array, especially where the 4th element is
-     * an int > 0.
-     */
-    Narrative.prototype.checkDocumentVersion = function (docInfo) {
-        if (docInfo.length < 5 || this.stopVersionCheck) {
-            return;
+        if (shareWidget) {
+          shareWidget.refresh();
         }
-        if (docInfo[4] !== this.documentVersionInfo[4]) {
-            // now we make the dialog and all that.
-            $('#kb-narr-version-btn')
-                .off('click')
-                .on('click', function() {
-                    this.showDocumentVersionDialog(docInfo);
-                }.bind(this));
-            this.toggleDocumentVersionBtn(true);
+        shareDialog.show();
+      }.bind(this)
+    );
+  };
+
+  Narrative.prototype.initStaticNarrativesPanel = function () {
+    if (!Config.get("features").staticNarratives) {
+      $("#kb-static-btn").remove();
+      return;
+    }
+    const staticPanel = $("<div>"),
+      staticDialog = new BootstrapDialog({
+        title: "Static Narratives",
+        body: staticPanel,
+        closeButton: true,
+      }),
+      staticWidget = new StaticNarrativesPanel(staticPanel);
+    $("#kb-static-btn").click(() => {
+      staticWidget.refresh();
+      staticDialog.show();
+    });
+  };
+
+  /**
+   * Expects docInfo to be a workspace object info array, especially where the 4th element is
+   * an int > 0.
+   */
+  Narrative.prototype.checkDocumentVersion = function (docInfo) {
+    if (docInfo.length < 5 || this.stopVersionCheck) {
+      return;
+    }
+    if (docInfo[4] !== this.documentVersionInfo[4]) {
+      // now we make the dialog and all that.
+      $("#kb-narr-version-btn")
+        .off("click")
+        .on(
+          "click",
+          function () {
+            this.showDocumentVersionDialog(docInfo);
+          }.bind(this)
+        );
+      this.toggleDocumentVersionBtn(true);
+    }
+  };
+
+  /**
+   * Expects the usual workspace object info array. If that's present, it's captured. If not,
+   * we run get_object_info_new and fetch it ourselves. Note that it should have its metadata.
+   */
+  Narrative.prototype.updateDocumentVersion = function (docInfo) {
+    var self = this;
+    return Promise.try(function () {
+      if (docInfo) {
+        self.documentVersionInfo = docInfo;
+      } else {
+        var workspace = new Workspace(Config.url("workspace"), {
+          token: self.getAuthToken(),
+        });
+        self
+          .getNarrativeRef()
+          .then((narrativeRef) => {
+            return workspace.get_object_info_new({
+              objects: [{ ref: narrativeRef }],
+              includeMetadata: 1,
+            });
+          })
+          .then(function (info) {
+            self.documentVersionInfo = info[0];
+          })
+          .catch(function (error) {
+            // no op for now.
+            console.error(error);
+          });
+      }
+    });
+  };
+
+  Narrative.prototype.showDocumentVersionDialog = function (newVerInfo) {
+    var bodyTemplate = Handlebars.compile(DocumentVersionDialogBodyTemplate);
+
+    var versionDialog = new BootstrapDialog({
+      title: "Showing an older Narrative document",
+      body: bodyTemplate({
+        currentVer: this.documentVersionInfo,
+        currentDate: TimeFormat.readableTimestamp(this.documentVersionInfo[3]),
+        newVer: newVerInfo,
+        newDate: TimeFormat.readableTimestamp(newVerInfo[3]),
+        sameUser: this.documentVersionInfo[5] === newVerInfo[5],
+        readOnly: this.readonly,
+      }),
+      alertOnly: true,
+    });
+
+    versionDialog.show();
+  };
+
+  /**
+   * @method
+   * @public
+   * This shows or hides the "narrative has been saved in a different window" button.
+   * If show is truthy, show it. Otherwise, hide it.
+   */
+  Narrative.prototype.toggleDocumentVersionBtn = function (show) {
+    var $btn = $("#kb-narr-version-btn");
+    if (show && !$btn.is(":visible")) {
+      $btn.fadeIn("fast");
+    } else if (!show && $btn.is(":visible")) {
+      $btn.fadeOut("fast");
+    }
+  };
+
+  /**
+   * The "Upgrade your container" dialog should be made available when
+   * there's a more recent version of the Narrative ready to use. This
+   * dialog then lets the user shut down their existing Narrative container.
+   */
+  Narrative.prototype.initUpgradeDialog = function () {
+    var bodyTemplate = Handlebars.compile(UpdateDialogBodyTemplate);
+
+    var $cancelBtn = $('<button type="button" data-dismiss="modal">')
+      .addClass("btn btn-default")
+      .append("Cancel");
+    var $upgradeBtn = $('<button type="button" data-dismiss="modal">')
+      .addClass("btn btn-success")
+      .append("Update and Reload")
+      .click(
+        function () {
+          this.updateVersion();
+        }.bind(this)
+      );
+
+    var upgradeDialog = new BootstrapDialog({
+      title: "New Narrative version available!",
+      buttons: [$cancelBtn, $upgradeBtn],
+    });
+    $("#kb-update-btn").click(function () {
+      upgradeDialog.show();
+    });
+    this.checkVersion().then(
+      function (ver) {
+        upgradeDialog.setBody(
+          bodyTemplate({
+            currentVersion: this.currentVersion,
+            newVersion: ver ? ver.version : "No new version",
+            releaseNotesUrl: Config.get("release_notes"),
+          })
+        );
+        if (ver && ver.version && this.currentVersion !== ver.version) {
+          $("#kb-update-btn").fadeIn("fast");
         }
-    };
-
-    /**
-     * Expects the usual workspace object info array. If that's present, it's captured. If not,
-     * we run get_object_info_new and fetch it ourselves. Note that it should have its metadata.
-     */
-    Narrative.prototype.updateDocumentVersion = function (docInfo) {
-        var self = this;
+      }.bind(this)
+    );
+  };
+
+  /**
+   * Looks up what is the current version of the Narrative.
+   * This should eventually get rolled into a Narrative Service method call.
+   */
+  Narrative.prototype.checkVersion = function () {
+    // look up new version here.
+    return Promise.resolve(
+      $.ajax({
+        url: Config.url("version_check"),
+        async: true,
+        dataType: "text",
+        crossDomain: true,
+        cache: false,
+      })
+    )
+      .then(function (ver) {
         return Promise.try(function () {
-            if (docInfo) {
-                self.documentVersionInfo = docInfo;
-            }
-            else {
-                var workspace = new Workspace(Config.url('workspace'), {token: self.getAuthToken()});
-                self.getNarrativeRef()
-                .then((narrativeRef) => {
-                    return workspace.get_object_info_new({
-                        objects: [{'ref': narrativeRef}],
-                        includeMetadata: 1
-                    });
-                }).then(function (info) {
-                    self.documentVersionInfo = info[0];
-                }).catch(function (error) {
-                    // no op for now.
-                    console.error(error);
-                });
-            }
+          ver = $.parseJSON(ver);
+          return ver;
         });
+      })
+      .catch(function (error) {
+        console.error(
+          "Error while checking for a version update: " + error.statusText
+        );
+        KBError(
+          "Narrative.checkVersion",
+          "Unable to check for a version update!"
+        );
+      });
+  };
+
+  Narrative.prototype.createShutdownDialogButtons = function () {
+    var $shutdownButton = $("<button>")
+      .attr({ type: "button", "data-dismiss": "modal" })
+      .addClass("btn btn-danger")
+      .append("Okay. Shut it all down!")
+      .click(
+        function () {
+          this.updateVersion();
+        }.bind(this)
+      );
+
+    var $reallyShutdownPanel = $('<div style="margin-top:10px">')
+      .append(
+        "This will shutdown your Narrative session and close this window.<br><b>Any unsaved data in any open Narrative in any window WILL BE LOST!</b><br>"
+      )
+      .append($shutdownButton)
+      .hide();
+
+    var $firstShutdownBtn = $("<button>")
+      .attr({ type: "button" })
+      .addClass("btn btn-danger")
+      .append("Shutdown")
+      .click(function () {
+        $reallyShutdownPanel.slideDown("fast");
+      });
+
+    var $cancelButton = $('<button type="button" data-dismiss="modal">')
+      .addClass("btn btn-default")
+      .append("Dismiss")
+      .click(function () {
+        $reallyShutdownPanel.hide();
+      });
+
+    return {
+      cancelButton: $cancelButton,
+      firstShutdownButton: $firstShutdownBtn,
+      finalShutdownButton: $shutdownButton,
+      shutdownPanel: $reallyShutdownPanel,
     };
+  };
+
+  Narrative.prototype.initAboutDialog = function () {
+    var $versionDiv = $("<div>").append(
+      "<b>Version:</b> " + Config.get("version")
+    );
+    $versionDiv.append(
+      "<br><b>Git Commit:</b> " +
+        Config.get("git_commit_hash") +
+        " -- " +
+        Config.get("git_commit_time")
+    );
+    $versionDiv.append(
+      '<br>View release notes on <a href="' +
+        Config.get("release_notes") +
+        '" target="_blank">Github</a>'
+    );
+
+    var urlList = Object.keys(Config.get("urls")).sort();
+    var $versionTable = $("<table>").addClass(
+      "table table-striped table-bordered"
+    );
+    $.each(urlList, function (idx, val) {
+      var url = Config.url(val);
+      // if url looks like a url (starts with http), include it.
+      // ignore job proxy and submit ticket
+      if (
+        val === "narrative_job_proxy" ||
+        val === "submit_jira_ticket" ||
+        val === "narrative_method_store_types" ||
+        url === null
+      ) {
+        return;
+      }
+      url = url.toString();
+      if (url && url.toLowerCase().indexOf("http") === 0) {
+        $versionTable.append(
+          $("<tr>").append($("<td>").append(val)).append($("<td>").append(url))
+        );
+      }
+    });
+    var $verAccordionDiv = $('<div style="margin-top:15px">');
+    $versionDiv.append($verAccordionDiv);
+
+    new KBaseAccordion($verAccordionDiv, {
+      elements: [
+        {
+          title: "KBase Service URLs",
+          body: $versionTable,
+        },
+      ],
+    });
+
+    var shutdownButtons = this.createShutdownDialogButtons();
+    var aboutDialog = new BootstrapDialog({
+      title: "KBase Narrative Properties",
+      body: $versionDiv,
+      buttons: [
+        shutdownButtons.cancelButton,
+        shutdownButtons.firstShutdownButton,
+        shutdownButtons.shutdownPanel,
+      ],
+    });
+
+    $("#kb-about-btn").click(function () {
+      aboutDialog.show();
+    });
+  };
+
+  Narrative.prototype.initShutdownDialog = function () {
+    var shutdownButtons = this.createShutdownDialogButtons();
+
+    var shutdownDialog = new BootstrapDialog({
+      title: "Shutdown and restart narrative?",
+      body: $("<div>").append(
+        "Shutdown and restart your Narrative session? Any unsaved changes in any open Narrative in any window WILL BE LOST!"
+      ),
+      buttons: [
+        shutdownButtons.cancelButton,
+        shutdownButtons.finalShutdownButton,
+      ],
+    });
+
+    $("#kb-shutdown-btn").click(function () {
+      shutdownDialog.show();
+    });
+  };
+
+  Narrative.prototype.saveFailed = function (event, data) {
+    $("#kb-save-btn").find("div.fa-save").removeClass("fa-spin");
+    Jupyter.save_widget.set_save_status("Narrative save failed!");
+
+    var errorText;
+    // 413 means that the Narrative is too large to be saved.
+    // currently - 4/6/2015 - there's a hard limit of 4MB per KBase Narrative.
+    // Any larger object will throw a 413 error, and we need to show some text.
+    if (data.xhr.status === 413) {
+      errorText =
+        "Due to current system constraints, a Narrative may not exceed " +
+        this.maxNarrativeSize +
+        " of text.<br><br>" +
+        "Errors of this sort are usually due to excessive size " +
+        "of outputs from Code Cells, or from large objects " +
+        "embedded in Markdown Cells.<br><br>" +
+        "Please decrease the document size and try to save again.";
+    } else if (data.xhr.responseText) {
+      var $error = $($.parseHTML(data.xhr.responseText));
+      errorText = $error.find("#error-message > h3").text();
+
+      if (errorText) {
+        /* gonna throw in a special case for workspace permissions issues for now.
+         * if it has this pattern:
+         *
+         * User \w+ may not write to workspace \d+
+         * change the text to something more sensible.
+         */
 
-    Narrative.prototype.showDocumentVersionDialog = function (newVerInfo) {
-        var bodyTemplate = Handlebars.compile(DocumentVersionDialogBodyTemplate);
-
-        var versionDialog = new BootstrapDialog({
-            title: 'Showing an older Narrative document',
-            body: bodyTemplate({
-                currentVer: this.documentVersionInfo,
-                currentDate: TimeFormat.readableTimestamp(this.documentVersionInfo[3]),
-                newVer: newVerInfo,
-                newDate: TimeFormat.readableTimestamp(newVerInfo[3]),
-                sameUser: this.documentVersionInfo[5] === newVerInfo[5],
-                readOnly: this.readonly
-            }),
-            alertOnly: true
-        });
-
-        versionDialog.show();
-    };
-
-    /**
-     * @method
-     * @public
-     * This shows or hides the "narrative has been saved in a different window" button.
-     * If show is truthy, show it. Otherwise, hide it.
-     */
-    Narrative.prototype.toggleDocumentVersionBtn = function (show) {
-        var $btn = $('#kb-narr-version-btn');
-        if (show && !$btn.is(':visible')) {
-            $btn.fadeIn('fast');
-        }
-        else if (!show && $btn.is(':visible')){
-            $btn.fadeOut('fast');
+        var res = /User\s+(\w+)\s+may\s+not\s+write\s+to\s+workspace\s+(\d+)/.exec(
+          errorText
+        );
+        if (res) {
+          errorText =
+            "User " +
+            res[1] +
+            " does not have permission to save to workspace " +
+            res[2] +
+            ".";
         }
-    };
+      }
+    } else {
+      errorText = "An unknown error occurred!";
+    }
 
-    /**
-     * The "Upgrade your container" dialog should be made available when
-     * there's a more recent version of the Narrative ready to use. This
-     * dialog then lets the user shut down their existing Narrative container.
-     */
-    Narrative.prototype.initUpgradeDialog = function () {
-        var bodyTemplate = Handlebars.compile(UpdateDialogBodyTemplate);
-
-        var $cancelBtn = $('<button type="button" data-dismiss="modal">')
-            .addClass('btn btn-default')
-            .append('Cancel');
-        var $upgradeBtn = $('<button type="button" data-dismiss="modal">')
-            .addClass('btn btn-success')
-            .append('Update and Reload')
-            .click(function () {
-                this.updateVersion();
-            }.bind(this));
-
-        var upgradeDialog = new BootstrapDialog({
-            title: 'New Narrative version available!',
-            buttons: [$cancelBtn, $upgradeBtn]
-        });
-        $('#kb-update-btn').click(function () {
-            upgradeDialog.show();
+    Jupyter.dialog.modal({
+      title: "Narrative save failed!",
+      body: $("<div>").append(errorText),
+      buttons: {
+        OK: {
+          class: "btn-primary",
+          click: function () {
+            return;
+          },
+        },
+      },
+      open: function () {
+        var that = $(this);
+        // Upon ENTER, click the OK button.
+        that.find('input[type="text"]').keydown(function (event) {
+          if (event.which === Keyboard.keycodes.enter) {
+            that.find(".btn-primary").first().click();
+          }
         });
-        this.checkVersion()
-            .then(function (ver) {
-                upgradeDialog.setBody(bodyTemplate({
-                    currentVersion: this.currentVersion,
-                    newVersion: ver ? ver.version : "No new version",
-                    releaseNotesUrl: Config.get('release_notes')
-                }));
-                if (ver && ver.version && this.currentVersion !== ver.version) {
-                    $('#kb-update-btn').fadeIn('fast');
-                }
-            }.bind(this));
-    };
-
-    /**
-     * Looks up what is the current version of the Narrative.
-     * This should eventually get rolled into a Narrative Service method call.
+        that.find('input[type="text"]').focus();
+      },
+    });
+  };
+
+  Narrative.prototype.initTour = function () {
+    try {
+      $("#kb-tour").click(
+        function (e) {
+          var tour = new Tour.Tour(this);
+          tour.start();
+        }.bind(this)
+      );
+    } catch (e) {
+      console.error(e);
+    }
+  };
+
+  /**
+   * This is the Narrative front end initializer. It should only be run directly after
+   * the app_initialized.NotebookApp event has been fired.
+   *
+   * It does the following steps:
+   * 1. Registers event listeners on Jupyter events such as cell selection, insertion,
+   *    deletion, etc.
+   * 2. Initializes the Core UI dialogs that depend on configuration information (About,
+   *    Upgrade, and Shutdown)
+   * 3. Initializes the
+   */
+  // This should not be run until AFTER the notebook has been loaded!
+  // It depends on elements of the Notebook metadata.
+  Narrative.prototype.init = function () {
+    // NAR-271 - Firefox needs to be told where the top of the page is. :P
+    window.scrollTo(0, 0);
+
+    this.authToken = NarrativeLogin.getAuthToken();
+    console.log("Auth token: " + this.authToken);
+    console.log("session: " + NarrativeLogin.sessionInfo);
+    this.userId = NarrativeLogin.sessionInfo.user;
+
+    Jupyter.narrative.patchKeyboardMapping();
+    this.registerEvents();
+    this.initAboutDialog();
+    this.initUpgradeDialog();
+    this.initShutdownDialog();
+    this.initTour();
+
+    /* Clever extension to $.event from StackOverflow
+     * Lets us watch DOM nodes and catch when a widget's node gets nuked.
+     * http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom
+     *
+     * We bind a jQuery event to a node. Call it 'destroyed'.
+     * When that event is no longer bound (i.e. when the node is removed, OR when .unbind is called)
+     * it triggers the 'remove' function. Lets us keep track of when widgets get removed
+     * in the registerWidget function below.
      */
-    Narrative.prototype.checkVersion = function () {
-        // look up new version here.
-        return Promise.resolve($.ajax({
-            url: Config.url('version_check'),
-            async: true,
-            dataType: 'text',
-            crossDomain: true,
-            cache: false
-        })).then(function (ver) {
-            return Promise.try(function () {
-                ver = $.parseJSON(ver);
-                return ver;
-            });
-        }).catch(function (error) {
-            console.error('Error while checking for a version update: ' + error.statusText);
-            KBError('Narrative.checkVersion', 'Unable to check for a version update!');
-        });
-    };
-
-    Narrative.prototype.createShutdownDialogButtons = function () {
-        var $shutdownButton = $('<button>')
-            .attr({ type: 'button', 'data-dismiss': 'modal' })
-            .addClass('btn btn-danger')
-            .append('Okay. Shut it all down!')
-            .click(function () {
-                this.updateVersion();
-            }.bind(this));
-
-        var $reallyShutdownPanel = $('<div style="margin-top:10px">')
-            .append('This will shutdown your Narrative session and close this window.<br><b>Any unsaved data in any open Narrative in any window WILL BE LOST!</b><br>')
-            .append($shutdownButton)
-            .hide();
-
-        var $firstShutdownBtn = $('<button>')
-            .attr({ type: 'button' })
-            .addClass('btn btn-danger')
-            .append('Shutdown')
-            .click(function () {
-                $reallyShutdownPanel.slideDown('fast');
-            });
-
-        var $cancelButton = $('<button type="button" data-dismiss="modal">')
-            .addClass('btn btn-default')
-            .append('Dismiss')
-            .click(function () {
-                $reallyShutdownPanel.hide();
-            });
-
-        return {
-            cancelButton: $cancelButton,
-            firstShutdownButton: $firstShutdownBtn,
-            finalShutdownButton: $shutdownButton,
-            shutdownPanel: $reallyShutdownPanel
-        };
+    $.event.special.destroyed = {
+      remove: function (o) {
+        if (o.handler) {
+          o.handler();
+        }
+      },
     };
 
-    Narrative.prototype.initAboutDialog = function () {
-        var $versionDiv = $('<div>')
-            .append('<b>Version:</b> ' + Config.get('version'));
-        $versionDiv.append('<br><b>Git Commit:</b> ' + Config.get('git_commit_hash') + ' -- ' + Config.get('git_commit_time'));
-        $versionDiv.append('<br>View release notes on <a href="' + Config.get('release_notes') + '" target="_blank">Github</a>');
-
-        var urlList = Object.keys(Config.get('urls')).sort();
-        var $versionTable = $('<table>')
-            .addClass('table table-striped table-bordered');
-        $.each(urlList,
-            function (idx, val) {
-                var url = Config.url(val);
-                // if url looks like a url (starts with http), include it.
-                // ignore job proxy and submit ticket
-                if (val === 'narrative_job_proxy' ||
-                    val === 'submit_jira_ticket' ||
-                    val === 'narrative_method_store_types' ||
-                    url === null) {
-                    return;
-                }
-                url = url.toString();
-                if (url && url.toLowerCase().indexOf('http') === 0) {
-                    $versionTable.append($('<tr>')
-                        .append($('<td>').append(val))
-                        .append($('<td>').append(url)));
-                }
-            }
+    $([Jupyter.events]).on(
+      "notebook_loaded.Notebook",
+      function () {
+        this.loadingWidget.updateProgress("narrative", true);
+        $("#notification_area").find("div#notification_trusted").hide();
+
+        $(document).one(
+          "dataUpdated.Narrative",
+          function () {
+            this.loadingWidget.updateProgress("data", true);
+          }.bind(this)
         );
-        var $verAccordionDiv = $('<div style="margin-top:15px">');
-        $versionDiv.append($verAccordionDiv);
-
-        new KBaseAccordion($verAccordionDiv, {
-            elements: [{
-                title: 'KBase Service URLs',
-                body: $versionTable
-            }]
-        });
 
-        var shutdownButtons = this.createShutdownDialogButtons();
-        var aboutDialog = new BootstrapDialog({
-            title: 'KBase Narrative Properties',
-            body: $versionDiv,
-            buttons: [
-                shutdownButtons.cancelButton,
-                shutdownButtons.firstShutdownButton,
-                shutdownButtons.shutdownPanel
-            ]
-        });
+        $(document).one(
+          "appListUpdated.Narrative",
+          function () {
+            this.loadingWidget.updateProgress("apps", true);
+          }.bind(this)
+        );
 
-        $('#kb-about-btn').click(function () {
-            aboutDialog.show();
+        // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
+        this.sidePanel = new KBaseNarrativeSidePanel($("#kb-side-panel"), {
+          autorender: false,
         });
-    };
+        this.narrController = new KBaseNarrativeWorkspace(
+          $("#notebook_panel"),
+          {
+            ws_id: this.getWorkspaceName(),
+          }
+        );
 
-    Narrative.prototype.initShutdownDialog = function () {
-        var shutdownButtons = this.createShutdownDialogButtons();
+        // Disable autosave so as not to spam the Workspace.
+        Jupyter.notebook.set_autosave_interval(0);
+        KBaseCellToolbar.register(Jupyter.notebook);
+        Jupyter.CellToolbar.activate_preset("KBase");
+        Jupyter.CellToolbar.global_show();
 
-        var shutdownDialog = new BootstrapDialog({
-            title: 'Shutdown and restart narrative?',
-            body: $('<div>').append('Shutdown and restart your Narrative session? Any unsaved changes in any open Narrative in any window WILL BE LOST!'),
-            buttons: [
-                shutdownButtons.cancelButton,
-                shutdownButtons.finalShutdownButton
-            ]
-        });
+        if (Jupyter.notebook && Jupyter.notebook.metadata) {
+          var creatorId = Jupyter.notebook.metadata.creator || "KBase User";
+          DisplayUtil.displayRealName(creatorId, $("#kb-narr-creator"));
 
-        $('#kb-shutdown-btn').click(function () {
-            shutdownDialog.show();
-        });
-    };
-
-    Narrative.prototype.saveFailed = function (event, data) {
-        $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
-        Jupyter.save_widget.set_save_status('Narrative save failed!');
-
-        var errorText;
-        // 413 means that the Narrative is too large to be saved.
-        // currently - 4/6/2015 - there's a hard limit of 4MB per KBase Narrative.
-        // Any larger object will throw a 413 error, and we need to show some text.
-        if (data.xhr.status === 413) {
-            errorText = 'Due to current system constraints, a Narrative may not exceed ' +
-                this.maxNarrativeSize + ' of text.<br><br>' +
-                'Errors of this sort are usually due to excessive size ' +
-                'of outputs from Code Cells, or from large objects ' +
-                'embedded in Markdown Cells.<br><br>' +
-                'Please decrease the document size and try to save again.';
-        } else if (data.xhr.responseText) {
-            var $error = $($.parseHTML(data.xhr.responseText));
-            errorText = $error.find('#error-message > h3').text();
-
-            if (errorText) {
-                /* gonna throw in a special case for workspace permissions issues for now.
-                 * if it has this pattern:
-                 *
-                 * User \w+ may not write to workspace \d+
-                 * change the text to something more sensible.
-                 */
-
-                var res = /User\s+(\w+)\s+may\s+not\s+write\s+to\s+workspace\s+(\d+)/.exec(errorText);
-                if (res) {
-                    errorText = 'User ' + res[1] + ' does not have permission to save to workspace ' + res[2] + '.';
-                }
-            }
-        } else {
-            errorText = 'An unknown error occurred!';
+          // This puts the cell menu in the right place.
+          $([Jupyter.events]).trigger("select.Cell", {
+            cell: Jupyter.notebook.get_selected_cell(),
+          });
         }
-
-        Jupyter.dialog.modal({
-            title: 'Narrative save failed!',
-            body: $('<div>').append(errorText),
-            buttons: {
-                OK: {
-                    class: 'btn-primary',
-                    click: function () {
-                        return;
-                    }
-                }
-            },
-            open: function () {
-                var that = $(this);
-                // Upon ENTER, click the OK button.
-                that.find('input[type="text"]').keydown(function (event) {
-                    if (event.which === Keyboard.keycodes.enter) {
-                        that.find('.btn-primary').first().click();
-                    }
-                });
-                that.find('input[type="text"]').focus();
-            }
-        });
-    };
-
-    Narrative.prototype.initTour = function () {
-        try {
-            $('#kb-tour').click(function (e) {
-                var tour = new Tour.Tour(this);
-                tour.start();
-            }.bind(this));
-        } catch (e) {
-            console.error(e);
+        if (this.getWorkspaceName() === null) {
+          KBFatal(
+            "Narrative.init",
+            "Unable to locate workspace name from the Narrative object!"
+          );
+          this.loadingWidget.remove();
+          return;
         }
-    };
-
-    /**
-     * This is the Narrative front end initializer. It should only be run directly after
-     * the app_initialized.NotebookApp event has been fired.
-     *
-     * It does the following steps:
-     * 1. Registers event listeners on Jupyter events such as cell selection, insertion,
-     *    deletion, etc.
-     * 2. Initializes the Core UI dialogs that depend on configuration information (About,
-     *    Upgrade, and Shutdown)
-     * 3. Initializes the
-     */
-    // This should not be run until AFTER the notebook has been loaded!
-    // It depends on elements of the Notebook metadata.
-    Narrative.prototype.init = function () {
-        // NAR-271 - Firefox needs to be told where the top of the page is. :P
-        window.scrollTo(0, 0);
-
-        this.authToken = NarrativeLogin.getAuthToken();
-        this.userId = NarrativeLogin.sessionInfo.user;
-
-        Jupyter.narrative.patchKeyboardMapping();
-        this.registerEvents();
-        this.initAboutDialog();
-        this.initUpgradeDialog();
-        this.initShutdownDialog();
-        this.initTour();
-
-        /* Clever extension to $.event from StackOverflow
-         * Lets us watch DOM nodes and catch when a widget's node gets nuked.
-         * http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom
-         *
-         * We bind a jQuery event to a node. Call it 'destroyed'.
-         * When that event is no longer bound (i.e. when the node is removed, OR when .unbind is called)
-         * it triggers the 'remove' function. Lets us keep track of when widgets get removed
-         * in the registerWidget function below.
-         */
-        $.event.special.destroyed = {
-            remove: function (o) {
-                if (o.handler) {
-                    o.handler();
-                }
-            }
-        };
-
-        $([Jupyter.events]).on('notebook_loaded.Notebook', function () {
-            this.loadingWidget.updateProgress('narrative', true);
-            $('#notification_area').find('div#notification_trusted').hide();
-
-            $(document).one('dataUpdated.Narrative', function () {
-                this.loadingWidget.updateProgress('data', true);
-            }.bind(this));
-
-            $(document).one('appListUpdated.Narrative', function () {
-                this.loadingWidget.updateProgress('apps', true);
-            }.bind(this));
-
-            // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
-            this.sidePanel = new KBaseNarrativeSidePanel($('#kb-side-panel'), { autorender: false });
-            this.narrController = new KBaseNarrativeWorkspace($('#notebook_panel'), {
-                ws_id: this.getWorkspaceName()
+        this.initSharePanel();
+        this.initStaticNarrativesPanel();
+        this.updateDocumentVersion()
+          .then(
+            function () {
+              // init the controller
+              return this.narrController.render();
+            }.bind(this)
+          )
+          .finally(
+            function () {
+              this.sidePanel.render();
+            }.bind(this)
+          );
+
+        $([Jupyter.events]).on("kernel_connected.Kernel", (e) => {
+          this.loadingWidget.updateProgress("kernel", true);
+          this.jobCommChannel = new JobCommChannel();
+          // TODO: This should be an event "kernel-ready", perhaps broadcast
+          // on the default bus channel.
+          this.jobCommChannel
+            .initCommChannel()
+            .then(() => this.loadingWidget.updateProgress("jobs", true))
+            .catch((err) => {
+              // TODO: put the narrative into a terminal state
+              console.error("ERROR initializing kbase comm channel", err);
+              KBFatal(
+                "Narrative.ini",
+                "KBase communication channel could not be initiated with the back end. TODO"
+              );
             });
-
-            // Disable autosave so as not to spam the Workspace.
-            Jupyter.notebook.set_autosave_interval(0);
-            KBaseCellToolbar.register(Jupyter.notebook);
-            Jupyter.CellToolbar.activate_preset('KBase');
-            Jupyter.CellToolbar.global_show();
-
-            if (Jupyter.notebook && Jupyter.notebook.metadata) {
-                var creatorId = Jupyter.notebook.metadata.creator || 'KBase User';
-                DisplayUtil.displayRealName(creatorId, $('#kb-narr-creator'));
-
-                // This puts the cell menu in the right place.
-                $([Jupyter.events]).trigger('select.Cell', { cell: Jupyter.notebook.get_selected_cell() });
-            }
-            if (this.getWorkspaceName() === null) {
-                KBFatal('Narrative.init', 'Unable to locate workspace name from the Narrative object!');
-                this.loadingWidget.remove();
-                return;
-            }
-            this.initSharePanel();
-            this.initStaticNarrativesPanel();
-            this.updateDocumentVersion()
-                .then(function() {
-                    // init the controller
-                    return this.narrController.render();
-                }.bind(this))
-                .finally(function () {
-                    this.sidePanel.render();
-                }.bind(this));
-
-            $([Jupyter.events]).on('kernel_connected.Kernel',
-                (e) => {
-                    this.loadingWidget.updateProgress('kernel', true);
-                    this.jobCommChannel = new JobCommChannel();
-                    // TODO: This should be an event "kernel-ready", perhaps broadcast
-                    // on the default bus channel.
-                    this.jobCommChannel.initCommChannel()
-                        .then(() => this.loadingWidget.updateProgress('jobs', true))
-                        .catch((err) => {
-                            // TODO: put the narrative into a terminal state
-                            console.error('ERROR initializing kbase comm channel', err);
-                            KBFatal('Narrative.ini', 'KBase communication channel could not be initiated with the back end. TODO');
-                        });
-                }
-            );
-        }.bind(this));
-    };
-
-    /**
-     * @method
-     * @public
-     * This manually deletes the Docker container that this Narrative runs in, if there is one.
-     * If it can't, or if this is being run locally, it pops up an alert saying so.
-     */
-    Narrative.prototype.updateVersion = function () {
-        var user = NarrativeLogin.sessionInfo.user;
-        Promise.resolve(
-            $.ajax({
-                contentType: 'application/json',
-                url: '/narrative_shutdown/' + user,
-                type: 'DELETE',
-                crossDomain: true
-            }))
-            .then(() => {
-                setTimeout(() => {
-                    location.replace(`/load-narrative.html?n=${this.workspaceId}&check=true`);
-                }, 200);
-            })
-            .catch((error) => {
-                window.alert('Unable to update your Narrative session\nError: ' + error.status + ': ' + error.statusText);
-                console.error(error);
-            });
-    };
-
-    /**
-     * @method
-     * @public
-     * This triggers a save, but saves all cell states first.
-     */
-    Narrative.prototype.saveNarrative = function () {
-        this.stopVersionCheck = true;
-        this.narrController.saveAllCellStates();
-        Jupyter.notebook.save_checkpoint();
-        this.toggleDocumentVersionBtn(false);
-    };
-
-    /**
-     * @method
-     * @public
-     * Insert a new App cell into a narrative and pre-populate its parameters with a given set of
-     * values. The cell is inserted below the currently selected cell.
-     * @param {string} appId - The id of the app (should be in form module_name/app_name)
-     * @param {string} tag - The release tag of the app (one of release, beta, dev)
-     * @param {object} parameters - Key-value-pairs describing the parameters to initialize the app
-     * with. Keys are param ids (should match the spec), and values are the values of those
-     * parameters.
-     */
-    Narrative.prototype.addAndPopulateApp = function(appId, tag, parameters) {
-        this.sidePanel.$methodsWidget.triggerApp(appId, tag, parameters);
-    };
-
-    /**
-     * @method
-     * @public
-     * Insert a new Viewer cell into a narrative for a given object. The new cell is inserted below
-     * the currently selected cell.
-     * @param {string|object|array} obj - If a string, expected to be an object reference. If an object,
-     * expected to be a set of Key-value-pairs describing the object. If an array, expected to be
-     * the usual workspace info array for an object.
-     */
-    Narrative.prototype.addViewerCell = function(obj) {
-        if (Jupyter.narrative.readonly) {
-            new BootstrapDialog({
-                type: 'warning',
-                title: 'Warning',
-                body: 'Read-only Narrative -- may not add a data viewer to this Narrative',
-                alertOnly: true
-            }).show();
-            return;
-        }
-        var cell = Jupyter.notebook.get_selected_cell(),
-            nearIdx = 0;
-        if (cell) {
-            nearIdx = Jupyter.notebook.find_cell_index(cell);
-        }
-        var objInfo = {};
-        // If a string, expect a ref, and fetch the info.
-        if (typeof obj === 'string') {
-            objInfo = this.sidePanel.$dataWidget.getDataObjectByRef(obj, true);
-        }
-        // If an array, expect it to be an array of the info, and convert it.
-        else if (Array.isArray(obj)) {
-            objInfo = ServiceUtils.objectInfoToObject(obj);
-        }
-        // If not an array or a string, it's our object already.
-        else {
-            objInfo = obj;
-        }
-        this.narrController.trigger('createViewerCell.Narrative', {
-            'nearCellIdx': nearIdx,
-            'widget': 'kbaseNarrativeDataCell',
-            'info': objInfo
         });
-    };
-
-    /**
-     * @method
-     * @public
-     * Insert a new method into the narrative, set it as active, populate the
-     * parameters, and run it.  This is useful for widgets that need to trigger
-     * some additional narrative action, such as creating a FeatureSet from
-     * a selected set of Features in a widget, or computing a statistic on a
-     * subselection made from within a widget.
-     */
-    Narrative.prototype.createAndRunMethod = function (method_id, parameters) {
-        //first make a request to get the method spec of a particular method
-        //getFunctionSpecs.Narrative is implemented in kbaseNarrativeAppPanel
-        var request = { methods: [method_id] };
-        var self = this;
-        self.narrController.trigger('getFunctionSpecs.Narrative', [request,
-            function (specs) {
-                // do nothing if the method could not be found
-                var errorMsg = 'Method ' + method_id + ' not found and cannot run.';
-                if (!specs) {
-                    console.error(errorMsg);
-                    return;
-                }
-                if (!specs.methods) {
-                    console.error(errorMsg);
-                    return;
-                }
-                if (!specs.methods[method_id]) {
-                    console.error(errorMsg);
-                    return;
-                }
-                // put the method in the narrative by simulating a method clicked in kbaseNarrativeAppPanel
-                self.narrController.trigger('methodClicked.Narrative', specs.methods[method_id]);
-
-                // the method initializes an internal method input widget, but rendering and initializing is
-                // async, so we have to wait and check back before we can load the parameter state.
-                // TODO: update kbaseNarrativeMethodCell to return a promise to mark when rendering is complete
-                var newCell = Jupyter.notebook.get_selected_cell();
-                var newCellIdx = Jupyter.notebook.get_selected_index();
-                var newWidget = new KBaseNarrativeMethodCell($('#' + $(newCell.get_text())[0].id));
-                var updateStateAndRun = function () {
-                    if (newWidget.$inputWidget) {
-                        // if the $inputWidget is not null, we are good to go, so set the parameters
-                        newWidget.loadState(parameters);
-                        // make sure the new cell is still selected, then run the method
-                        Jupyter.notebook.select(newCellIdx);
-                        newWidget.runMethod();
-                    } else {
-                        // not ready yet, keep waiting
-                        window.setTimeout(updateStateAndRun, 500);
-                    }
-                };
-                // call the update and run after a short deplay
-                window.setTimeout(updateStateAndRun, 50);
-            }
-        ]);
-    };
-
-    Narrative.prototype.getWorkspaceName = function () {
-        return Jupyter.notebook.metadata.ws_name || null;
-    };
-
-    Narrative.prototype.lookupUserProfile = function (username) {
-        return DisplayUtil.lookupUserProfile(username);
-    };
-
-    /**
-     * A little bit of a riff on the Jupyter "find_cell_index".
-     * Every KBase-ified cell (App, Method, Output) has a unique identifier.
-     * This can be used to find the closest cell element - its index is the
-     * Jupyter cell index (inferred somewhat from find_cell_index which calls
-     * get_cell_elements, which does this searching).
-     */
-    Narrative.prototype.getCellIndexByKbaseId = function (id) {
-        if (!Jupyter.notebook) {
-            return null;
+      }.bind(this)
+    );
+  };
+
+  /**
+   * @method
+   * @public
+   * This manually deletes the Docker container that this Narrative runs in, if there is one.
+   * If it can't, or if this is being run locally, it pops up an alert saying so.
+   */
+  Narrative.prototype.updateVersion = function () {
+    var user = NarrativeLogin.sessionInfo.user;
+    Promise.resolve(
+      $.ajax({
+        contentType: "application/json",
+        url: "/narrative_shutdown/" + user,
+        type: "DELETE",
+        crossDomain: true,
+      })
+    )
+      .then(() => {
+        setTimeout(() => {
+          location.replace(
+            `/load-narrative.html?n=${this.workspaceId}&check=true`
+          );
+        }, 200);
+      })
+      .catch((error) => {
+        window.alert(
+          "Unable to update your Narrative session\nError: " +
+            error.status +
+            ": " +
+            error.statusText
+        );
+        console.error(error);
+      });
+  };
+
+  /**
+   * @method
+   * @public
+   * This triggers a save, but saves all cell states first.
+   */
+  Narrative.prototype.saveNarrative = function () {
+    this.stopVersionCheck = true;
+    this.narrController.saveAllCellStates();
+    Jupyter.notebook.save_checkpoint();
+    this.toggleDocumentVersionBtn(false);
+  };
+
+  /**
+   * @method
+   * @public
+   * Insert a new App cell into a narrative and pre-populate its parameters with a given set of
+   * values. The cell is inserted below the currently selected cell.
+   * @param {string} appId - The id of the app (should be in form module_name/app_name)
+   * @param {string} tag - The release tag of the app (one of release, beta, dev)
+   * @param {object} parameters - Key-value-pairs describing the parameters to initialize the app
+   * with. Keys are param ids (should match the spec), and values are the values of those
+   * parameters.
+   */
+  Narrative.prototype.addAndPopulateApp = function (appId, tag, parameters) {
+    this.sidePanel.$methodsWidget.triggerApp(appId, tag, parameters);
+  };
+
+  /**
+   * @method
+   * @public
+   * Insert a new Viewer cell into a narrative for a given object. The new cell is inserted below
+   * the currently selected cell.
+   * @param {string|object|array} obj - If a string, expected to be an object reference. If an object,
+   * expected to be a set of Key-value-pairs describing the object. If an array, expected to be
+   * the usual workspace info array for an object.
+   */
+  Narrative.prototype.addViewerCell = function (obj) {
+    if (Jupyter.narrative.readonly) {
+      new BootstrapDialog({
+        type: "warning",
+        title: "Warning",
+        body:
+          "Read-only Narrative -- may not add a data viewer to this Narrative",
+        alertOnly: true,
+      }).show();
+      return;
+    }
+    var cell = Jupyter.notebook.get_selected_cell(),
+      nearIdx = 0;
+    if (cell) {
+      nearIdx = Jupyter.notebook.find_cell_index(cell);
+    }
+    var objInfo = {};
+    // If a string, expect a ref, and fetch the info.
+    if (typeof obj === "string") {
+      objInfo = this.sidePanel.$dataWidget.getDataObjectByRef(obj, true);
+    }
+    // If an array, expect it to be an array of the info, and convert it.
+    else if (Array.isArray(obj)) {
+      objInfo = ServiceUtils.objectInfoToObject(obj);
+    }
+    // If not an array or a string, it's our object already.
+    else {
+      objInfo = obj;
+    }
+    this.narrController.trigger("createViewerCell.Narrative", {
+      nearCellIdx: nearIdx,
+      widget: "kbaseNarrativeDataCell",
+      info: objInfo,
+    });
+  };
+
+  /**
+   * @method
+   * @public
+   * Insert a new method into the narrative, set it as active, populate the
+   * parameters, and run it.  This is useful for widgets that need to trigger
+   * some additional narrative action, such as creating a FeatureSet from
+   * a selected set of Features in a widget, or computing a statistic on a
+   * subselection made from within a widget.
+   */
+  Narrative.prototype.createAndRunMethod = function (method_id, parameters) {
+    //first make a request to get the method spec of a particular method
+    //getFunctionSpecs.Narrative is implemented in kbaseNarrativeAppPanel
+    var request = { methods: [method_id] };
+    var self = this;
+    self.narrController.trigger("getFunctionSpecs.Narrative", [
+      request,
+      function (specs) {
+        // do nothing if the method could not be found
+        var errorMsg = "Method " + method_id + " not found and cannot run.";
+        if (!specs) {
+          console.error(errorMsg);
+          return;
         }
-        var cells = Jupyter.notebook.get_cells();
-        for (var i = 0; i < cells.length; i++) {
-            var c = cells[i];
-            if (c.metadata.kbase &&
-                c.metadata.kbase.attributes &&
-                c.metadata.kbase.attributes.id &&
-                c.metadata.kbase.attributes.id === id) {
-                return i;
-            }
+        if (!specs.methods) {
+          console.error(errorMsg);
+          return;
         }
-        return null;
-    };
-
-    Narrative.prototype.getCellByKbaseId = function (id) {
-        var cellIndex = this.getCellIndexByKbaseId(id);
-        if (cellIndex !== null) {
-            return Jupyter.notebook.get_cell(this.getCellIndexByKbaseId(id));
+        if (!specs.methods[method_id]) {
+          console.error(errorMsg);
+          return;
         }
-        return null;
-    };
-
-    /**
-     * Jupyter doesn't auto select cells on creation, so this
-     * is a helper that does so. It then returns the cell object
-     * that gets created.
-     */
-    Narrative.prototype.insertAndSelectCellBelow = function (cellType, index, data) {
-        return this.insertAndSelectCell(cellType, 'below', index, data);
-    };
-
-    Narrative.prototype.insertAndSelectCellAbove = function (cellType, index, data) {
-        return this.insertAndSelectCell(cellType, 'above', index, data);
-    };
-
-    Narrative.prototype.insertAndSelectCell = function (cellType, direction, index, data) {
-        var newCell;
-        if (direction === 'below') {
-            newCell = Jupyter.notebook.insert_cell_below(cellType, index, data);
-        } else {
-            newCell = Jupyter.notebook.insert_cell_above(cellType, index, data);
-        }
-        Jupyter.notebook.focus_cell(newCell);
-        Jupyter.notebook.select(Jupyter.notebook.find_cell_index(newCell));
-        this.scrollToCell(newCell);
-
-        return newCell;
-    };
+        // put the method in the narrative by simulating a method clicked in kbaseNarrativeAppPanel
+        self.narrController.trigger(
+          "methodClicked.Narrative",
+          specs.methods[method_id]
+        );
 
-    Narrative.prototype.scrollToCell = function (cell, select) {
-        var $elem = $('#notebook-container');
-        $elem.animate({ scrollTop: cell.element.offset().top + $elem.scrollTop() - $elem.offset().top }, 400);
-        if (select) {
-            Jupyter.notebook.focus_cell(cell);
-            Jupyter.notebook.select(Jupyter.notebook.find_cell_index(cell));
-        }
-    };
+        // the method initializes an internal method input widget, but rendering and initializing is
+        // async, so we have to wait and check back before we can load the parameter state.
+        // TODO: update kbaseNarrativeMethodCell to return a promise to mark when rendering is complete
+        var newCell = Jupyter.notebook.get_selected_cell();
+        var newCellIdx = Jupyter.notebook.get_selected_index();
+        var newWidget = new KBaseNarrativeMethodCell(
+          $("#" + $(newCell.get_text())[0].id)
+        );
+        var updateStateAndRun = function () {
+          if (newWidget.$inputWidget) {
+            // if the $inputWidget is not null, we are good to go, so set the parameters
+            newWidget.loadState(parameters);
+            // make sure the new cell is still selected, then run the method
+            Jupyter.notebook.select(newCellIdx);
+            newWidget.runMethod();
+          } else {
+            // not ready yet, keep waiting
+            window.setTimeout(updateStateAndRun, 500);
+          }
+        };
+        // call the update and run after a short deplay
+        window.setTimeout(updateStateAndRun, 50);
+      },
+    ]);
+  };
+
+  Narrative.prototype.getWorkspaceName = function () {
+    return Jupyter.notebook.metadata.ws_name || null;
+  };
+
+  Narrative.prototype.lookupUserProfile = function (username) {
+    return DisplayUtil.lookupUserProfile(username);
+  };
+
+  /**
+   * A little bit of a riff on the Jupyter "find_cell_index".
+   * Every KBase-ified cell (App, Method, Output) has a unique identifier.
+   * This can be used to find the closest cell element - its index is the
+   * Jupyter cell index (inferred somewhat from find_cell_index which calls
+   * get_cell_elements, which does this searching).
+   */
+  Narrative.prototype.getCellIndexByKbaseId = function (id) {
+    if (!Jupyter.notebook) {
+      return null;
+    }
+    var cells = Jupyter.notebook.get_cells();
+    for (var i = 0; i < cells.length; i++) {
+      var c = cells[i];
+      if (
+        c.metadata.kbase &&
+        c.metadata.kbase.attributes &&
+        c.metadata.kbase.attributes.id &&
+        c.metadata.kbase.attributes.id === id
+      ) {
+        return i;
+      }
+    }
+    return null;
+  };
 
-    /**
-     * if setHidden === true, then always hide
-     * if setHidden === false (not null or undefined), then always show
-     * if the setHidden variable isn't present, then just toggle
-     */
-    Narrative.prototype.toggleSidePanel = function (setHidden) {
-        var delay = 'fast';
-        var hidePanel = setHidden;
-        if (hidePanel === null || hidePanel === undefined) {
-            hidePanel = $('#left-column').is(':visible') ? true : false;
-        }
-        if (hidePanel) {
-            $('#left-column').trigger('hideSidePanelOverlay.Narrative');
-            $('#left-column').hide('slide', {
-                direction: 'left',
-                easing: 'swing',
-                complete: function () {
-                    $('#kb-side-toggle-in').show(0);
-                }
-            }, delay);
-            // Move content flush left-ish
-            $('#notebook-container').animate({ left: 0 }, {
-                easing: 'swing',
-                duration: delay
-            });
-        } else {
-            $('#kb-side-toggle-in').hide(0, function () {
-                $('#left-column').show('slide', {
-                    direction: 'left',
-                    easing: 'swing'
-                }, delay);
-                $('#notebook-container').animate({ left: 380 }, { easing: 'swing', duration: delay });
-            });
+  Narrative.prototype.getCellByKbaseId = function (id) {
+    var cellIndex = this.getCellIndexByKbaseId(id);
+    if (cellIndex !== null) {
+      return Jupyter.notebook.get_cell(this.getCellIndexByKbaseId(id));
+    }
+    return null;
+  };
+
+  /**
+   * Jupyter doesn't auto select cells on creation, so this
+   * is a helper that does so. It then returns the cell object
+   * that gets created.
+   */
+  Narrative.prototype.insertAndSelectCellBelow = function (
+    cellType,
+    index,
+    data
+  ) {
+    return this.insertAndSelectCell(cellType, "below", index, data);
+  };
+
+  Narrative.prototype.insertAndSelectCellAbove = function (
+    cellType,
+    index,
+    data
+  ) {
+    return this.insertAndSelectCell(cellType, "above", index, data);
+  };
+
+  Narrative.prototype.insertAndSelectCell = function (
+    cellType,
+    direction,
+    index,
+    data
+  ) {
+    var newCell;
+    if (direction === "below") {
+      newCell = Jupyter.notebook.insert_cell_below(cellType, index, data);
+    } else {
+      newCell = Jupyter.notebook.insert_cell_above(cellType, index, data);
+    }
+    Jupyter.notebook.focus_cell(newCell);
+    Jupyter.notebook.select(Jupyter.notebook.find_cell_index(newCell));
+    this.scrollToCell(newCell);
+
+    return newCell;
+  };
+
+  Narrative.prototype.scrollToCell = function (cell, select) {
+    var $elem = $("#notebook-container");
+    $elem.animate(
+      {
+        scrollTop:
+          cell.element.offset().top + $elem.scrollTop() - $elem.offset().top,
+      },
+      400
+    );
+    if (select) {
+      Jupyter.notebook.focus_cell(cell);
+      Jupyter.notebook.select(Jupyter.notebook.find_cell_index(cell));
+    }
+  };
+
+  /**
+   * if setHidden === true, then always hide
+   * if setHidden === false (not null or undefined), then always show
+   * if the setHidden variable isn't present, then just toggle
+   */
+  Narrative.prototype.toggleSidePanel = function (setHidden) {
+    var delay = "fast";
+    var hidePanel = setHidden;
+    if (hidePanel === null || hidePanel === undefined) {
+      hidePanel = $("#left-column").is(":visible") ? true : false;
+    }
+    if (hidePanel) {
+      $("#left-column").trigger("hideSidePanelOverlay.Narrative");
+      $("#left-column").hide(
+        "slide",
+        {
+          direction: "left",
+          easing: "swing",
+          complete: function () {
+            $("#kb-side-toggle-in").show(0);
+          },
+        },
+        delay
+      );
+      // Move content flush left-ish
+      $("#notebook-container").animate(
+        { left: 0 },
+        {
+          easing: "swing",
+          duration: delay,
         }
-    };
-
-    Narrative.prototype.showDataOverlay = function () {
-        $(document).trigger('showSidePanelOverlay.Narrative', this.sidePanel.$dataWidget.$overlayPanel);
-    };
-
-    Narrative.prototype.hideOverlay = function () {
-        $(document).trigger('hideSidePanelOverlay.Narrative');
-    };
-
-    /**
-     * Registers a KBase widget with the Narrative controller. This lets the
-     * controller iterate over the widgets it knows about, so it can do group
-     * operations on them.
-     */
-    Narrative.prototype.registerWidget = function (widget, cellId) {
-        this.kbaseWidgets[cellId] = widget;
-        $('#' + cellId).bind('destroyed', function () {
-            this.removeWidget(cellId);
-        }.bind(this));
-    };
-
-    Narrative.prototype.removeWidget = function (cellId) {
-        delete this.kbaseWidgets[cellId];
-    };
-
-    return Narrative;
+      );
+    } else {
+      $("#kb-side-toggle-in").hide(0, function () {
+        $("#left-column").show(
+          "slide",
+          {
+            direction: "left",
+            easing: "swing",
+          },
+          delay
+        );
+        $("#notebook-container").animate(
+          { left: 380 },
+          { easing: "swing", duration: delay }
+        );
+      });
+    }
+  };
+
+  Narrative.prototype.showDataOverlay = function () {
+    $(document).trigger(
+      "showSidePanelOverlay.Narrative",
+      this.sidePanel.$dataWidget.$overlayPanel
+    );
+  };
+
+  Narrative.prototype.hideOverlay = function () {
+    $(document).trigger("hideSidePanelOverlay.Narrative");
+  };
+
+  /**
+   * Registers a KBase widget with the Narrative controller. This lets the
+   * controller iterate over the widgets it knows about, so it can do group
+   * operations on them.
+   */
+  Narrative.prototype.registerWidget = function (widget, cellId) {
+    this.kbaseWidgets[cellId] = widget;
+    $("#" + cellId).bind(
+      "destroyed",
+      function () {
+        this.removeWidget(cellId);
+      }.bind(this)
+    );
+  };
+
+  Narrative.prototype.removeWidget = function (cellId) {
+    delete this.kbaseWidgets[cellId];
+  };
+
+  return Narrative;
 });
diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index f71ec6f959..a392c39b81 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -1,20 +1,100 @@
 /*global define*/
 /*global describe, it, expect*/
 /*global jasmine*/
-/*global beforeEach, afterEach*/
+/*global beforeEach, afterEach, beforeAll*/
 /*jslint white: true*/
 
-define (
-    [
-        'narrativeConfig',
-        'kbaseNarrative'
-    ], function(
-        Config,
-        Narrative
-    ) {
-    describe('Test the kbaseNarrative module', function() {
-        it('Should do things', function() {
+define ([
+    'narrativeConfig',
+    'kbaseNarrative',
+    'base/js/namespace'
+], (
+    Config,
+    Narrative,
+    Jupyter
+) => {
+    'use strict';
 
+    const DEFAULT_FULLY_LOADED = false,
+        DEFAULT_WRITABLE = false,
+        DEFAULT_NOTEBOOK_NAME = 'some notebook';
+
+    describe('Test the kbaseNarrative module', () => {
+        beforeAll(() => {
+            // mock a jupyter notebook.
+            // namespace should already be loaded
+            Jupyter.notebook = {
+                _fully_loaded: DEFAULT_FULLY_LOADED,
+                writable: DEFAULT_WRITABLE,
+                keyboard_manager: {
+                    edit_shortcuts: {
+                        remove_shortcut: () => {}
+                    },
+                    command_shortcuts: {
+                        remove_shortcut: () => {}
+                    }
+                },
+                kernel: {
+                    is_connected: () => false
+                },
+                notebook_name: DEFAULT_NOTEBOOK_NAME
+            };
+        });
+
+        beforeEach(() => {
+            jasmine.Ajax.install();
+        });
+
+        afterEach(() => {
+            jasmine.Ajax.uninstall();
         });
+
+        it('Should instantiate', () => {
+            const narr = new Narrative();
+            expect(narr.maxNarrativeSize).toBe('10 MB');
+        });
+
+        it('Should have an init function', () => {
+            const narr = new Narrative();
+            narr.init();
+        });
+
+        it('Should return for is_loaded', () => {
+            const narr = new Narrative();
+            expect(narr.isLoaded()).toEqual(DEFAULT_FULLY_LOADED);  // default as set in
+        });
+
+        it('Should test ui mode', () => {
+            const narr = new Narrative();
+            expect(narr.uiModeIs('edit')).toBe(DEFAULT_WRITABLE);
+            expect(narr.uiModeIs('view')).toBe(!DEFAULT_WRITABLE);
+            Jupyter.notebook.writable = !Jupyter.notebook.writable;
+            expect(narr.uiModeIs('edit')).toBe(!DEFAULT_WRITABLE);
+            expect(narr.uiModeIs('view')).toBe(DEFAULT_WRITABLE);
+        });
+
+        it('Should provide an auth token when requested', () => {
+            jasmine.Ajax.stubRequest('/token').andReturn({
+                status: 200,
+                statusText: 'HTTP/1.1 200 OK',
+                contentType: 'application/json',
+                response: JSON.stringify({
+
+                })
+            });
+            jasmine.Ajax.stubRequest('/me').andReturn({
+                status: 200,
+                statusText: 'HTTP/1.1 200 OK',
+                contentType: 'application/json',
+                response: JSON.stringify({
+
+                })
+            });
+            document.cookie='kbase_session=foo';
+            const narr = new Narrative();
+            expect(narr.getAuthToken()).toBe('foo');
+        });
+
+
     });
 });

From 82ddc5bebf02d25aa30ef2c4e85e7c71f66626d5 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Mon, 5 Oct 2020 15:03:44 -0700
Subject: [PATCH 03/13] fix linting of kbaseNarrative.js

---
 .../static/kbase/js/kbaseNarrative.js         | 2129 ++++++++---------
 1 file changed, 1059 insertions(+), 1070 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 64d84021f8..eb05b4f6a6 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -163,1115 +163,1104 @@ define([
         return testMode.toLowerCase() === uiMode;
     };
 
-  Narrative.prototype.getAuthToken = function () {
-    return NarrativeLogin.getAuthToken();
-  };
-
-  Narrative.prototype.getNarrativeRef = function () {
-    return Promise.try(() => {
-      if (this.workspaceRef) {
-        return this.workspaceRef;
-      } else {
+    Narrative.prototype.getAuthToken = function () {
+        return NarrativeLogin.getAuthToken();
+    };
+
+    Narrative.prototype.getNarrativeRef = function () {
+        return Promise.try(() => {
+            if (this.workspaceRef) {
+                return this.workspaceRef;
+            } else {
+                return new Workspace(Config.url('workspace'), {
+                    token: this.getAuthToken(),
+                })
+                    .get_workspace_info({ id: this.workspaceId })
+                    .then((wsInfo) => {
+                        let narrId = wsInfo[8]['narrative'];
+                        this.workspaceRef = this.workspaceId + '/' + narrId;
+                        return this.workspaceRef;
+                    });
+            }
+        });
+    };
+
+    Narrative.prototype.getUserPermissions = function () {
         return new Workspace(Config.url('workspace'), {
-          token: this.getAuthToken(),
+            token: this.getAuthToken(),
         })
-          .get_workspace_info({ id: this.workspaceId })
-          .then((wsInfo) => {
-            let narrId = wsInfo[8]['narrative'];
-            this.workspaceRef = this.workspaceId + '/' + narrId;
-            return this.workspaceRef;
-          });
-      }
-    });
-  };
-
-  Narrative.prototype.getUserPermissions = function () {
-    return new Workspace(Config.url('workspace'), {
-      token: this.getAuthToken(),
-    })
-      .get_workspace_info({ id: this.workspaceId })
-      .then((wsInfo) => {
-        return wsInfo[5];
-      });
-  };
-
-  /**
-   * A wrapper around the Jupyter.notebook.kernel.execute() function.
-   * If any KBase widget needs to make a kernel call, it should go through here.
-   * ...when it's done.
-   */
-  Narrative.prototype.executeKernelCall = function () {
-    console.info('no-op for now');
-  };
-
-  // Wrappers for the Jupyter/Jupyter function so we only maintain it in one place.
-  Narrative.prototype.patchKeyboardMapping = function () {
-    var commonShortcuts = [
-        'a',
-        'm',
-        'f',
-        'y',
-        'r',
-        '1',
-        '2',
-        '3',
-        '4',
-        '5',
-        '6',
-        'k',
-        'j',
-        'b',
-        'x',
-        'c',
-        'v',
-        'z',
-        'd,d',
-        's',
-        'l',
-        'o',
-        'h',
-        'i,i',
-        '0,0',
-        'q',
-        'shift-j',
-        'shift-k',
-        'shift-m',
-        'shift-o',
-        'shift-v',
-      ],
-      commandShortcuts = [],
-      editShortcuts = [
-        // remove the command palette
-        // since it exposes commands we have 'disabled'
-        // by removing keyboard mappings
-        'cmdtrl-shift-p',
-      ];
-
-    commonShortcuts.forEach(function (shortcut) {
-      try {
-        Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
-      } catch (ex) {
-        console.warn('Error removing shortcut "' + shortcut + '"', ex);
-      }
-      try {
-        Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
-          shortcut
-        );
-      } catch (ex) {
-        // console.warn('Error removing shortcut ''  + shortcut +'"', ex);
-      }
-    });
-
-    commandShortcuts.forEach(function (shortcut) {
-      try {
-        Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
-      } catch (ex) {
-        console.warn('Error removing shortcut "' + shortcut + '"', ex);
-      }
-    });
-
-    editShortcuts.forEach(function (shortcut) {
-      try {
-        Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
-          shortcut
-        );
-      } catch (ex) {
-        console.warn('Error removing shortcut "' + shortcut + '"', ex);
-      }
-    });
-  };
-
-  Narrative.prototype.disableKeyboardManager = function () {
-    Jupyter.keyboard_manager.disable();
-  };
-
-  Narrative.prototype.enableKeyboardManager = function () {
-    // Jupyter.keyboard_manager.enable();
-  };
-
-  /**
-   * Registers Narrative responses to a few Jupyter events - mainly some
-   * visual effects for managing when the cell toolbar should be shown,
-   * and when saving is being done, but it also disables the keyboard
-   * manager when KBase cells are selected.
-   */
-  Narrative.prototype.registerEvents = function () {
-    var self = this;
-    $([Jupyter.events]).on('before_save.Notebook', function () {
-      $('#kb-save-btn').find('div.fa-save').addClass('fa-spin');
-    });
-    $([Jupyter.events]).on('notebook_saved.Notebook', function () {
-      $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
-      self.stopVersionCheck = false;
-      self.updateDocumentVersion();
-    });
-    $([Jupyter.events]).on('kernel_idle.Kernel', function () {
-      $('#kb-kernel-icon').removeClass().addClass('fa fa-circle-o');
-    });
-    $([Jupyter.events]).on('kernel_busy.Kernel', function () {
-      $('#kb-kernel-icon').removeClass().addClass('fa fa-circle');
-    });
-    [
-      'kernel_connected.Kernel',
-      'kernel_starting.Kernel',
-      'kernel_ready.Kernel',
-      'kernel_disconnected.Kernel',
-      'kernel_killed.Kernel',
-      'kernel_dead.Kernel',
-    ].forEach(function (e) {
-      $([Jupyter.events]).on(e, function () {
-        self.runtime.bus().emit('kernel-state-changed', {
-          isReady:
-            Jupyter.notebook.kernel && Jupyter.notebook.kernel.is_connected(),
+            .get_workspace_info({ id: this.workspaceId })
+            .then((wsInfo) => {
+                return wsInfo[5];
+            });
+    };
+
+    // Wrappers for the Jupyter/Jupyter function so we only maintain it in one place.
+    Narrative.prototype.patchKeyboardMapping = function () {
+        const commonShortcuts = [
+                'a',
+                'm',
+                'f',
+                'y',
+                'r',
+                '1',
+                '2',
+                '3',
+                '4',
+                '5',
+                '6',
+                'k',
+                'j',
+                'b',
+                'x',
+                'c',
+                'v',
+                'z',
+                'd,d',
+                's',
+                'l',
+                'o',
+                'h',
+                'i,i',
+                '0,0',
+                'q',
+                'shift-j',
+                'shift-k',
+                'shift-m',
+                'shift-o',
+                'shift-v',
+            ],
+            commandShortcuts = [],
+            editShortcuts = [
+                // remove the command palette
+                // since it exposes commands we have 'disabled'
+                // by removing keyboard mappings
+                'cmdtrl-shift-p',
+            ];
+
+        commonShortcuts.forEach(function (shortcut) {
+            try {
+                Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
+            } catch (ex) {
+                console.warn('Error removing shortcut "' + shortcut + '"', ex);
+            }
+            try {
+                Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
+                    shortcut
+                );
+            } catch (ex) {
+                // console.warn('Error removing shortcut ''  + shortcut +'"', ex);
+            }
         });
-      });
-    });
-    $([Jupyter.events]).on(
-      'delete.Cell',
-      function () {
-        // this.enableKeyboardManager();
-      }.bind(this)
-    );
-
-    $([Jupyter.events]).on(
-      'notebook_save_failed.Notebook',
-      function (event, data) {
-        $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
-        this.saveFailed(event, data);
-      }.bind(this)
-    );
-  };
-
-  /**
-   * Initializes the sharing panel and sets up the events
-   * that show and hide it.
-   *
-   * This is a hack and a half because Select2, Bootstrap,
-   * and Safari are all hateful things. Here are the sequence of
-   * events.
-   * 1. Initialize the dialog object.
-   * 2. When it gets invoked, show the dialog.
-   * 3. On the FIRST time it gets shown, after it's done
-   * being rendered (shown.bs.modal event), then build and
-   * show the share panel widget. The select2 thing only wants
-   * to appear and behave correctly after the page loads, and
-   * after there's a visible DOM element for it to render in.
-   */
-  Narrative.prototype.initSharePanel = function () {
-    var sharePanel = $(
-        '<div style="text-align:center"><br><br><img src="' +
-          Config.get('loading_gif') +
-          '"></div>'
-      ),
-      shareWidget = null,
-      shareDialog = new BootstrapDialog({
-        title: 'Change Share Settings',
-        body: sharePanel,
-        closeButton: true,
-      });
-    shareDialog.getElement().one(
-      "shown.bs.modal",
-      function () {
-        shareWidget = new KBaseNarrativeSharePanel(sharePanel.empty(), {
-          ws_name_or_id: this.getWorkspaceName(),
+
+        commandShortcuts.forEach(function (shortcut) {
+            try {
+                Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
+            } catch (ex) {
+                console.warn('Error removing shortcut "' + shortcut + '"', ex);
+            }
         });
-      }.bind(this)
-    );
-    $("#kb-share-btn").click(
-      function () {
-        var narrName = Jupyter.notebook.notebook_name;
-        if (
-          narrName.trim().toLowerCase() === "untitled" ||
-          narrName.trim().length === 0
-        ) {
-          Jupyter.save_widget.rename_notebook({
-            notebook: Jupyter.notebook,
-            message: "Please name your Narrative before sharing.",
-            callback: function () {
-              shareDialog.show();
-            },
-          });
-          return;
-        }
-        if (shareWidget) {
-          shareWidget.refresh();
-        }
-        shareDialog.show();
-      }.bind(this)
-    );
-  };
-
-  Narrative.prototype.initStaticNarrativesPanel = function () {
-    if (!Config.get("features").staticNarratives) {
-      $("#kb-static-btn").remove();
-      return;
-    }
-    const staticPanel = $("<div>"),
-      staticDialog = new BootstrapDialog({
-        title: "Static Narratives",
-        body: staticPanel,
-        closeButton: true,
-      }),
-      staticWidget = new StaticNarrativesPanel(staticPanel);
-    $("#kb-static-btn").click(() => {
-      staticWidget.refresh();
-      staticDialog.show();
-    });
-  };
-
-  /**
-   * Expects docInfo to be a workspace object info array, especially where the 4th element is
-   * an int > 0.
-   */
-  Narrative.prototype.checkDocumentVersion = function (docInfo) {
-    if (docInfo.length < 5 || this.stopVersionCheck) {
-      return;
-    }
-    if (docInfo[4] !== this.documentVersionInfo[4]) {
-      // now we make the dialog and all that.
-      $("#kb-narr-version-btn")
-        .off("click")
-        .on(
-          "click",
-          function () {
-            this.showDocumentVersionDialog(docInfo);
-          }.bind(this)
-        );
-      this.toggleDocumentVersionBtn(true);
-    }
-  };
-
-  /**
-   * Expects the usual workspace object info array. If that's present, it's captured. If not,
-   * we run get_object_info_new and fetch it ourselves. Note that it should have its metadata.
-   */
-  Narrative.prototype.updateDocumentVersion = function (docInfo) {
-    var self = this;
-    return Promise.try(function () {
-      if (docInfo) {
-        self.documentVersionInfo = docInfo;
-      } else {
-        var workspace = new Workspace(Config.url("workspace"), {
-          token: self.getAuthToken(),
+
+        editShortcuts.forEach(function (shortcut) {
+            try {
+                Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
+                    shortcut
+                );
+            } catch (ex) {
+                console.warn('Error removing shortcut "' + shortcut + '"', ex);
+            }
+        });
+    };
+
+    Narrative.prototype.disableKeyboardManager = function () {
+        Jupyter.keyboard_manager.disable();
+    };
+
+    Narrative.prototype.enableKeyboardManager = function () {
+        // Jupyter.keyboard_manager.enable();
+    };
+
+    /**
+     * Registers Narrative responses to a few Jupyter events - mainly some
+     * visual effects for managing when the cell toolbar should be shown,
+     * and when saving is being done, but it also disables the keyboard
+     * manager when KBase cells are selected.
+     */
+    Narrative.prototype.registerEvents = function () {
+        var self = this;
+        $([Jupyter.events]).on('before_save.Notebook', function () {
+            $('#kb-save-btn').find('div.fa-save').addClass('fa-spin');
+        });
+        $([Jupyter.events]).on('notebook_saved.Notebook', function () {
+            $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
+            self.stopVersionCheck = false;
+            self.updateDocumentVersion();
         });
-        self
-          .getNarrativeRef()
-          .then((narrativeRef) => {
-            return workspace.get_object_info_new({
-              objects: [{ ref: narrativeRef }],
-              includeMetadata: 1,
+        $([Jupyter.events]).on('kernel_idle.Kernel', function () {
+            $('#kb-kernel-icon').removeClass().addClass('fa fa-circle-o');
+        });
+        $([Jupyter.events]).on('kernel_busy.Kernel', function () {
+            $('#kb-kernel-icon').removeClass().addClass('fa fa-circle');
+        });
+        [
+            'kernel_connected.Kernel',
+            'kernel_starting.Kernel',
+            'kernel_ready.Kernel',
+            'kernel_disconnected.Kernel',
+            'kernel_killed.Kernel',
+            'kernel_dead.Kernel',
+        ].forEach(function (e) {
+            $([Jupyter.events]).on(e, function () {
+                self.runtime.bus().emit('kernel-state-changed', {
+                    isReady:
+                    Jupyter.notebook.kernel && Jupyter.notebook.kernel.is_connected(),
+                });
             });
-          })
-          .then(function (info) {
-            self.documentVersionInfo = info[0];
-          })
-          .catch(function (error) {
-            // no op for now.
-            console.error(error);
-          });
-      }
-    });
-  };
-
-  Narrative.prototype.showDocumentVersionDialog = function (newVerInfo) {
-    var bodyTemplate = Handlebars.compile(DocumentVersionDialogBodyTemplate);
-
-    var versionDialog = new BootstrapDialog({
-      title: "Showing an older Narrative document",
-      body: bodyTemplate({
-        currentVer: this.documentVersionInfo,
-        currentDate: TimeFormat.readableTimestamp(this.documentVersionInfo[3]),
-        newVer: newVerInfo,
-        newDate: TimeFormat.readableTimestamp(newVerInfo[3]),
-        sameUser: this.documentVersionInfo[5] === newVerInfo[5],
-        readOnly: this.readonly,
-      }),
-      alertOnly: true,
-    });
-
-    versionDialog.show();
-  };
-
-  /**
-   * @method
-   * @public
-   * This shows or hides the "narrative has been saved in a different window" button.
-   * If show is truthy, show it. Otherwise, hide it.
-   */
-  Narrative.prototype.toggleDocumentVersionBtn = function (show) {
-    var $btn = $("#kb-narr-version-btn");
-    if (show && !$btn.is(":visible")) {
-      $btn.fadeIn("fast");
-    } else if (!show && $btn.is(":visible")) {
-      $btn.fadeOut("fast");
-    }
-  };
-
-  /**
-   * The "Upgrade your container" dialog should be made available when
-   * there's a more recent version of the Narrative ready to use. This
-   * dialog then lets the user shut down their existing Narrative container.
-   */
-  Narrative.prototype.initUpgradeDialog = function () {
-    var bodyTemplate = Handlebars.compile(UpdateDialogBodyTemplate);
-
-    var $cancelBtn = $('<button type="button" data-dismiss="modal">')
-      .addClass("btn btn-default")
-      .append("Cancel");
-    var $upgradeBtn = $('<button type="button" data-dismiss="modal">')
-      .addClass("btn btn-success")
-      .append("Update and Reload")
-      .click(
-        function () {
-          this.updateVersion();
-        }.bind(this)
-      );
-
-    var upgradeDialog = new BootstrapDialog({
-      title: "New Narrative version available!",
-      buttons: [$cancelBtn, $upgradeBtn],
-    });
-    $("#kb-update-btn").click(function () {
-      upgradeDialog.show();
-    });
-    this.checkVersion().then(
-      function (ver) {
-        upgradeDialog.setBody(
-          bodyTemplate({
-            currentVersion: this.currentVersion,
-            newVersion: ver ? ver.version : "No new version",
-            releaseNotesUrl: Config.get("release_notes"),
-          })
-        );
-        if (ver && ver.version && this.currentVersion !== ver.version) {
-          $("#kb-update-btn").fadeIn("fast");
-        }
-      }.bind(this)
-    );
-  };
-
-  /**
-   * Looks up what is the current version of the Narrative.
-   * This should eventually get rolled into a Narrative Service method call.
-   */
-  Narrative.prototype.checkVersion = function () {
-    // look up new version here.
-    return Promise.resolve(
-      $.ajax({
-        url: Config.url("version_check"),
-        async: true,
-        dataType: "text",
-        crossDomain: true,
-        cache: false,
-      })
-    )
-      .then(function (ver) {
-        return Promise.try(function () {
-          ver = $.parseJSON(ver);
-          return ver;
         });
-      })
-      .catch(function (error) {
-        console.error(
-          "Error while checking for a version update: " + error.statusText
+        $([Jupyter.events]).on(
+            'delete.Cell',
+            function () {
+                // this.enableKeyboardManager();
+            }.bind(this)
         );
-        KBError(
-          "Narrative.checkVersion",
-          "Unable to check for a version update!"
+
+        $([Jupyter.events]).on(
+            'notebook_save_failed.Notebook',
+            function (event, data) {
+                $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
+                this.saveFailed(event, data);
+            }.bind(this)
         );
-      });
-  };
-
-  Narrative.prototype.createShutdownDialogButtons = function () {
-    var $shutdownButton = $("<button>")
-      .attr({ type: "button", "data-dismiss": "modal" })
-      .addClass("btn btn-danger")
-      .append("Okay. Shut it all down!")
-      .click(
-        function () {
-          this.updateVersion();
-        }.bind(this)
-      );
-
-    var $reallyShutdownPanel = $('<div style="margin-top:10px">')
-      .append(
-        "This will shutdown your Narrative session and close this window.<br><b>Any unsaved data in any open Narrative in any window WILL BE LOST!</b><br>"
-      )
-      .append($shutdownButton)
-      .hide();
-
-    var $firstShutdownBtn = $("<button>")
-      .attr({ type: "button" })
-      .addClass("btn btn-danger")
-      .append("Shutdown")
-      .click(function () {
-        $reallyShutdownPanel.slideDown("fast");
-      });
-
-    var $cancelButton = $('<button type="button" data-dismiss="modal">')
-      .addClass("btn btn-default")
-      .append("Dismiss")
-      .click(function () {
-        $reallyShutdownPanel.hide();
-      });
-
-    return {
-      cancelButton: $cancelButton,
-      firstShutdownButton: $firstShutdownBtn,
-      finalShutdownButton: $shutdownButton,
-      shutdownPanel: $reallyShutdownPanel,
     };
-  };
-
-  Narrative.prototype.initAboutDialog = function () {
-    var $versionDiv = $("<div>").append(
-      "<b>Version:</b> " + Config.get("version")
-    );
-    $versionDiv.append(
-      "<br><b>Git Commit:</b> " +
-        Config.get("git_commit_hash") +
-        " -- " +
-        Config.get("git_commit_time")
-    );
-    $versionDiv.append(
-      '<br>View release notes on <a href="' +
-        Config.get("release_notes") +
-        '" target="_blank">Github</a>'
-    );
-
-    var urlList = Object.keys(Config.get("urls")).sort();
-    var $versionTable = $("<table>").addClass(
-      "table table-striped table-bordered"
-    );
-    $.each(urlList, function (idx, val) {
-      var url = Config.url(val);
-      // if url looks like a url (starts with http), include it.
-      // ignore job proxy and submit ticket
-      if (
-        val === "narrative_job_proxy" ||
-        val === "submit_jira_ticket" ||
-        val === "narrative_method_store_types" ||
-        url === null
-      ) {
-        return;
-      }
-      url = url.toString();
-      if (url && url.toLowerCase().indexOf("http") === 0) {
-        $versionTable.append(
-          $("<tr>").append($("<td>").append(val)).append($("<td>").append(url))
+
+    /**
+     * Initializes the sharing panel and sets up the events
+     * that show and hide it.
+     *
+     * This is a hack and a half because Select2, Bootstrap,
+     * and Safari are all hateful things. Here are the sequence of
+     * events.
+     * 1. Initialize the dialog object.
+     * 2. When it gets invoked, show the dialog.
+     * 3. On the FIRST time it gets shown, after it's done
+     * being rendered (shown.bs.modal event), then build and
+     * show the share panel widget. The select2 thing only wants
+     * to appear and behave correctly after the page loads, and
+     * after there's a visible DOM element for it to render in.
+     */
+    Narrative.prototype.initSharePanel = function () {
+        var sharePanel = $(
+                '<div style="text-align:center"><br><br><img src="' +
+                Config.get('loading_gif') +
+                '"></div>'
+            ),
+            shareWidget = null,
+            shareDialog = new BootstrapDialog({
+                title: 'Change Share Settings',
+                body: sharePanel,
+                closeButton: true,
+            });
+        shareDialog.getElement().one(
+            'shown.bs.modal',
+            function () {
+                shareWidget = new KBaseNarrativeSharePanel(sharePanel.empty(), {
+                    ws_name_or_id: this.getWorkspaceName(),
+                });
+            }.bind(this)
         );
-      }
-    });
-    var $verAccordionDiv = $('<div style="margin-top:15px">');
-    $versionDiv.append($verAccordionDiv);
-
-    new KBaseAccordion($verAccordionDiv, {
-      elements: [
-        {
-          title: "KBase Service URLs",
-          body: $versionTable,
-        },
-      ],
-    });
-
-    var shutdownButtons = this.createShutdownDialogButtons();
-    var aboutDialog = new BootstrapDialog({
-      title: "KBase Narrative Properties",
-      body: $versionDiv,
-      buttons: [
-        shutdownButtons.cancelButton,
-        shutdownButtons.firstShutdownButton,
-        shutdownButtons.shutdownPanel,
-      ],
-    });
-
-    $("#kb-about-btn").click(function () {
-      aboutDialog.show();
-    });
-  };
-
-  Narrative.prototype.initShutdownDialog = function () {
-    var shutdownButtons = this.createShutdownDialogButtons();
-
-    var shutdownDialog = new BootstrapDialog({
-      title: "Shutdown and restart narrative?",
-      body: $("<div>").append(
-        "Shutdown and restart your Narrative session? Any unsaved changes in any open Narrative in any window WILL BE LOST!"
-      ),
-      buttons: [
-        shutdownButtons.cancelButton,
-        shutdownButtons.finalShutdownButton,
-      ],
-    });
-
-    $("#kb-shutdown-btn").click(function () {
-      shutdownDialog.show();
-    });
-  };
-
-  Narrative.prototype.saveFailed = function (event, data) {
-    $("#kb-save-btn").find("div.fa-save").removeClass("fa-spin");
-    Jupyter.save_widget.set_save_status("Narrative save failed!");
-
-    var errorText;
-    // 413 means that the Narrative is too large to be saved.
-    // currently - 4/6/2015 - there's a hard limit of 4MB per KBase Narrative.
-    // Any larger object will throw a 413 error, and we need to show some text.
-    if (data.xhr.status === 413) {
-      errorText =
-        "Due to current system constraints, a Narrative may not exceed " +
-        this.maxNarrativeSize +
-        " of text.<br><br>" +
-        "Errors of this sort are usually due to excessive size " +
-        "of outputs from Code Cells, or from large objects " +
-        "embedded in Markdown Cells.<br><br>" +
-        "Please decrease the document size and try to save again.";
-    } else if (data.xhr.responseText) {
-      var $error = $($.parseHTML(data.xhr.responseText));
-      errorText = $error.find("#error-message > h3").text();
-
-      if (errorText) {
-        /* gonna throw in a special case for workspace permissions issues for now.
-         * if it has this pattern:
-         *
-         * User \w+ may not write to workspace \d+
-         * change the text to something more sensible.
-         */
-
-        var res = /User\s+(\w+)\s+may\s+not\s+write\s+to\s+workspace\s+(\d+)/.exec(
-          errorText
+        $('#kb-share-btn').click(
+            function () {
+                var narrName = Jupyter.notebook.notebook_name;
+                if (
+                    narrName.trim().toLowerCase() === 'untitled' ||
+                    narrName.trim().length === 0
+                ) {
+                    Jupyter.save_widget.rename_notebook({
+                        notebook: Jupyter.notebook,
+                        message: 'Please name your Narrative before sharing.',
+                        callback: function () {
+                            shareDialog.show();
+                        },
+                    });
+                    return;
+                }
+                if (shareWidget) {
+                    shareWidget.refresh();
+                }
+                shareDialog.show();
+            }.bind(this)
         );
-        if (res) {
-          errorText =
-            "User " +
-            res[1] +
-            " does not have permission to save to workspace " +
-            res[2] +
-            ".";
+    };
+
+    Narrative.prototype.initStaticNarrativesPanel = function () {
+        if (!Config.get('features').staticNarratives) {
+            $('#kb-static-btn').remove();
+            return;
         }
-      }
-    } else {
-      errorText = "An unknown error occurred!";
-    }
-
-    Jupyter.dialog.modal({
-      title: "Narrative save failed!",
-      body: $("<div>").append(errorText),
-      buttons: {
-        OK: {
-          class: "btn-primary",
-          click: function () {
+        const staticPanel = $('<div>'),
+            staticDialog = new BootstrapDialog({
+                title: 'Static Narratives',
+                body: staticPanel,
+                closeButton: true,
+            }),
+            staticWidget = new StaticNarrativesPanel(staticPanel);
+        $('#kb-static-btn').click(() => {
+            staticWidget.refresh();
+            staticDialog.show();
+        });
+    };
+
+    /**
+     * Expects docInfo to be a workspace object info array, especially where the 4th element is
+     * an int > 0.
+     */
+    Narrative.prototype.checkDocumentVersion = function (docInfo) {
+        if (docInfo.length < 5 || this.stopVersionCheck) {
             return;
-          },
-        },
-      },
-      open: function () {
-        var that = $(this);
-        // Upon ENTER, click the OK button.
-        that.find('input[type="text"]').keydown(function (event) {
-          if (event.which === Keyboard.keycodes.enter) {
-            that.find(".btn-primary").first().click();
-          }
+        }
+        if (docInfo[4] !== this.documentVersionInfo[4]) {
+            // now we make the dialog and all that.
+            $('#kb-narr-version-btn')
+                .off('click')
+                .on(
+                    'click',
+                    function () {
+                        this.showDocumentVersionDialog(docInfo);
+                    }.bind(this)
+                );
+            this.toggleDocumentVersionBtn(true);
+        }
+    };
+
+    /**
+     * Expects the usual workspace object info array. If that's present, it's captured. If not,
+     * we run get_object_info_new and fetch it ourselves. Note that it should have its metadata.
+     */
+    Narrative.prototype.updateDocumentVersion = function (docInfo) {
+        var self = this;
+        return Promise.try(function () {
+            if (docInfo) {
+                self.documentVersionInfo = docInfo;
+            } else {
+                var workspace = new Workspace(Config.url('workspace'), {
+                    token: self.getAuthToken(),
+                });
+                self
+                    .getNarrativeRef()
+                    .then((narrativeRef) => {
+                        return workspace.get_object_info_new({
+                            objects: [{ ref: narrativeRef }],
+                            includeMetadata: 1,
+                        });
+                    })
+                    .then(function (info) {
+                        self.documentVersionInfo = info[0];
+                    })
+                    .catch(function (error) {
+                        // no op for now.
+                        console.error(error);
+                    });
+            }
         });
-        that.find('input[type="text"]').focus();
-      },
-    });
-  };
-
-  Narrative.prototype.initTour = function () {
-    try {
-      $("#kb-tour").click(
-        function (e) {
-          var tour = new Tour.Tour(this);
-          tour.start();
-        }.bind(this)
-      );
-    } catch (e) {
-      console.error(e);
-    }
-  };
-
-  /**
-   * This is the Narrative front end initializer. It should only be run directly after
-   * the app_initialized.NotebookApp event has been fired.
-   *
-   * It does the following steps:
-   * 1. Registers event listeners on Jupyter events such as cell selection, insertion,
-   *    deletion, etc.
-   * 2. Initializes the Core UI dialogs that depend on configuration information (About,
-   *    Upgrade, and Shutdown)
-   * 3. Initializes the
-   */
-  // This should not be run until AFTER the notebook has been loaded!
-  // It depends on elements of the Notebook metadata.
-  Narrative.prototype.init = function () {
-    // NAR-271 - Firefox needs to be told where the top of the page is. :P
-    window.scrollTo(0, 0);
-
-    this.authToken = NarrativeLogin.getAuthToken();
-    console.log("Auth token: " + this.authToken);
-    console.log("session: " + NarrativeLogin.sessionInfo);
-    this.userId = NarrativeLogin.sessionInfo.user;
-
-    Jupyter.narrative.patchKeyboardMapping();
-    this.registerEvents();
-    this.initAboutDialog();
-    this.initUpgradeDialog();
-    this.initShutdownDialog();
-    this.initTour();
-
-    /* Clever extension to $.event from StackOverflow
-     * Lets us watch DOM nodes and catch when a widget's node gets nuked.
-     * http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom
-     *
-     * We bind a jQuery event to a node. Call it 'destroyed'.
-     * When that event is no longer bound (i.e. when the node is removed, OR when .unbind is called)
-     * it triggers the 'remove' function. Lets us keep track of when widgets get removed
-     * in the registerWidget function below.
+    };
+
+    Narrative.prototype.showDocumentVersionDialog = function (newVerInfo) {
+        var bodyTemplate = Handlebars.compile(DocumentVersionDialogBodyTemplate);
+
+        var versionDialog = new BootstrapDialog({
+            title: 'Showing an older Narrative document',
+            body: bodyTemplate({
+                currentVer: this.documentVersionInfo,
+                currentDate: TimeFormat.readableTimestamp(this.documentVersionInfo[3]),
+                newVer: newVerInfo,
+                newDate: TimeFormat.readableTimestamp(newVerInfo[3]),
+                sameUser: this.documentVersionInfo[5] === newVerInfo[5],
+                readOnly: this.readonly,
+            }),
+            alertOnly: true,
+        });
+
+        versionDialog.show();
+    };
+
+    /**
+     * @method
+     * @public
+     * This shows or hides the 'narrative has been saved in a different window' button.
+     * If show is truthy, show it. Otherwise, hide it.
      */
-    $.event.special.destroyed = {
-      remove: function (o) {
-        if (o.handler) {
-          o.handler();
+    Narrative.prototype.toggleDocumentVersionBtn = function (show) {
+        var $btn = $('#kb-narr-version-btn');
+        if (show && !$btn.is(':visible')) {
+            $btn.fadeIn('fast');
+        } else if (!show && $btn.is(':visible')) {
+            $btn.fadeOut('fast');
         }
-      },
     };
 
-    $([Jupyter.events]).on(
-      "notebook_loaded.Notebook",
-      function () {
-        this.loadingWidget.updateProgress("narrative", true);
-        $("#notification_area").find("div#notification_trusted").hide();
-
-        $(document).one(
-          "dataUpdated.Narrative",
-          function () {
-            this.loadingWidget.updateProgress("data", true);
-          }.bind(this)
+    /**
+     * The "Upgrade your container" dialog should be made available when
+     * there's a more recent version of the Narrative ready to use. This
+     * dialog then lets the user shut down their existing Narrative container.
+     */
+    Narrative.prototype.initUpgradeDialog = function () {
+        var bodyTemplate = Handlebars.compile(UpdateDialogBodyTemplate);
+
+        var $cancelBtn = $('<button type="button" data-dismiss="modal">')
+            .addClass('btn btn-default')
+            .append('Cancel');
+        var $upgradeBtn = $('<button type="button" data-dismiss="modal">')
+            .addClass('btn btn-success')
+            .append('Update and Reload')
+            .click(
+                function () {
+                    this.updateVersion();
+                }.bind(this)
+            );
+
+        var upgradeDialog = new BootstrapDialog({
+            title: 'New Narrative version available!',
+            buttons: [$cancelBtn, $upgradeBtn],
+        });
+        $('#kb-update-btn').click(function () {
+            upgradeDialog.show();
+        });
+        this.checkVersion().then(
+            function (ver) {
+                upgradeDialog.setBody(
+                    bodyTemplate({
+                        currentVersion: this.currentVersion,
+                        newVersion: ver ? ver.version : 'No new version',
+                        releaseNotesUrl: Config.get('release_notes'),
+                    })
+                );
+                if (ver && ver.version && this.currentVersion !== ver.version) {
+                    $('#kb-update-btn').fadeIn('fast');
+                }
+            }.bind(this)
         );
+    };
+
+    /**
+     * Looks up what is the current version of the Narrative.
+     * This should eventually get rolled into a Narrative Service method call.
+     */
+    Narrative.prototype.checkVersion = function () {
+        // look up new version here.
+        return Promise.resolve(
+            $.ajax({
+                url: Config.url('version_check'),
+                async: true,
+                dataType: 'text',
+                crossDomain: true,
+                cache: false,
+            })
+        )
+            .then(function (ver) {
+                return Promise.try(function () {
+                    ver = $.parseJSON(ver);
+                    return ver;
+                });
+            })
+            .catch(function (error) {
+                console.error(
+                    'Error while checking for a version update: ' + error.statusText
+                );
+                KBError(
+                    'Narrative.checkVersion',
+                    'Unable to check for a version update!'
+                );
+            });
+    };
+
+    Narrative.prototype.createShutdownDialogButtons = function () {
+        var $shutdownButton = $('<button>')
+            .attr({ type: 'button', 'data-dismiss': 'modal' })
+            .addClass('btn btn-danger')
+            .append('Okay. Shut it all down!')
+            .click(
+                function () {
+                    this.updateVersion();
+                }.bind(this)
+            );
+
+        var $reallyShutdownPanel = $('<div style="margin-top:10px">')
+            .append(
+                'This will shutdown your Narrative session and close this window.<br><b>Any unsaved data in any open Narrative in any window WILL BE LOST!</b><br>'
+            )
+            .append($shutdownButton)
+            .hide();
+
+        var $firstShutdownBtn = $('<button>')
+            .attr({ type: 'button' })
+            .addClass('btn btn-danger')
+            .append('Shutdown')
+            .click(function () {
+                $reallyShutdownPanel.slideDown('fast');
+            });
 
-        $(document).one(
-          "appListUpdated.Narrative",
-          function () {
-            this.loadingWidget.updateProgress("apps", true);
-          }.bind(this)
+        var $cancelButton = $('<button type="button" data-dismiss="modal">')
+            .addClass('btn btn-default')
+            .append('Dismiss')
+            .click(function () {
+                $reallyShutdownPanel.hide();
+            });
+
+        return {
+            cancelButton: $cancelButton,
+            firstShutdownButton: $firstShutdownBtn,
+            finalShutdownButton: $shutdownButton,
+            shutdownPanel: $reallyShutdownPanel,
+        };
+    };
+
+    Narrative.prototype.initAboutDialog = function () {
+        var $versionDiv = $('<div>').append(
+            '<b>Version:</b> ' + Config.get('version')
+        );
+        $versionDiv.append(
+            '<br><b>Git Commit:</b> ' +
+            Config.get('git_commit_hash') +
+            ' -- ' +
+            Config.get('git_commit_time')
+        );
+        $versionDiv.append(
+            '<br>View release notes on <a href="' +
+            Config.get('release_notes') +
+            '" target="_blank">Github</a>'
         );
 
-        // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
-        this.sidePanel = new KBaseNarrativeSidePanel($("#kb-side-panel"), {
-          autorender: false,
-        });
-        this.narrController = new KBaseNarrativeWorkspace(
-          $("#notebook_panel"),
-          {
-            ws_id: this.getWorkspaceName(),
-          }
+        var urlList = Object.keys(Config.get('urls')).sort();
+        var $versionTable = $('<table>').addClass(
+            'table table-striped table-bordered'
         );
+        $.each(urlList, function (idx, val) {
+            var url = Config.url(val);
+            // if url looks like a url (starts with http), include it.
+            // ignore job proxy and submit ticket
+            if (
+                val === 'narrative_job_proxy' ||
+                val === 'submit_jira_ticket' ||
+                val === 'narrative_method_store_types' ||
+                url === null
+            ) {
+                return;
+            }
+            url = url.toString();
+            if (url && url.toLowerCase().indexOf('http') === 0) {
+                $versionTable.append(
+                    $('<tr>').append($('<td>').append(val)).append($('<td>').append(url))
+                );
+            }
+        });
+        var $verAccordionDiv = $('<div style="margin-top:15px">');
+        $versionDiv.append($verAccordionDiv);
+
+        new KBaseAccordion($verAccordionDiv, {
+            elements: [
+                {
+                    title: 'KBase Service URLs',
+                    body: $versionTable,
+                },
+            ],
+        });
+
+        var shutdownButtons = this.createShutdownDialogButtons();
+        var aboutDialog = new BootstrapDialog({
+            title: 'KBase Narrative Properties',
+            body: $versionDiv,
+            buttons: [
+                shutdownButtons.cancelButton,
+                shutdownButtons.firstShutdownButton,
+                shutdownButtons.shutdownPanel,
+            ],
+        });
+
+        $('#kb-about-btn').click(function () {
+            aboutDialog.show();
+        });
+    };
 
-        // Disable autosave so as not to spam the Workspace.
-        Jupyter.notebook.set_autosave_interval(0);
-        KBaseCellToolbar.register(Jupyter.notebook);
-        Jupyter.CellToolbar.activate_preset("KBase");
-        Jupyter.CellToolbar.global_show();
+    Narrative.prototype.initShutdownDialog = function () {
+        var shutdownButtons = this.createShutdownDialogButtons();
+
+        var shutdownDialog = new BootstrapDialog({
+            title: 'Shutdown and restart narrative?',
+            body: $('<div>').append(
+                'Shutdown and restart your Narrative session? Any unsaved changes in any open Narrative in any window WILL BE LOST!'
+            ),
+            buttons: [
+                shutdownButtons.cancelButton,
+                shutdownButtons.finalShutdownButton,
+            ],
+        });
 
-        if (Jupyter.notebook && Jupyter.notebook.metadata) {
-          var creatorId = Jupyter.notebook.metadata.creator || "KBase User";
-          DisplayUtil.displayRealName(creatorId, $("#kb-narr-creator"));
+        $('#kb-shutdown-btn').click(function () {
+            shutdownDialog.show();
+        });
+    };
 
-          // This puts the cell menu in the right place.
-          $([Jupyter.events]).trigger("select.Cell", {
-            cell: Jupyter.notebook.get_selected_cell(),
-          });
+    Narrative.prototype.saveFailed = function (event, data) {
+        $('#kb-save-btn').find('div.fa-save').removeClass('fa-spin');
+        Jupyter.save_widget.set_save_status('Narrative save failed!');
+
+        var errorText;
+        // 413 means that the Narrative is too large to be saved.
+        // currently - 4/6/2015 - there's a hard limit of 4MB per KBase Narrative.
+        // Any larger object will throw a 413 error, and we need to show some text.
+        if (data.xhr.status === 413) {
+            errorText =
+                'Due to current system constraints, a Narrative may not exceed ' +
+                this.maxNarrativeSize +
+                ' of text.<br><br>' +
+                'Errors of this sort are usually due to excessive size ' +
+                'of outputs from Code Cells, or from large objects ' +
+                'embedded in Markdown Cells.<br><br>' +
+                'Please decrease the document size and try to save again.';
+        } else if (data.xhr.responseText) {
+            var $error = $($.parseHTML(data.xhr.responseText));
+            errorText = $error.find('#error-message > h3').text();
+
+            if (errorText) {
+                /* gonna throw in a special case for workspace permissions issues for now.
+                * if it has this pattern:
+                *
+                * User \w+ may not write to workspace \d+
+                * change the text to something more sensible.
+                */
+
+                var res = /User\s+(\w+)\s+may\s+not\s+write\s+to\s+workspace\s+(\d+)/.exec(
+                    errorText
+                );
+                if (res) {
+                    errorText =
+                        'User ' +
+                        res[1] +
+                        ' does not have permission to save to workspace ' +
+                        res[2] +
+                        '.';
+                }
+            }
+        } else {
+            errorText = 'An unknown error occurred!';
         }
-        if (this.getWorkspaceName() === null) {
-          KBFatal(
-            "Narrative.init",
-            "Unable to locate workspace name from the Narrative object!"
-          );
-          this.loadingWidget.remove();
-          return;
+
+        Jupyter.dialog.modal({
+            title: 'Narrative save failed!',
+            body: $('<div>').append(errorText),
+            buttons: {
+                OK: {
+                    class: 'btn-primary',
+                    click: function () {
+                        return;
+                    },
+                },
+            },
+            open: function () {
+                var that = $(this);
+                // Upon ENTER, click the OK button.
+                that.find('input[type="text"]').keydown(function (event) {
+                    if (event.which === Keyboard.keycodes.enter) {
+                        that.find('.btn-primary').first().click();
+                    }
+                });
+                that.find('input[type="text"]').focus();
+            },
+        });
+    };
+
+    Narrative.prototype.initTour = function () {
+        try {
+            $('#kb-tour').click(
+                function () {
+                    var tour = new Tour.Tour(this);
+                    tour.start();
+                }.bind(this)
+            );
+        } catch (e) {
+            console.error(e);
         }
-        this.initSharePanel();
-        this.initStaticNarrativesPanel();
-        this.updateDocumentVersion()
-          .then(
-            function () {
-              // init the controller
-              return this.narrController.render();
-            }.bind(this)
-          )
-          .finally(
+    };
+
+    /**
+     * This is the Narrative front end initializer. It should only be run directly after
+     * the app_initialized.NotebookApp event has been fired.
+     *
+     * It does the following steps:
+     * 1. Registers event listeners on Jupyter events such as cell selection, insertion,
+     *    deletion, etc.
+     * 2. Initializes the Core UI dialogs that depend on configuration information (About,
+     *    Upgrade, and Shutdown)
+     * 3. Initializes the
+     */
+    // This should not be run until AFTER the notebook has been loaded!
+    // It depends on elements of the Notebook metadata.
+    Narrative.prototype.init = function () {
+        // NAR-271 - Firefox needs to be told where the top of the page is. :P
+        window.scrollTo(0, 0);
+
+        this.authToken = NarrativeLogin.getAuthToken();
+        this.userId = NarrativeLogin.sessionInfo.user;
+
+        Jupyter.narrative.patchKeyboardMapping();
+        this.registerEvents();
+        this.initAboutDialog();
+        this.initUpgradeDialog();
+        this.initShutdownDialog();
+        this.initTour();
+
+        /* Clever extension to $.event from StackOverflow
+        * Lets us watch DOM nodes and catch when a widget's node gets nuked.
+        * http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom
+        *
+        * We bind a jQuery event to a node. Call it 'destroyed'.
+        * When that event is no longer bound (i.e. when the node is removed, OR when .unbind is called)
+        * it triggers the 'remove' function. Lets us keep track of when widgets get removed
+        * in the registerWidget function below.
+        */
+        $.event.special.destroyed = {
+            remove: function (o) {
+                if (o.handler) {
+                    o.handler();
+                }
+            },
+        };
+
+        $([Jupyter.events]).on(
+            'notebook_loaded.Notebook',
             function () {
-              this.sidePanel.render();
+                this.loadingWidget.updateProgress('narrative', true);
+                $('#notification_area').find('div#notification_trusted').hide();
+
+                $(document).one(
+                    'dataUpdated.Narrative',
+                    function () {
+                        this.loadingWidget.updateProgress('data', true);
+                    }.bind(this)
+                );
+
+                $(document).one(
+                    'appListUpdated.Narrative',
+                    function () {
+                        this.loadingWidget.updateProgress('apps', true);
+                    }.bind(this)
+                );
+
+                // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
+                this.sidePanel = new KBaseNarrativeSidePanel($('#kb-side-panel'), {
+                    autorender: false,
+                });
+                this.narrController = new KBaseNarrativeWorkspace(
+                    $('#notebook_panel'),
+                    {
+                        ws_id: this.getWorkspaceName(),
+                    }
+                );
+
+                // Disable autosave so as not to spam the Workspace.
+                Jupyter.notebook.set_autosave_interval(0);
+                KBaseCellToolbar.register(Jupyter.notebook);
+                Jupyter.CellToolbar.activate_preset('KBase');
+                Jupyter.CellToolbar.global_show();
+
+                if (Jupyter.notebook && Jupyter.notebook.metadata) {
+                    var creatorId = Jupyter.notebook.metadata.creator || 'KBase User';
+                    DisplayUtil.displayRealName(creatorId, $('#kb-narr-creator'));
+
+                    // This puts the cell menu in the right place.
+                    $([Jupyter.events]).trigger('select.Cell', {
+                        cell: Jupyter.notebook.get_selected_cell(),
+                    });
+                }
+                if (this.getWorkspaceName() === null) {
+                    KBFatal(
+                        'Narrative.init',
+                        'Unable to locate workspace name from the Narrative object!'
+                    );
+                    this.loadingWidget.remove();
+                    return;
+                }
+                this.initSharePanel();
+                this.initStaticNarrativesPanel();
+                this.updateDocumentVersion()
+                    .then(
+                        function () {
+                        // init the controller
+                            return this.narrController.render();
+                        }.bind(this)
+                    )
+                    .finally(
+                        function () {
+                            this.sidePanel.render();
+                        }.bind(this)
+                    );
+
+                $([Jupyter.events]).on('kernel_connected.Kernel', () => {
+                    this.loadingWidget.updateProgress('kernel', true);
+                    this.jobCommChannel = new JobCommChannel();
+                    // TODO: This should be an event 'kernel-ready', perhaps broadcast
+                    // on the default bus channel.
+                    this.jobCommChannel
+                        .initCommChannel()
+                        .then(() => this.loadingWidget.updateProgress('jobs', true))
+                        .catch((err) => {
+                        // TODO: put the narrative into a terminal state
+                            console.error('ERROR initializing kbase comm channel', err);
+                            KBFatal(
+                                'Narrative.ini',
+                                'KBase communication channel could not be initiated with the back end. TODO'
+                            );
+                        });
+                });
             }.bind(this)
-          );
-
-        $([Jupyter.events]).on("kernel_connected.Kernel", (e) => {
-          this.loadingWidget.updateProgress("kernel", true);
-          this.jobCommChannel = new JobCommChannel();
-          // TODO: This should be an event "kernel-ready", perhaps broadcast
-          // on the default bus channel.
-          this.jobCommChannel
-            .initCommChannel()
-            .then(() => this.loadingWidget.updateProgress("jobs", true))
-            .catch((err) => {
-              // TODO: put the narrative into a terminal state
-              console.error("ERROR initializing kbase comm channel", err);
-              KBFatal(
-                "Narrative.ini",
-                "KBase communication channel could not be initiated with the back end. TODO"
-              );
+        );
+    };
+
+    /**
+     * @method
+     * @public
+     * This manually deletes the Docker container that this Narrative runs in, if there is one.
+     * If it can't, or if this is being run locally, it pops up an alert saying so.
+     */
+    Narrative.prototype.updateVersion = function () {
+        var user = NarrativeLogin.sessionInfo.user;
+        Promise.resolve(
+            $.ajax({
+                contentType: 'application/json',
+                url: '/narrative_shutdown/' + user,
+                type: 'DELETE',
+                crossDomain: true,
+            })
+        )
+            .then(() => {
+                setTimeout(() => {
+                    location.replace(
+                        `/load-narrative.html?n=${this.workspaceId}&check=true`
+                    );
+                }, 200);
+            })
+            .catch((error) => {
+                window.alert(
+                    'Unable to update your Narrative session\nError: ' +
+                    error.status +
+                    ': ' +
+                    error.statusText
+                );
+                console.error(error);
             });
+    };
+
+    /**
+     * @method
+     * @public
+     * This triggers a save, but saves all cell states first.
+     */
+    Narrative.prototype.saveNarrative = function () {
+        this.stopVersionCheck = true;
+        this.narrController.saveAllCellStates();
+        Jupyter.notebook.save_checkpoint();
+        this.toggleDocumentVersionBtn(false);
+    };
+
+    /**
+     * @method
+     * @public
+     * Insert a new App cell into a narrative and pre-populate its parameters with a given set of
+     * values. The cell is inserted below the currently selected cell.
+     * @param {string} appId - The id of the app (should be in form module_name/app_name)
+     * @param {string} tag - The release tag of the app (one of release, beta, dev)
+     * @param {object} parameters - Key-value-pairs describing the parameters to initialize the app
+     * with. Keys are param ids (should match the spec), and values are the values of those
+     * parameters.
+     */
+    Narrative.prototype.addAndPopulateApp = function (appId, tag, parameters) {
+        this.sidePanel.$methodsWidget.triggerApp(appId, tag, parameters);
+    };
+
+    /**
+     * @method
+     * @public
+     * Insert a new Viewer cell into a narrative for a given object. The new cell is inserted below
+     * the currently selected cell.
+     * @param {string|object|array} obj - If a string, expected to be an object reference. If an object,
+     * expected to be a set of Key-value-pairs describing the object. If an array, expected to be
+     * the usual workspace info array for an object.
+     */
+    Narrative.prototype.addViewerCell = function (obj) {
+        if (Jupyter.narrative.readonly) {
+            new BootstrapDialog({
+                type: 'warning',
+                title: 'Warning',
+                body:
+                'Read-only Narrative -- may not add a data viewer to this Narrative',
+                alertOnly: true,
+            }).show();
+            return;
+        }
+        var cell = Jupyter.notebook.get_selected_cell(),
+            nearIdx = 0;
+        if (cell) {
+            nearIdx = Jupyter.notebook.find_cell_index(cell);
+        }
+        var objInfo = {};
+        // If a string, expect a ref, and fetch the info.
+        if (typeof obj === 'string') {
+            objInfo = this.sidePanel.$dataWidget.getDataObjectByRef(obj, true);
+        }
+        // If an array, expect it to be an array of the info, and convert it.
+        else if (Array.isArray(obj)) {
+            objInfo = ServiceUtils.objectInfoToObject(obj);
+        }
+        // If not an array or a string, it's our object already.
+        else {
+            objInfo = obj;
+        }
+        this.narrController.trigger('createViewerCell.Narrative', {
+            nearCellIdx: nearIdx,
+            widget: 'kbaseNarrativeDataCell',
+            info: objInfo,
         });
-      }.bind(this)
-    );
-  };
-
-  /**
-   * @method
-   * @public
-   * This manually deletes the Docker container that this Narrative runs in, if there is one.
-   * If it can't, or if this is being run locally, it pops up an alert saying so.
-   */
-  Narrative.prototype.updateVersion = function () {
-    var user = NarrativeLogin.sessionInfo.user;
-    Promise.resolve(
-      $.ajax({
-        contentType: "application/json",
-        url: "/narrative_shutdown/" + user,
-        type: "DELETE",
-        crossDomain: true,
-      })
-    )
-      .then(() => {
-        setTimeout(() => {
-          location.replace(
-            `/load-narrative.html?n=${this.workspaceId}&check=true`
-          );
-        }, 200);
-      })
-      .catch((error) => {
-        window.alert(
-          "Unable to update your Narrative session\nError: " +
-            error.status +
-            ": " +
-            error.statusText
-        );
-        console.error(error);
-      });
-  };
-
-  /**
-   * @method
-   * @public
-   * This triggers a save, but saves all cell states first.
-   */
-  Narrative.prototype.saveNarrative = function () {
-    this.stopVersionCheck = true;
-    this.narrController.saveAllCellStates();
-    Jupyter.notebook.save_checkpoint();
-    this.toggleDocumentVersionBtn(false);
-  };
-
-  /**
-   * @method
-   * @public
-   * Insert a new App cell into a narrative and pre-populate its parameters with a given set of
-   * values. The cell is inserted below the currently selected cell.
-   * @param {string} appId - The id of the app (should be in form module_name/app_name)
-   * @param {string} tag - The release tag of the app (one of release, beta, dev)
-   * @param {object} parameters - Key-value-pairs describing the parameters to initialize the app
-   * with. Keys are param ids (should match the spec), and values are the values of those
-   * parameters.
-   */
-  Narrative.prototype.addAndPopulateApp = function (appId, tag, parameters) {
-    this.sidePanel.$methodsWidget.triggerApp(appId, tag, parameters);
-  };
-
-  /**
-   * @method
-   * @public
-   * Insert a new Viewer cell into a narrative for a given object. The new cell is inserted below
-   * the currently selected cell.
-   * @param {string|object|array} obj - If a string, expected to be an object reference. If an object,
-   * expected to be a set of Key-value-pairs describing the object. If an array, expected to be
-   * the usual workspace info array for an object.
-   */
-  Narrative.prototype.addViewerCell = function (obj) {
-    if (Jupyter.narrative.readonly) {
-      new BootstrapDialog({
-        type: "warning",
-        title: "Warning",
-        body:
-          "Read-only Narrative -- may not add a data viewer to this Narrative",
-        alertOnly: true,
-      }).show();
-      return;
-    }
-    var cell = Jupyter.notebook.get_selected_cell(),
-      nearIdx = 0;
-    if (cell) {
-      nearIdx = Jupyter.notebook.find_cell_index(cell);
-    }
-    var objInfo = {};
-    // If a string, expect a ref, and fetch the info.
-    if (typeof obj === "string") {
-      objInfo = this.sidePanel.$dataWidget.getDataObjectByRef(obj, true);
-    }
-    // If an array, expect it to be an array of the info, and convert it.
-    else if (Array.isArray(obj)) {
-      objInfo = ServiceUtils.objectInfoToObject(obj);
-    }
-    // If not an array or a string, it's our object already.
-    else {
-      objInfo = obj;
-    }
-    this.narrController.trigger("createViewerCell.Narrative", {
-      nearCellIdx: nearIdx,
-      widget: "kbaseNarrativeDataCell",
-      info: objInfo,
-    });
-  };
-
-  /**
-   * @method
-   * @public
-   * Insert a new method into the narrative, set it as active, populate the
-   * parameters, and run it.  This is useful for widgets that need to trigger
-   * some additional narrative action, such as creating a FeatureSet from
-   * a selected set of Features in a widget, or computing a statistic on a
-   * subselection made from within a widget.
-   */
-  Narrative.prototype.createAndRunMethod = function (method_id, parameters) {
-    //first make a request to get the method spec of a particular method
-    //getFunctionSpecs.Narrative is implemented in kbaseNarrativeAppPanel
-    var request = { methods: [method_id] };
-    var self = this;
-    self.narrController.trigger("getFunctionSpecs.Narrative", [
-      request,
-      function (specs) {
-        // do nothing if the method could not be found
-        var errorMsg = "Method " + method_id + " not found and cannot run.";
-        if (!specs) {
-          console.error(errorMsg);
-          return;
+    };
+
+    /**
+     * @method
+     * @public
+     * Insert a new method into the narrative, set it as active, populate the
+     * parameters, and run it.  This is useful for widgets that need to trigger
+     * some additional narrative action, such as creating a FeatureSet from
+     * a selected set of Features in a widget, or computing a statistic on a
+     * subselection made from within a widget.
+     */
+    Narrative.prototype.createAndRunMethod = function (method_id, parameters) {
+        //first make a request to get the method spec of a particular method
+        //getFunctionSpecs.Narrative is implemented in kbaseNarrativeAppPanel
+        var request = { methods: [method_id] };
+        var self = this;
+        self.narrController.trigger('getFunctionSpecs.Narrative', [
+            request,
+            function (specs) {
+                // do nothing if the method could not be found
+                var errorMsg = 'Method ' + method_id + ' not found and cannot run.';
+                if (!specs) {
+                    console.error(errorMsg);
+                    return;
+                }
+                if (!specs.methods) {
+                    console.error(errorMsg);
+                    return;
+                }
+                if (!specs.methods[method_id]) {
+                    console.error(errorMsg);
+                    return;
+                }
+                // put the method in the narrative by simulating a method clicked in kbaseNarrativeAppPanel
+                self.narrController.trigger(
+                    'methodClicked.Narrative',
+                    specs.methods[method_id]
+                );
+
+                // the method initializes an internal method input widget, but rendering and initializing is
+                // async, so we have to wait and check back before we can load the parameter state.
+                // TODO: update kbaseNarrativeMethodCell to return a promise to mark when rendering is complete
+                var newCell = Jupyter.notebook.get_selected_cell();
+                var newCellIdx = Jupyter.notebook.get_selected_index();
+                var newWidget = new KBaseNarrativeMethodCell(
+                    $('#' + $(newCell.get_text())[0].id)
+                );
+                var updateStateAndRun = function () {
+                    if (newWidget.$inputWidget) {
+                    // if the $inputWidget is not null, we are good to go, so set the parameters
+                        newWidget.loadState(parameters);
+                        // make sure the new cell is still selected, then run the method
+                        Jupyter.notebook.select(newCellIdx);
+                        newWidget.runMethod();
+                    } else {
+                        // not ready yet, keep waiting
+                        window.setTimeout(updateStateAndRun, 500);
+                    }
+                };
+                // call the update and run after a short deplay
+                window.setTimeout(updateStateAndRun, 50);
+            },
+        ]);
+    };
+
+    Narrative.prototype.getWorkspaceName = function () {
+        return Jupyter.notebook.metadata.ws_name || null;
+    };
+
+    Narrative.prototype.lookupUserProfile = function (username) {
+        return DisplayUtil.lookupUserProfile(username);
+    };
+
+    /**
+     * A little bit of a riff on the Jupyter 'find_cell_index'.
+     * Every KBase-ified cell (App, Method, Output) has a unique identifier.
+     * This can be used to find the closest cell element - its index is the
+     * Jupyter cell index (inferred somewhat from find_cell_index which calls
+     * get_cell_elements, which does this searching).
+     */
+    Narrative.prototype.getCellIndexByKbaseId = function (id) {
+        if (!Jupyter.notebook) {
+            return null;
+        }
+        var cells = Jupyter.notebook.get_cells();
+        for (var i = 0; i < cells.length; i++) {
+            var c = cells[i];
+            if (
+                c.metadata.kbase &&
+                c.metadata.kbase.attributes &&
+                c.metadata.kbase.attributes.id &&
+                c.metadata.kbase.attributes.id === id
+            ) {
+                return i;
+            }
         }
-        if (!specs.methods) {
-          console.error(errorMsg);
-          return;
+        return null;
+    };
+
+    Narrative.prototype.getCellByKbaseId = function (id) {
+        var cellIndex = this.getCellIndexByKbaseId(id);
+        if (cellIndex !== null) {
+            return Jupyter.notebook.get_cell(this.getCellIndexByKbaseId(id));
         }
-        if (!specs.methods[method_id]) {
-          console.error(errorMsg);
-          return;
+        return null;
+    };
+
+    /**
+     * Jupyter doesn't auto select cells on creation, so this
+     * is a helper that does so. It then returns the cell object
+     * that gets created.
+     */
+    Narrative.prototype.insertAndSelectCellBelow = function (
+        cellType,
+        index,
+        data
+    ) {
+        return this.insertAndSelectCell(cellType, 'below', index, data);
+    };
+
+    Narrative.prototype.insertAndSelectCellAbove = function (
+        cellType,
+        index,
+        data
+    ) {
+        return this.insertAndSelectCell(cellType, 'above', index, data);
+    };
+
+    Narrative.prototype.insertAndSelectCell = function (
+        cellType,
+        direction,
+        index,
+        data
+    ) {
+        var newCell;
+        if (direction === 'below') {
+            newCell = Jupyter.notebook.insert_cell_below(cellType, index, data);
+        } else {
+            newCell = Jupyter.notebook.insert_cell_above(cellType, index, data);
         }
-        // put the method in the narrative by simulating a method clicked in kbaseNarrativeAppPanel
-        self.narrController.trigger(
-          "methodClicked.Narrative",
-          specs.methods[method_id]
-        );
+        Jupyter.notebook.focus_cell(newCell);
+        Jupyter.notebook.select(Jupyter.notebook.find_cell_index(newCell));
+        this.scrollToCell(newCell);
+
+        return newCell;
+    };
 
-        // the method initializes an internal method input widget, but rendering and initializing is
-        // async, so we have to wait and check back before we can load the parameter state.
-        // TODO: update kbaseNarrativeMethodCell to return a promise to mark when rendering is complete
-        var newCell = Jupyter.notebook.get_selected_cell();
-        var newCellIdx = Jupyter.notebook.get_selected_index();
-        var newWidget = new KBaseNarrativeMethodCell(
-          $("#" + $(newCell.get_text())[0].id)
+    Narrative.prototype.scrollToCell = function (cell, select) {
+        var $elem = $('#notebook-container');
+        $elem.animate(
+            {
+                scrollTop:
+                cell.element.offset().top + $elem.scrollTop() - $elem.offset().top,
+            },
+            400
         );
-        var updateStateAndRun = function () {
-          if (newWidget.$inputWidget) {
-            // if the $inputWidget is not null, we are good to go, so set the parameters
-            newWidget.loadState(parameters);
-            // make sure the new cell is still selected, then run the method
-            Jupyter.notebook.select(newCellIdx);
-            newWidget.runMethod();
-          } else {
-            // not ready yet, keep waiting
-            window.setTimeout(updateStateAndRun, 500);
-          }
-        };
-        // call the update and run after a short deplay
-        window.setTimeout(updateStateAndRun, 50);
-      },
-    ]);
-  };
-
-  Narrative.prototype.getWorkspaceName = function () {
-    return Jupyter.notebook.metadata.ws_name || null;
-  };
-
-  Narrative.prototype.lookupUserProfile = function (username) {
-    return DisplayUtil.lookupUserProfile(username);
-  };
-
-  /**
-   * A little bit of a riff on the Jupyter "find_cell_index".
-   * Every KBase-ified cell (App, Method, Output) has a unique identifier.
-   * This can be used to find the closest cell element - its index is the
-   * Jupyter cell index (inferred somewhat from find_cell_index which calls
-   * get_cell_elements, which does this searching).
-   */
-  Narrative.prototype.getCellIndexByKbaseId = function (id) {
-    if (!Jupyter.notebook) {
-      return null;
-    }
-    var cells = Jupyter.notebook.get_cells();
-    for (var i = 0; i < cells.length; i++) {
-      var c = cells[i];
-      if (
-        c.metadata.kbase &&
-        c.metadata.kbase.attributes &&
-        c.metadata.kbase.attributes.id &&
-        c.metadata.kbase.attributes.id === id
-      ) {
-        return i;
-      }
-    }
-    return null;
-  };
-
-  Narrative.prototype.getCellByKbaseId = function (id) {
-    var cellIndex = this.getCellIndexByKbaseId(id);
-    if (cellIndex !== null) {
-      return Jupyter.notebook.get_cell(this.getCellIndexByKbaseId(id));
-    }
-    return null;
-  };
-
-  /**
-   * Jupyter doesn't auto select cells on creation, so this
-   * is a helper that does so. It then returns the cell object
-   * that gets created.
-   */
-  Narrative.prototype.insertAndSelectCellBelow = function (
-    cellType,
-    index,
-    data
-  ) {
-    return this.insertAndSelectCell(cellType, "below", index, data);
-  };
-
-  Narrative.prototype.insertAndSelectCellAbove = function (
-    cellType,
-    index,
-    data
-  ) {
-    return this.insertAndSelectCell(cellType, "above", index, data);
-  };
-
-  Narrative.prototype.insertAndSelectCell = function (
-    cellType,
-    direction,
-    index,
-    data
-  ) {
-    var newCell;
-    if (direction === "below") {
-      newCell = Jupyter.notebook.insert_cell_below(cellType, index, data);
-    } else {
-      newCell = Jupyter.notebook.insert_cell_above(cellType, index, data);
-    }
-    Jupyter.notebook.focus_cell(newCell);
-    Jupyter.notebook.select(Jupyter.notebook.find_cell_index(newCell));
-    this.scrollToCell(newCell);
-
-    return newCell;
-  };
-
-  Narrative.prototype.scrollToCell = function (cell, select) {
-    var $elem = $("#notebook-container");
-    $elem.animate(
-      {
-        scrollTop:
-          cell.element.offset().top + $elem.scrollTop() - $elem.offset().top,
-      },
-      400
-    );
-    if (select) {
-      Jupyter.notebook.focus_cell(cell);
-      Jupyter.notebook.select(Jupyter.notebook.find_cell_index(cell));
-    }
-  };
-
-  /**
-   * if setHidden === true, then always hide
-   * if setHidden === false (not null or undefined), then always show
-   * if the setHidden variable isn't present, then just toggle
-   */
-  Narrative.prototype.toggleSidePanel = function (setHidden) {
-    var delay = "fast";
-    var hidePanel = setHidden;
-    if (hidePanel === null || hidePanel === undefined) {
-      hidePanel = $("#left-column").is(":visible") ? true : false;
-    }
-    if (hidePanel) {
-      $("#left-column").trigger("hideSidePanelOverlay.Narrative");
-      $("#left-column").hide(
-        "slide",
-        {
-          direction: "left",
-          easing: "swing",
-          complete: function () {
-            $("#kb-side-toggle-in").show(0);
-          },
-        },
-        delay
-      );
-      // Move content flush left-ish
-      $("#notebook-container").animate(
-        { left: 0 },
-        {
-          easing: "swing",
-          duration: delay,
+        if (select) {
+            Jupyter.notebook.focus_cell(cell);
+            Jupyter.notebook.select(Jupyter.notebook.find_cell_index(cell));
+        }
+    };
+
+    /**
+     * if setHidden === true, then always hide
+     * if setHidden === false (not null or undefined), then always show
+     * if the setHidden variable isn't present, then just toggle
+     */
+    Narrative.prototype.toggleSidePanel = function (setHidden) {
+        var delay = 'fast';
+        var hidePanel = setHidden;
+        if (hidePanel === null || hidePanel === undefined) {
+            hidePanel = $('#left-column').is(':visible') ? true : false;
+        }
+        if (hidePanel) {
+            $('#left-column').trigger('hideSidePanelOverlay.Narrative');
+            $('#left-column').hide(
+                'slide',
+                {
+                    direction: 'left',
+                    easing: 'swing',
+                    complete: function () {
+                        $('#kb-side-toggle-in').show(0);
+                    },
+                },
+                delay
+            );
+            // Move content flush left-ish
+            $('#notebook-container').animate(
+                { left: 0 },
+                {
+                    easing: 'swing',
+                    duration: delay,
+                }
+            );
+        } else {
+            $('#kb-side-toggle-in').hide(0, function () {
+                $('#left-column').show(
+                    'slide',
+                    {
+                        direction: 'left',
+                        easing: 'swing',
+                    },
+                    delay
+                );
+                $('#notebook-container').animate(
+                    { left: 380 },
+                    { easing: 'swing', duration: delay }
+                );
+            });
         }
-      );
-    } else {
-      $("#kb-side-toggle-in").hide(0, function () {
-        $("#left-column").show(
-          "slide",
-          {
-            direction: "left",
-            easing: "swing",
-          },
-          delay
+    };
+
+    Narrative.prototype.showDataOverlay = function () {
+        $(document).trigger(
+            'showSidePanelOverlay.Narrative',
+            this.sidePanel.$dataWidget.$overlayPanel
         );
-        $("#notebook-container").animate(
-          { left: 380 },
-          { easing: "swing", duration: delay }
+    };
+
+    Narrative.prototype.hideOverlay = function () {
+        $(document).trigger('hideSidePanelOverlay.Narrative');
+    };
+
+    /**
+     * Registers a KBase widget with the Narrative controller. This lets the
+     * controller iterate over the widgets it knows about, so it can do group
+     * operations on them.
+     */
+    Narrative.prototype.registerWidget = function (widget, cellId) {
+        this.kbaseWidgets[cellId] = widget;
+        $('#' + cellId).bind(
+            'destroyed',
+            function () {
+                this.removeWidget(cellId);
+            }.bind(this)
         );
-      });
-    }
-  };
-
-  Narrative.prototype.showDataOverlay = function () {
-    $(document).trigger(
-      "showSidePanelOverlay.Narrative",
-      this.sidePanel.$dataWidget.$overlayPanel
-    );
-  };
-
-  Narrative.prototype.hideOverlay = function () {
-    $(document).trigger("hideSidePanelOverlay.Narrative");
-  };
-
-  /**
-   * Registers a KBase widget with the Narrative controller. This lets the
-   * controller iterate over the widgets it knows about, so it can do group
-   * operations on them.
-   */
-  Narrative.prototype.registerWidget = function (widget, cellId) {
-    this.kbaseWidgets[cellId] = widget;
-    $("#" + cellId).bind(
-      "destroyed",
-      function () {
-        this.removeWidget(cellId);
-      }.bind(this)
-    );
-  };
-
-  Narrative.prototype.removeWidget = function (cellId) {
-    delete this.kbaseWidgets[cellId];
-  };
-
-  return Narrative;
+    };
+
+    Narrative.prototype.removeWidget = function (cellId) {
+        delete this.kbaseWidgets[cellId];
+    };
+
+    return Narrative;
 });

From f380cf56aae085a643b9c9561882a4d3c5b63005 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Mon, 5 Oct 2020 15:52:16 -0700
Subject: [PATCH 04/13] add missing files to coverage

---
 test/unit/karma.conf.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/test/unit/karma.conf.js b/test/unit/karma.conf.js
index ddadcb0628..7c5ccf2746 100644
--- a/test/unit/karma.conf.js
+++ b/test/unit/karma.conf.js
@@ -29,6 +29,7 @@ module.exports = function (config) {
             'kbase-extension/static/kbase/js/api/!(*[Cc]lient*|Catalog|KBaseFeatureValues|NarrativeJobServiceWrapper|NewWorkspace)*.js': ['coverage'],
             'kbase-extension/static/kbase/js/api/RestAPIClient.js': ['coverage'],
             'nbextensions/appcell2/widgets/tabs/*.js': ['coverage'],
+            'kbase-extension/static/kbase/js/*.js': ['coverage']
         },
         files: [
             'kbase-extension/static/narrative_paths.js',

From 7f517e19648b1dd483d631e2ab9c86cb71f09605 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Tue, 6 Oct 2020 10:08:16 -0700
Subject: [PATCH 05/13] got tests working, now to actually tests what we want

---
 .../static/kbase/js/kbaseNarrative.js         | 136 ++++++++----------
 test/unit/spec/kbaseNarrativeSpec.js          |  90 ++++++++----
 2 files changed, 122 insertions(+), 104 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index eb05b4f6a6..512d32a034 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -802,7 +802,7 @@ define([
         this.authToken = NarrativeLogin.getAuthToken();
         this.userId = NarrativeLogin.sessionInfo.user;
 
-        Jupyter.narrative.patchKeyboardMapping();
+        this.patchKeyboardMapping();
         this.registerEvents();
         this.initAboutDialog();
         this.initUpgradeDialog();
@@ -826,94 +826,72 @@ define([
             },
         };
 
-        $([Jupyter.events]).on(
-            'notebook_loaded.Notebook',
-            function () {
-                this.loadingWidget.updateProgress('narrative', true);
-                $('#notification_area').find('div#notification_trusted').hide();
+        $([Jupyter.events]).on('notebook_loaded.Notebook', () => {
+            this.loadingWidget.updateProgress('narrative', true);
+            $('#notification_area').find('div#notification_trusted').hide();
 
-                $(document).one(
-                    'dataUpdated.Narrative',
-                    function () {
-                        this.loadingWidget.updateProgress('data', true);
-                    }.bind(this)
-                );
+            $(document).one(
+                'dataUpdated.Narrative',
+                () => this.loadingWidget.updateProgress('data', true)
+            );
 
-                $(document).one(
-                    'appListUpdated.Narrative',
-                    function () {
-                        this.loadingWidget.updateProgress('apps', true);
-                    }.bind(this)
-                );
+            $(document).one(
+                'appListUpdated.Narrative',
+                () => this.loadingWidget.updateProgress('apps', true)
+            );
 
-                // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
-                this.sidePanel = new KBaseNarrativeSidePanel($('#kb-side-panel'), {
-                    autorender: false,
-                });
-                this.narrController = new KBaseNarrativeWorkspace(
-                    $('#notebook_panel'),
-                    {
-                        ws_id: this.getWorkspaceName(),
-                    }
-                );
+            // Tricky with inter/intra-dependencies between kbaseNarrative and kbaseNarrativeWorkspace...
+            this.sidePanel = new KBaseNarrativeSidePanel($('#kb-side-panel'), {
+                autorender: false,
+            });
+            this.narrController = new KBaseNarrativeWorkspace(
+                $('#notebook_panel'),
+                { ws_id: this.getWorkspaceName() }
+            );
 
-                // Disable autosave so as not to spam the Workspace.
-                Jupyter.notebook.set_autosave_interval(0);
-                KBaseCellToolbar.register(Jupyter.notebook);
-                Jupyter.CellToolbar.activate_preset('KBase');
-                Jupyter.CellToolbar.global_show();
+            // Disable autosave so as not to spam the Workspace.
+            Jupyter.notebook.set_autosave_interval(0);
+            KBaseCellToolbar.register(Jupyter.notebook);
+            Jupyter.CellToolbar.activate_preset('KBase');
+            Jupyter.CellToolbar.global_show();
 
-                if (Jupyter.notebook && Jupyter.notebook.metadata) {
-                    var creatorId = Jupyter.notebook.metadata.creator || 'KBase User';
-                    DisplayUtil.displayRealName(creatorId, $('#kb-narr-creator'));
+            if (Jupyter.notebook && Jupyter.notebook.metadata) {
+                const creatorId = Jupyter.notebook.metadata.creator || 'KBase User';
+                DisplayUtil.displayRealName(creatorId, $('#kb-narr-creator'));
 
-                    // This puts the cell menu in the right place.
-                    $([Jupyter.events]).trigger('select.Cell', {
-                        cell: Jupyter.notebook.get_selected_cell(),
-                    });
-                }
-                if (this.getWorkspaceName() === null) {
+                // This puts the cell menu in the right place.
+                $([Jupyter.events]).trigger('select.Cell', {
+                    cell: Jupyter.notebook.get_selected_cell(),
+                });
+            }
+            if (this.getWorkspaceName() === null) {
+                KBFatal(
+                    'Narrative.init',
+                    'Unable to locate workspace name from the Narrative object!'
+                );
+                this.loadingWidget.remove();
+                return;
+            }
+            this.initSharePanel();
+            this.initStaticNarrativesPanel();
+            this.updateDocumentVersion()
+                .then(() => this.narrController.render())
+                .finally(() => this.sidePanel.render());
+        });
+        $([Jupyter.events]).on('kernel_connected.Kernel', () => {
+            this.loadingWidget.updateProgress('kernel', true);
+            this.jobCommChannel = new JobCommChannel();
+            this.jobCommChannel
+                .initCommChannel()
+                .then(() => this.loadingWidget.updateProgress('jobs', true))
+                .catch((err) => {
+                    console.error('An error occurred while initializing kbase comm channel', err);
                     KBFatal(
                         'Narrative.init',
-                        'Unable to locate workspace name from the Narrative object!'
+                        'KBase communication channel could not be initiated with the kernel.'
                     );
-                    this.loadingWidget.remove();
-                    return;
-                }
-                this.initSharePanel();
-                this.initStaticNarrativesPanel();
-                this.updateDocumentVersion()
-                    .then(
-                        function () {
-                        // init the controller
-                            return this.narrController.render();
-                        }.bind(this)
-                    )
-                    .finally(
-                        function () {
-                            this.sidePanel.render();
-                        }.bind(this)
-                    );
-
-                $([Jupyter.events]).on('kernel_connected.Kernel', () => {
-                    this.loadingWidget.updateProgress('kernel', true);
-                    this.jobCommChannel = new JobCommChannel();
-                    // TODO: This should be an event 'kernel-ready', perhaps broadcast
-                    // on the default bus channel.
-                    this.jobCommChannel
-                        .initCommChannel()
-                        .then(() => this.loadingWidget.updateProgress('jobs', true))
-                        .catch((err) => {
-                        // TODO: put the narrative into a terminal state
-                            console.error('ERROR initializing kbase comm channel', err);
-                            KBFatal(
-                                'Narrative.ini',
-                                'KBase communication channel could not be initiated with the back end. TODO'
-                            );
-                        });
                 });
-            }.bind(this)
-        );
+        });
     };
 
     /**
diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index a392c39b81..68a11dd524 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -5,21 +5,27 @@
 /*jslint white: true*/
 
 define ([
+    'jquery',
     'narrativeConfig',
     'kbaseNarrative',
-    'base/js/namespace'
+    'base/js/namespace',
+    'narrativeLogin'
 ], (
+    $,
     Config,
     Narrative,
-    Jupyter
+    Jupyter,
+    NarrativeLogin
 ) => {
     'use strict';
 
     const DEFAULT_FULLY_LOADED = false,
         DEFAULT_WRITABLE = false,
-        DEFAULT_NOTEBOOK_NAME = 'some notebook';
+        DEFAULT_NOTEBOOK_NAME = 'some notebook',
+        FAKE_TOKEN = 'foo';
 
     describe('Test the kbaseNarrative module', () => {
+        let loginDiv = $('<div>');
         beforeAll(() => {
             // mock a jupyter notebook.
             // namespace should already be loaded
@@ -39,10 +45,60 @@ define ([
                 },
                 notebook_name: DEFAULT_NOTEBOOK_NAME
             };
+            Jupyter.keyboard_manager = Jupyter.notebook.keyboard_manager;
         });
 
-        beforeEach(() => {
+        beforeEach(async () => {
+            // we need to be "logged in" for various tests to work, especially initing the Narrative object.
+            // this means mocking up some auth responses, and the NarrativeLogin object.
+            document.cookie='kbase_session=' + FAKE_TOKEN;
             jasmine.Ajax.install();
+            jasmine.Ajax.stubRequest(/\/token$/).andReturn({
+                status: 200,
+                statusText: 'HTTP/1.1 200 OK',
+                contentType: 'application/json',
+                responseText: JSON.stringify({
+                    type: 'Login',
+                    id: 'some-token-id',
+                    expires: 16027145808440,
+                    created: 1601504980844,
+                    name: null,
+                    user: 'some_user',
+                    custom: {},
+                    cachefor: 300000
+                })
+            });
+            jasmine.Ajax.stubRequest(/\/me$/).andReturn({
+                status: 200,
+                statusText: 'HTTP/1.1 200 OK',
+                contentType: 'application/json',
+                responseText: JSON.stringify({
+                    created: 1490219221579,
+                    lastlogin: 1601504980844,
+                    display: 'Some User',
+                    roles:[
+                        {id: 'DevToken', desc: 'Create developer tokens'},
+                        {id: 'ServToken', desc: 'Create server tokens'}
+                    ],
+                    customroles:['role1', 'role2'],
+                    policyids:[
+                        {id: 'data-policy.1', agreedon:1497637084128},
+                        {id: 'data-policy.3', agreedon:1490285343224},
+                        {id: 'kbase-user.1', agreedon:1497637084130},
+                        {id: 'kbase-user.2', agreedon:1490285343222}
+                    ],
+                    user: 'some_user',
+                    local: false,
+                    email: 'some_user@somewhere.com',
+                    idents:[
+                        {provusername: 'some_user@somewhere.org', provider:'Globus', id: 'some-globus-ident-id'},
+                        {provusername: '1234-5678-9012-3456', provider:'OrcID', id: 'some-orcid-ident-id'}
+                    ]
+                })
+            });
+            // The NarrativeLogin.init call invokes both of the above token/user profile calls.
+            // It's called before the creation of the Narrative object. So that needs to happen here.
+            await NarrativeLogin.init(loginDiv);
         });
 
         afterEach(() => {
@@ -54,12 +110,14 @@ define ([
             expect(narr.maxNarrativeSize).toBe('10 MB');
         });
 
-        it('Should have an init function', () => {
+        it('Should have an init function', (done) => {
             const narr = new Narrative();
             narr.init();
+            $([Jupyter.events]).trigger('kernel_connected.Kernel');
+            setTimeout(() => done(), 1000);
         });
 
-        it('Should return for is_loaded', () => {
+        it('Should return a boolean for is_loaded', () => {
             const narr = new Narrative();
             expect(narr.isLoaded()).toEqual(DEFAULT_FULLY_LOADED);  // default as set in
         });
@@ -74,27 +132,9 @@ define ([
         });
 
         it('Should provide an auth token when requested', () => {
-            jasmine.Ajax.stubRequest('/token').andReturn({
-                status: 200,
-                statusText: 'HTTP/1.1 200 OK',
-                contentType: 'application/json',
-                response: JSON.stringify({
-
-                })
-            });
-            jasmine.Ajax.stubRequest('/me').andReturn({
-                status: 200,
-                statusText: 'HTTP/1.1 200 OK',
-                contentType: 'application/json',
-                response: JSON.stringify({
-
-                })
-            });
-            document.cookie='kbase_session=foo';
             const narr = new Narrative();
-            expect(narr.getAuthToken()).toBe('foo');
+            expect(narr.getAuthToken()).toBe(FAKE_TOKEN);
         });
 
-
     });
 });

From 601442046c29043cfe392da7a2284be1d8d34e60 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Wed, 7 Oct 2020 13:57:42 -0700
Subject: [PATCH 06/13] got init happy test working

---
 .../static/kbase/js/kbaseNarrative.js         | 24 ++++++++---
 test/unit/spec/kbaseNarrativeSpec.js          | 43 +++++++++++++++----
 2 files changed, 53 insertions(+), 14 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 512d32a034..3238a72cf9 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -790,12 +790,20 @@ define([
      * 1. Registers event listeners on Jupyter events such as cell selection, insertion,
      *    deletion, etc.
      * 2. Initializes the Core UI dialogs that depend on configuration information (About,
-     *    Upgrade, and Shutdown)
-     * 3. Initializes the
+     *    Upgrade, and Shutdown).
+     * 3. Initializes the help tour.
+     *
+     * The rest depends on a few Jupyter events being fired. Once the notebook is registered
+     * as "loaded" (notebook_loaded.Notebook), we can proceed to load the data, apps, and
+     * side panel components.
+     *
+     * When the kernel is connected (the channel between front and back ends, with the
+     * kernel_connected.Kernel event), we can set up the job communication channel.
+     *
+     * Since these are handled by jquery events, we need a couple of optional callbacks
+     *
      */
-    // This should not be run until AFTER the notebook has been loaded!
-    // It depends on elements of the Notebook metadata.
-    Narrative.prototype.init = function () {
+    Narrative.prototype.init = function (jobsReadyCallback) {
         // NAR-271 - Firefox needs to be told where the top of the page is. :P
         window.scrollTo(0, 0);
 
@@ -883,13 +891,17 @@ define([
             this.jobCommChannel = new JobCommChannel();
             this.jobCommChannel
                 .initCommChannel()
-                .then(() => this.loadingWidget.updateProgress('jobs', true))
+                .then(() => {
+                    this.loadingWidget.updateProgress('jobs', true);
+                    jobsReadyCallback();
+                })
                 .catch((err) => {
                     console.error('An error occurred while initializing kbase comm channel', err);
                     KBFatal(
                         'Narrative.init',
                         'KBase communication channel could not be initiated with the kernel.'
                     );
+                    jobsReadyCallback(err);
                 });
         });
     };
diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index 68a11dd524..ab7d268bb0 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -41,7 +41,25 @@ define ([
                     }
                 },
                 kernel: {
-                    is_connected: () => false
+                    is_connected: () => false,
+                    comm_info: (comm_name, callback) => {
+                        callback({content: {
+                            comms: {
+                                'some_comm_id': {
+                                    target_name: 'KBaseJobs'
+                                }
+                            }
+                        }});
+                    },
+                    comm_manager: {
+                        register_comm: () => {}
+                    },
+                    execute: (code, callbacks) => {
+                        console.log(code);
+                        callbacks.shell.reply({
+                            content: {}
+                        });
+                    }
                 },
                 notebook_name: DEFAULT_NOTEBOOK_NAME
             };
@@ -82,10 +100,10 @@ define ([
                     ],
                     customroles:['role1', 'role2'],
                     policyids:[
-                        {id: 'data-policy.1', agreedon:1497637084128},
-                        {id: 'data-policy.3', agreedon:1490285343224},
-                        {id: 'kbase-user.1', agreedon:1497637084130},
-                        {id: 'kbase-user.2', agreedon:1490285343222}
+                        {id: 'data-policy.1', agreedon: 1497637084128},
+                        {id: 'data-policy.3', agreedon: 1490285343224},
+                        {id: 'kbase-user.1', agreedon: 1497637084130},
+                        {id: 'kbase-user.2', agreedon: 1490285343222}
                     ],
                     user: 'some_user',
                     local: false,
@@ -110,11 +128,20 @@ define ([
             expect(narr.maxNarrativeSize).toBe('10 MB');
         });
 
-        it('Should have an init function', (done) => {
+        it('Should have an init function that responds when the kernel is connected', (done, fail) => {
             const narr = new Narrative();
-            narr.init();
+            const jobsReadyCallback = (err) => {
+                if (err) {
+                    fail(err);
+                }
+                done();
+            };
+            narr.init(jobsReadyCallback);
             $([Jupyter.events]).trigger('kernel_connected.Kernel');
-            setTimeout(() => done(), 1000);
+        });
+
+        it('init should fail as expected when the job connection fails', (done, fail) => {
+
         });
 
         it('Should return a boolean for is_loaded', () => {

From 2165fc3c05ac222729a5451c3c55f3790b004a61 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Wed, 7 Oct 2020 15:20:29 -0700
Subject: [PATCH 07/13] fix tests

---
 .../static/kbase/js/kbaseNarrative.js         |   2 +-
 test/unit/spec/kbaseNarrativeSpec.js          | 121 ++++++++++--------
 2 files changed, 71 insertions(+), 52 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 3238a72cf9..7c6e4e8bbb 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -901,7 +901,7 @@ define([
                         'Narrative.init',
                         'KBase communication channel could not be initiated with the kernel.'
                     );
-                    jobsReadyCallback(err);
+                    jobsReadyCallback({error: err});
                 });
         });
     };
diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index ab7d268bb0..b717694954 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -26,45 +26,6 @@ define ([
 
     describe('Test the kbaseNarrative module', () => {
         let loginDiv = $('<div>');
-        beforeAll(() => {
-            // mock a jupyter notebook.
-            // namespace should already be loaded
-            Jupyter.notebook = {
-                _fully_loaded: DEFAULT_FULLY_LOADED,
-                writable: DEFAULT_WRITABLE,
-                keyboard_manager: {
-                    edit_shortcuts: {
-                        remove_shortcut: () => {}
-                    },
-                    command_shortcuts: {
-                        remove_shortcut: () => {}
-                    }
-                },
-                kernel: {
-                    is_connected: () => false,
-                    comm_info: (comm_name, callback) => {
-                        callback({content: {
-                            comms: {
-                                'some_comm_id': {
-                                    target_name: 'KBaseJobs'
-                                }
-                            }
-                        }});
-                    },
-                    comm_manager: {
-                        register_comm: () => {}
-                    },
-                    execute: (code, callbacks) => {
-                        console.log(code);
-                        callbacks.shell.reply({
-                            content: {}
-                        });
-                    }
-                },
-                notebook_name: DEFAULT_NOTEBOOK_NAME
-            };
-            Jupyter.keyboard_manager = Jupyter.notebook.keyboard_manager;
-        });
 
         beforeEach(async () => {
             // we need to be "logged in" for various tests to work, especially initing the Narrative object.
@@ -114,6 +75,44 @@ define ([
                     ]
                 })
             });
+
+            // mock a jupyter notebook.
+            // namespace should already be loaded
+            Jupyter.notebook = {
+                _fully_loaded: DEFAULT_FULLY_LOADED,
+                writable: DEFAULT_WRITABLE,
+                keyboard_manager: {
+                    edit_shortcuts: {
+                        remove_shortcut: () => {}
+                    },
+                    command_shortcuts: {
+                        remove_shortcut: () => {}
+                    }
+                },
+                kernel: {
+                    is_connected: () => false,
+                    comm_info: (comm_name, callback) => {
+                        callback({content: {
+                            comms: {
+                                'some_comm_id': {
+                                    target_name: 'KBaseJobs'
+                                }
+                            }
+                        }});
+                    },
+                    comm_manager: {
+                        register_comm: () => {}
+                    },
+                    execute: (code, callbacks) => {
+                        callbacks.shell.reply({
+                            content: {}
+                        });
+                    }
+                },
+                notebook_name: DEFAULT_NOTEBOOK_NAME
+            };
+            Jupyter.keyboard_manager = Jupyter.notebook.keyboard_manager;
+
             // The NarrativeLogin.init call invokes both of the above token/user profile calls.
             // It's called before the creation of the Narrative object. So that needs to happen here.
             await NarrativeLogin.init(loginDiv);
@@ -121,6 +120,7 @@ define ([
 
         afterEach(() => {
             jasmine.Ajax.uninstall();
+            Jupyter.notebook = null;
         });
 
         it('Should instantiate', () => {
@@ -128,20 +128,39 @@ define ([
             expect(narr.maxNarrativeSize).toBe('10 MB');
         });
 
-        it('Should have an init function that responds when the kernel is connected', (done, fail) => {
-            const narr = new Narrative();
-            const jobsReadyCallback = (err) => {
-                if (err) {
-                    fail(err);
-                }
-                done();
-            };
-            narr.init(jobsReadyCallback);
-            $([Jupyter.events]).trigger('kernel_connected.Kernel');
+        it('Should have an init function that responds when the kernel is connected', () => {
+            return new Promise((resolve, reject) => {
+                const narr = new Narrative();
+                const jobsReadyCallback = (err) => {
+                    if (err) {
+                        reject('This should not have failed', err);
+                    }
+                    else {
+                        resolve();
+                    }
+                };
+                narr.init(jobsReadyCallback);
+                $([Jupyter.events]).trigger('kernel_connected.Kernel');
+            });
         });
 
-        it('init should fail as expected when the job connection fails', (done, fail) => {
-
+        it('init should fail as expected when the job connection fails', () => {
+            return new Promise((resolve, reject) => {
+                Jupyter.notebook.kernel.comm_info = () => {
+                    throw new Error('an error happened');
+                };
+                const narr = new Narrative();
+                const jobsReadyCallback = (err) => {
+                    if (err) {
+                        resolve();
+                    }
+                    else {
+                        reject('expected an error');
+                    }
+                };
+                narr.init(jobsReadyCallback);
+                $([Jupyter.events]).trigger('kernel_connected.Kernel');
+            });
         });
 
         it('Should return a boolean for is_loaded', () => {

From d640baa85499432c8179c7dd8781a9f82395cfd3 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Wed, 7 Oct 2020 15:49:31 -0700
Subject: [PATCH 08/13] fix tests to make codacy happy

---
 test/unit/spec/kbaseNarrativeSpec.js | 23 -----------------------
 1 file changed, 23 deletions(-)

diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index b717694954..afb2e31468 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -39,12 +39,8 @@ define ([
                 responseText: JSON.stringify({
                     type: 'Login',
                     id: 'some-token-id',
-                    expires: 16027145808440,
-                    created: 1601504980844,
                     name: null,
                     user: 'some_user',
-                    custom: {},
-                    cachefor: 300000
                 })
             });
             jasmine.Ajax.stubRequest(/\/me$/).andReturn({
@@ -52,27 +48,8 @@ define ([
                 statusText: 'HTTP/1.1 200 OK',
                 contentType: 'application/json',
                 responseText: JSON.stringify({
-                    created: 1490219221579,
-                    lastlogin: 1601504980844,
                     display: 'Some User',
-                    roles:[
-                        {id: 'DevToken', desc: 'Create developer tokens'},
-                        {id: 'ServToken', desc: 'Create server tokens'}
-                    ],
-                    customroles:['role1', 'role2'],
-                    policyids:[
-                        {id: 'data-policy.1', agreedon: 1497637084128},
-                        {id: 'data-policy.3', agreedon: 1490285343224},
-                        {id: 'kbase-user.1', agreedon: 1497637084130},
-                        {id: 'kbase-user.2', agreedon: 1490285343222}
-                    ],
                     user: 'some_user',
-                    local: false,
-                    email: 'some_user@somewhere.com',
-                    idents:[
-                        {provusername: 'some_user@somewhere.org', provider:'Globus', id: 'some-globus-ident-id'},
-                        {provusername: '1234-5678-9012-3456', provider:'OrcID', id: 'some-orcid-ident-id'}
-                    ]
                 })
             });
 

From c09cacc0a0919407df16ca4bcbc5a00d42b0c160 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Wed, 7 Oct 2020 15:52:50 -0700
Subject: [PATCH 09/13] update comments

---
 kbase-extension/static/kbase/js/kbaseNarrative.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 7c6e4e8bbb..8d84cf8850 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -800,7 +800,11 @@ define([
      * When the kernel is connected (the channel between front and back ends, with the
      * kernel_connected.Kernel event), we can set up the job communication channel.
      *
-     * Since these are handled by jquery events, we need a couple of optional callbacks
+     * Since these are handled by jquery events, we need an optional callback. The
+     * jobsReadyCallback function is invoked after setting up (or failing to set up) the
+     * job communication channel with the kernel. It takes an (optional) error object as
+     * input, which will have structure { error: xxx }, where xxx is the structure of the error
+     * that might get thrown by the Jupyter stack.
      *
      */
     Narrative.prototype.init = function (jobsReadyCallback) {

From e11daec0980cb03b1cfcb64bb8fbd33381a199ea Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Wed, 7 Oct 2020 15:57:21 -0700
Subject: [PATCH 10/13] make jobsReadyCallback optional

---
 kbase-extension/static/kbase/js/kbaseNarrative.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 8d84cf8850..42d9a264b1 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -897,7 +897,9 @@ define([
                 .initCommChannel()
                 .then(() => {
                     this.loadingWidget.updateProgress('jobs', true);
-                    jobsReadyCallback();
+                    if (jobsReadyCallback) {
+                        jobsReadyCallback();
+                    }
                 })
                 .catch((err) => {
                     console.error('An error occurred while initializing kbase comm channel', err);
@@ -905,7 +907,9 @@ define([
                         'Narrative.init',
                         'KBase communication channel could not be initiated with the kernel.'
                     );
-                    jobsReadyCallback({error: err});
+                    if (jobsReadyCallback) {
+                        jobsReadyCallback({error: err});
+                    }
                 });
         });
     };

From 9a9fdedfacd6a25b48b1427cdcf86bfed957fefe Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Fri, 23 Oct 2020 15:15:11 -0700
Subject: [PATCH 11/13] fix some minor things in the tests

---
 test/unit/spec/kbaseNarrativeSpec.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/test/unit/spec/kbaseNarrativeSpec.js b/test/unit/spec/kbaseNarrativeSpec.js
index afb2e31468..c901a8932a 100644
--- a/test/unit/spec/kbaseNarrativeSpec.js
+++ b/test/unit/spec/kbaseNarrativeSpec.js
@@ -142,11 +142,13 @@ define ([
 
         it('Should return a boolean for is_loaded', () => {
             const narr = new Narrative();
-            expect(narr.isLoaded()).toEqual(DEFAULT_FULLY_LOADED);  // default as set in
+            // default as set in the mock Jupyter object above
+            expect(narr.isLoaded()).toEqual(DEFAULT_FULLY_LOADED);
         });
 
         it('Should test ui mode', () => {
             const narr = new Narrative();
+            expect(Jupyter.notebook.writable).toBe(DEFAULT_WRITABLE);
             expect(narr.uiModeIs('edit')).toBe(DEFAULT_WRITABLE);
             expect(narr.uiModeIs('view')).toBe(!DEFAULT_WRITABLE);
             Jupyter.notebook.writable = !Jupyter.notebook.writable;

From 76355e40ec2dad035fd5ecf21f6986b138f0e85e Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Fri, 23 Oct 2020 15:22:06 -0700
Subject: [PATCH 12/13] remove unused event listener

---
 kbase-extension/static/kbase/js/kbaseNarrative.js | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 42d9a264b1..3a11a15431 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -317,12 +317,6 @@ define([
                 });
             });
         });
-        $([Jupyter.events]).on(
-            'delete.Cell',
-            function () {
-                // this.enableKeyboardManager();
-            }.bind(this)
-        );
 
         $([Jupyter.events]).on(
             'notebook_save_failed.Notebook',

From a37e97a568e160848d6d145271a95e502fc7d340 Mon Sep 17 00:00:00 2001
From: Bill Riehl <wjriehl@lbl.gov>
Date: Fri, 23 Oct 2020 16:07:15 -0700
Subject: [PATCH 13/13] minor visual cleanup

---
 .../static/kbase/js/kbaseNarrative.js         | 33 +++++++++----------
 1 file changed, 16 insertions(+), 17 deletions(-)

diff --git a/kbase-extension/static/kbase/js/kbaseNarrative.js b/kbase-extension/static/kbase/js/kbaseNarrative.js
index 3a11a15431..48713436bb 100644
--- a/kbase-extension/static/kbase/js/kbaseNarrative.js
+++ b/kbase-extension/static/kbase/js/kbaseNarrative.js
@@ -171,25 +171,24 @@ define([
         return Promise.try(() => {
             if (this.workspaceRef) {
                 return this.workspaceRef;
-            } else {
-                return new Workspace(Config.url('workspace'), {
-                    token: this.getAuthToken(),
-                })
-                    .get_workspace_info({ id: this.workspaceId })
-                    .then((wsInfo) => {
-                        let narrId = wsInfo[8]['narrative'];
-                        this.workspaceRef = this.workspaceId + '/' + narrId;
-                        return this.workspaceRef;
-                    });
             }
+            return new Workspace(Config.url('workspace'), {
+                token: this.getAuthToken(),
+            })
+                .get_workspace_info({ id: this.workspaceId })
+                .then((wsInfo) => {
+                    let narrId = wsInfo[8]['narrative'];
+                    this.workspaceRef = this.workspaceId + '/' + narrId;
+                    return this.workspaceRef;
+                });
         });
     };
 
     Narrative.prototype.getUserPermissions = function () {
-        return new Workspace(Config.url('workspace'), {
+        const ws = new Workspace(Config.url('workspace'), {
             token: this.getAuthToken(),
-        })
-            .get_workspace_info({ id: this.workspaceId })
+        });
+        return ws.get_workspace_info({ id: this.workspaceId })
             .then((wsInfo) => {
                 return wsInfo[5];
             });
@@ -241,15 +240,15 @@ define([
         commonShortcuts.forEach(function (shortcut) {
             try {
                 Jupyter.keyboard_manager.command_shortcuts.remove_shortcut(shortcut);
-            } catch (ex) {
-                console.warn('Error removing shortcut "' + shortcut + '"', ex);
+            } catch (e) {
+                console.warn('Error removing shortcut "' + shortcut + '"', e);
             }
             try {
                 Jupyter.notebook.keyboard_manager.edit_shortcuts.remove_shortcut(
                     shortcut
                 );
-            } catch (ex) {
-                // console.warn('Error removing shortcut ''  + shortcut +'"', ex);
+            } catch (e) {
+                // console.warn('Error removing shortcut "' + shortcut + '"', e);
             }
         });