ipywidgets not showing GUI

Created on 21 Sep 2018  路  22Comments  路  Source: jupyter-widgets/ipywidgets

Hi, I still got the issue after I ran jupyter labextension install @jupyter-widgets/jupyterlab-manager.

Initially, I came across some problems using tqdm_notebook in jupyterlab. After googling the problems, someone say it may be something wrong with ipywidgets. They basically suggest that running jupyter labextension install @jupyter-widgets/jupyterlab-manager. So I did, but it doesn't work either for tqdm_notebook or ipywidgets. The following pic may present my problems.

image

image

image

needs info resolved-locked

Most helpful comment

Hi, I have been through this problem every time I reinstall my virtual ubuntu which is managed by my IT colleagues.

After a few research according to my limited knowledge in this area, I figured out the following command lines that may helps likely, though I don't really understand some of the tools. I don't know if this helps, any guidance to improve these command (such as remove unnecessary lines) are appreciate.

Relative version info:
image

## Initial Updates
cd ~
apt-get update -y && apt-get upgrade -y
pip install --upgrade pip

## Jupyter labextension
apt-get -y install npm nodejs
apt remove cmdtest
apt remove yarn
npm install -g npm yarn
pip install ipywidgets
jupyter nbextension enable --py widgetsnbextension
jupyter labextension install @jupyter-widgets/jupyterlab-manager
jupyter lab build

Remember to refresh your page in the browser.
Wish this helps.

All 22 comments

From your log you posted on https://github.com/jupyterlab/jupyterlab/issues/3925#issuecomment-423419894, it seems that jupyterlab isn't building in the widgets extension. You should see a line that looks something like:

         vendors~@jupyter-widgets/controls.ea199c579095c8f0c80d.js    287 KiB       vendors~@jupyter-widgets/controls  [emitted]  vendors~@jupyter-widgets/controls

So somehow that extension is not getting recognized as being installed. If you do jupyter lab path, it will print out the "application directory" where jupyterlab is being built. Can you see what is in the extensions subdirectory of that directory? For me, I see something like this file: jupyter-widgets-jupyterlab-manager-0.37.4-3e0e75190b1ceea62f898dc83af3dde52336088b.tgz

It looks like, from your screenshot, the app dir is /usr/local/share/jupyter/lab. What is in /usr/local/share/jupyter/lab/extensions?

Your npm version looks very old. I also have node 8.11.2, but npm version 5.6.0. Perhaps upgrading npm might help?

according to https://nodejs.org/en/download/releases/, your npm version (3.5.2) was distributed with node 5 or so.

Hi, I just updated my npm to version 6.4.1. Please see below. Let me know if I miss anything.

image

Does jupyter lab clean followed by jupyter lab build now work, and include the widgets extension?

I ran the following and it is still not working.

jupyter lab clean
jupyter lab build

Partial message shown like this.
image

I am also seeing this problem, though with slightly different versions:

image

@Gabrielvon - the next thing I would do if I were you would be to look for:

(a) javascript browser errors now that it looks like widgets is building in the bundle
(b) in the browser js debugger, search the vendors javascript to see if the widget manager is loaded.

@pakdev - I'd probably do the same for your situation to try to narrow down the issue.

The key here is to find out if the widget javascript is making it to the browser.

If either of you is using conda or pipenv, if you could try making instructions to create a clean environment so I could reproduce the issue, that would also help tremendously.

This should reproduce the issue:

  1. docker pull mikebirdgeneau/jupyterlab
  2. docker run -p 8888:8888 -d docker.io/mikebirdgeneau/jupyterlab:latest
  3. Open localhost:8888 and select terminal
  4. apk add --update nodejs nodejs-npm
  5. jupyter labextension install @jupyter-widgets/jupyterlab-manager
  6. Create a new notebook and execute:
import ipywidgets
out = ipywidgets.Dropdown(options=['1', '2', '3'], value='2', description='Number')
display(out)

I left for holidays and found that the ipywidgets and tqdm works without any operation since last time I report here. Maybe my colleague made some changes on the backend. Thanks anyway.

@jasongrout , refer to your instructions, I cannot see the js browser errors and browser js debugger, since it is a system without any interfaces but only text and command. I enter the ipython notebook environment by clicking certain buttons. In another word, I am assigned a jupyter notebook environment and that is my main entrance for the system. If you want to investigate further, could you tell me what command should I input?

I believe I'm having the same problem. I'm running the latest development version of jupyterlab in Chrome on Ubuntu 18.04.

When I run the following code, instead of the widget appearing, I get a string description of the widget:

from IPython.display import display
from ipywidgets import FloatProgress
f = FloatProgress(min=0, max=100)
display(f)

I looked in the console, and it turns out that upon executing the third line, I get these two errors:

default.ts:927 Exception opening new comm

default.ts:1069 Error: Object 'jupyter.widget' not found in registry
    at Promise (default.ts:1709)
    at new Promise (<anonymous>)
    at Object.loadObject (default.ts:1687)
    at DefaultKernel.<anonymous> (default.ts:917)
    at Generator.next (<anonymous>)
    at default.ts:2
    at new Promise (<anonymous>)
    at q6Rw.__awaiter (default.ts:2)
    at DefaultKernel._handleCommOpen (default.ts:902)
    at DefaultKernel.<anonymous> (default.ts:1122)

I have refreshed my fork with the latest commits from the main repo, and I have run jupyter lab build. I have also run jupyter labextension install @jupyter-widgets/jupyterlab-manager.

@jasongrout I hope this helps diagnose the problem.

I'm also getting this error in Amazon Sagemaker. Here's what the console looks like:

default.js:1432 Uncaught (in promise) Error: Object 'jupyter.widget' not found in registry at default.js:1432 at new Promise (<anonymous>) at Object.C [as loadObject] (default.js:1411) at e._handleCommOpen (default.js:920) at WebSocket._onWSMessage (default.js:136)

I am having a similar Issue too.

lab version = 0.35.4
iPyWidgets = 7.4.0
@jupyter-widgets/jupyterlab-manager v0.38.1 enabled OK

Hi, I have been through this problem every time I reinstall my virtual ubuntu which is managed by my IT colleagues.

After a few research according to my limited knowledge in this area, I figured out the following command lines that may helps likely, though I don't really understand some of the tools. I don't know if this helps, any guidance to improve these command (such as remove unnecessary lines) are appreciate.

Relative version info:
image

## Initial Updates
cd ~
apt-get update -y && apt-get upgrade -y
pip install --upgrade pip

## Jupyter labextension
apt-get -y install npm nodejs
apt remove cmdtest
apt remove yarn
npm install -g npm yarn
pip install ipywidgets
jupyter nbextension enable --py widgetsnbextension
jupyter labextension install @jupyter-widgets/jupyterlab-manager
jupyter lab build

Remember to refresh your page in the browser.
Wish this helps.

@jasongrout's suggestion to run jupyter lab clean before jupyter lab build seems to have solved the issue for me

If either of you is using conda or pipenv, if you could try making instructions to create a clean environment so I could reproduce the issue, that would also help tremendously.

Hi @jasongrout, I have been having a similar issue with ipywidget's interact widget doesn't appear in Jupyterlab even after following the suggestions as well as the official doc.

Please see this screencast of JS console error messages.
The same code correctly shows the widget in jupyter notebook (using the same conda environment), so I think the problem arises from my labextension installabtion.
Here is my current environment status:

base: this is where my jupyterlab is installed:
image

(base) jupyter labextension list
image


I created a new environment to test ipywidget installation:

conda create -n test
conda activate test
#pip install ipywidget which generated this message. Not sure if this is sensible

image

# so I tried below and new libraries were installed
conda install -c conda-forge ipywidgets

conda install -c conda-forge ipykernel #to be able to choose this environment in lab gui

Result:

(test) hayley:~/Playground/ContextNet$ conda list | grep ipywidget
ipywidgets                7.5.1                      py_0    conda-forge


(test) hayley:~/Playground/ContextNet$ conda list | grep wid
ipywidgets                7.5.1                      py_0    conda-forge
wcwidth                   0.1.7                      py_1    conda-forge
widgetsnbextension        3.5.1                    py37_0    conda-forge

Please let me know if you have any suggestions to resolve this. Thank you.


update:
I'm not sure if this is related, but I also get "environment is inconsistent" warning in my base environment:
image

Could you suggest what is a safe way to resolve this inconsistency..?

Thank you!

Looks like you don't have the ipywidgets jupyterlab extension installed: https://ipywidgets.readthedocs.io/en/latest/user_install.html#installing-the-jupyterlab-extension

(You can check this with jupyter labextension list, for example).

Thank you, I should've checked the list carefully. That solved the issue.

I'm still facing this issue. I believe my environment is setup correctly, and I have the right extensions (and extension manager) for jupyterlab installed, but the widget won't load. From viewing the in-browser console I see some JS errors:
hehe

I used the same Dropdown example someone used above, but I originally started digging about for this problem when I tried to use leaflet.

Having a similar issue as discussed at the beginning of this thread. At one point I had it fixed, but in some changes made when playing with virtual environments I lost the fix and can't figure it out again. 'clean' and 'build's and uninstall/re-installs haven't been able to do it for me. Thanks
Screen Shot 2020-05-15 at 3 54 12 PM
Screen Shot 2020-05-15 at 3 51 37 PM
Screen Shot 2020-05-15 at 3 59 36 PM

Was this page helpful?
0 / 5 - 0 ratings