Javascript error on import

[chabi-fin]

I'm trying to use nglview in a jupyter notebook within VS Codium, but whenever I try to import nglview, I get a javascript error.

at mI.loadClass (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2385735)
at mI.loadClass (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2685727)
at mI.loadModelClass (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2382806)
at mI._make_model (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2379649)
at mI.new_model (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2377279)
at mI.handle_comm_open (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2376072)
at https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-renderers-1.0.21-universal/out/node_modules/%40vscode/jupyter-ipywidgets8/dist/ipywidgets.js:2:2684952
at t._handleCommOpen (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-2024.10.0-universal/dist/webviews/webview-side/ipywidgetsKernel/ipywidgetsKernel.js:3:119358)
at async t._handleMessage (https://vscode-remote+ssh-002dremote-002bworkspace.vscode-resource.vscode-cdn.net/home/lf1071fu/.vscodium-server/extensions/ms-toolsai.jupyter-2024.10.0-universal/dist/webviews/webview-side/ipywidgetsKernel/ipywidgetsKernel.js:3:121233)

Alternatively, if I use a jupter notebook as a browser window and enter

import nglview
view = nglview.show_pdbid("3pqr")  # load "3pqr" from RCSB PDB and display viewer widget
view

I simply get a blank/white space.

Prehaps this is not on the nglview end, but could you point me in the right direction? I'd really like to use this package in my analysis!

I am using nglview 3.1.2 and ipywidgets 8.1.5

[hainm]

Dear @chabi-fin, I think nglview accidentally not support traditional notebook (e.g: in VS).
You can try to downgrade nglview to 3.0.8 to make it work.
Meanwhile, I am working on the fix.

[hainm]

@chabi-fin Please try latest version, v3.1.4
pip3 install nglview==3.1.4
(conda version will be released later via conda-forge)

[hainm]

[chabi-fin]

@hainm thanks for taking a look into this!

Unfortunately after updating with pip install, I get the same error.

Any ideas? I see our python versions are different, but I think I need at least 3.11 for some packages I'd want in the same environment as nglview.

[hainm]

Hi, I will investigate. Thanks.

[hainm]

Dear @chabi-fin
This is exactly what I did

• create py3.11 env

 mamba create -n py3.11 python=3.11 jupyterlab nbclassic notebook 
source activate py3.11
pip3 install nglview==3.1.4

• open VSCode
• add code
• pick py3.11 env

[hainm]

It's good to uninstall nglview and redo it. Cheers.

[wycman]

Hi, I found the same problem, and successfully solve it by installing the latest version(3.1.4)!