nglviewer/nglview

JavaScript errors with latest nglview/ipywidgets/jupyterlab versions persist?

Closed this issue · 4 comments

sametz commented

I have seen recent issues, e.g. #1060 , that suggest issues with nglview working with the latest ipywidgets/jupyterlab have been fixed (e.g. #1062), but I am still having issues with nglview and JS errors.

In Jupyterlab 4.0.2, in a Jupyter notebook, import nglview as ngl gives a JS error:

[Open Browser Console for more detailed log - Double click to close this message]
Failed to load model class 'ColormakerRegistryModel' from module 'nglview-js-widgets'
loadClass@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/134.402424ef4079078b2e0e.js?v=402424ef4079078b2e0e:1:74855
loadModelClass@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:10729
_make_model@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:7517
new_model@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:5137
handle_comm_open@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:3894
134/v/this._handleCommOpen@http://localhost:8888/lab/extensions/@jupyter-widgets/jupyterlab-manager/static/134.402424ef4079078b2e0e.js?v=402424ef4079078b2e0e:1:73392
_handleCommOpen@http://localhost:8888/static/lab/jlab_core.f68a597bc4700114bad4.js?v=f68a597bc4700114bad4:1:1233316

Using the Firefox web developer tools, I see several "Error: widget model not found" and an "Error: No version of module nglview-js-widgets is registered".

I have successfully run jupyter-nbextension enable nglview --py --sys-prefix.

Trying to use nglview despite this warning raises further, similar errors. For example, ngl.demo() fails to load model class NGLModel.

Versions:
nglview 3.0.6
ipywidgets 8.0.6
jupyterlab 4.0.2

Tested on 2 computers:

  • python 3.8.17 and macOS Monterey
  • Python 3.11.4 and macOS Ventura

When I couldn't solve the errors, I created a new conda environment and reinstalled my necessary libraries, but the errors persist.

hainm commented

Dear @sametz

I don't know for sure what happened to your environment.
But here is exactly what I did on my macos, using Chrome.

conda create -n py311 python=3.11
conda activate py311
pip install nglview==3.0.6
pip install jupyterlab
jupyter-lab
image
hainm commented

I have successfully run jupyter-nbextension enable nglview --py --sys-prefix.

You don't need to do this anymore.

sametz commented

I found the answer, and it was subtle (to me).

I was following recommendations (e.g. this blog) to run jupyter notebook or jupyter lab from the base conda environment only, and then select your custom conda environment from the notebook's environment menu. When done this way, JS errors result.

If jupyterlab is installed in the custom conda environment, and jupyterlab is run from the custom environment, you don't get the errors.

So, if someone is following the "only run Jupyter from the base environment" workflow, nglview won't work for them.

Thanks for your help.

hainm commented

I am glad that you found the solution. cheers.