How do (can) I use a custom.js file under Jupyter notebook?

Question

In the IPython notebook (v3.1, for example), I could add a ~/.ipython/profile_default/static/custom/custom.js file to execute some custom JavaScript. For examp

Answer 1

The app_initialized.NotebookApp event is still fired if you look the notebook static/notebook/js/main.js code.

but you have to listen at this event using the define() function from requireJS:

define([
  'base/js/namespace',
  'base/js/events'
], function(IPython, events) {
   events.on('app_initialized.NotebookApp', function() {
     // Your Code
   });
});

Here your callback will be executed.

If you put in your custom.js :

 require(['base/js/namespace', 'base/js/events'], function(IPython, events) {
     events.on('notebook_loaded.Notebook', function() {
        console.log('require & notebook_loaded.Notebook');
    });
     events.on('app_initialized.NotebookApp', function() {
        console.log('require & app_initialized.NotebookApp');
     });
 });

 define(['base/js/namespace', 'base/js/events'], function(IPython, events) {
     events.on('notebook_loaded.Notebook', function() {
        console.log('define & notebook_loaded.Notebook');
    });
     events.on('app_initialized.NotebookApp', function() {
         console.log('define & app_initialized.NotebookApp');
     });
 });

The result in the console will be :

define() & app_initialized.NotebookApp
define() & notebook_loaded.Notebook
require() & notebook_loaded.Notebook

I guess that with the require() you register to an event that had already happen...

require() is waiting for all dependencies and submodules to be intialized... which might be too late for the app_initialized.NotebookApp event.