How to establish communication with parent window and jupyterlite instance running in an iframe?

I am making an extension that does the following:

  1. starts with a pyodide kernel
  2. toggles the sidebar at the start
  3. gets message from parent window (jupyterlite instance will be running in an iframe) and adds a new cell given some content

how do I accomplish this?

The simplest approach is adding the following to jupyter-lite.json (example) and re-build:

{
  "jupyter-config-data": {
    "exposeAppInBrowser": true
  }
}

Provided the parent window and child window are able to talk (e.g. same domain, no aggresive sandbox), the child will then have the window.jupyterapp global defined, which can be used to do anything available in the public API.

// from the parent, that created the iframe
await child.contentWindow.jupyterapp.commands.execute('notebook:run-all-cells')

For more involved behavior, a custom lab extension can create its own postMessage API, which allows for better control and security.

3 Likes