push_notebook doesn't update in VSCode .ipynb

[amarcuvitz]

I am not able to get the various push_notebook examples to update when run as .ipynb files from VSCode. They work fine when run from a Jupyter notebook. Below is a simple standard example that runs in a Jupyter notebook but not in VSCode. I need to do Bokeh animation from within a VSCode development environment.

Isn’t this supposed to work as a cell in an .ipynb file executed in VSCode?

from bokeh.plotting import figure, show, output_notebook
from bokeh.models import ColumnDataSource
from bokeh.layouts import layout
from bokeh.io import push_notebook
import numpy as np
from time import sleep

# Output to Jupyter Notebook
output_notebook()

# Prepare some data
x = np.linspace(0, 4*np.pi, 100)
y = np.sin(x)
source = ColumnDataSource(data=dict(x=x, y=y))

# Create a new plot with a title and axis labels
p = figure(title="simple line example", x_axis_label='x', y_axis_label='y')

# Add a line renderer with legend and line thickness
p.line('x', 'y', source=source, legend_label="Temp.", line_width=2)

# Show the results
handle = show(p, notebook_handle=True)

# Update the plot
def update_plot(n_steps, sleep_time):
    for i in range(n_steps):
        y = np.sin(x + i/10.0)
        source.data = dict(x=x, y=y)
        push_notebook(handle=handle)
        sleep(sleep_time)

update_plot(100, 0.1)

[bryevdv]

@amarcuvitz please state all relevant package versions

[amarcuvitz]

jupyter 1.0.0
jupyter-bokeh 3.0.7
python 3.9.18 (conda)
VSCode 1.87.0
bokeh 3.3.4

Does this cover it?

[mattpap]

I can confirm that comms don't work at all in VSCode with bokeh 3.4.0rc1 and jupyter_bokeh 4.0.

[amarcuvitz]

Much thanks ... particularly from my head which I can stop banging against a wall.

I am trying to be able to update a Jupyter cell dynamically (animation and such) while keeping the development of the notebook/code in a VSCode normal workflow (i.e. without launching browsers or restarting servers). This must be a common desire so I have to conclude I am not approaching it in the right way. Can you give me a hint as to the best way to go about this?

[bryevdv]

This must be a common desire so I have to conclude I am not approaching it in the right way.

Just to be completely up front, yours is the first VSCode related question I can recall in the last... two? years. Many Bokeh users use Bokeh in Jupyter notebooks. IMO very few of them are using "VSCode notebooks", specifically.

Can you give me a hint as to the best way to go about this?

In the short term? Use actual, authentic Jupyter-published software (i.e. Jupyter Notebook or JupyterLab) is all i can suggest.

---

I can confirm that comms don't work at all in VSCode with bokeh 3.4.0rc1 and jupyter_bokeh 4.0.

@mattpap Are there any errors reported? Is kernel.registerCommTarget just failing from the start?

cc @philippjfr @jbednar for visibility

[philippjfr]

The best you'll be able to do in VSCode is using the jupyter_bokeh.widgets.BokehModel. This will wrap your bokeh component in an ipywidget which will allow bi-directional communication to work. This also means that you won't need push_notebook at all.

[philippjfr]

There is simply no way to access the regular Jupyter comms from inside a VSCode notebook so piggybacking on the ipywidgets comm layer is the only thing that can be supported.

[bryevdv]

There is simply no way to access the regular Jupyter comms from inside a VSCode notebook so piggybacking on the ipywidgets comm layer is the only thing that can be supported.

Right, and now IIRC even that is only possible at all because Microsoft has decided to make an exception specifically for ipywidgets, to allow that one project to function, correct?

[amarcuvitz]

@mattpap Are there any errors reported? Is kernel.registerCommTarget just failing from the start?

No errors reported when example code is run as .ipynb from VSCode.

Thanks everyone for your suggestions. I can see I'm trying to do something that others are not.

[jbednar]

For what it's worth, lots of people are trying to use HoloViz tools (which build on Bokeh) in VSCode notebooks. That's why we pushed for jupyter_bokeh support. But most of them aren't using Bokeh directly, just Panel or hvPlot.

[bryevdv]

@philippjfr Can we just take a hard dependency on ipywidgets use it for comms in all cases? Not sure about anyone else but at this point I would be totally fine with that (anything that reduces support/maintenance burden)

[philippjfr]

A hard dependency in Bokeh itself? I would be okay with saying that we deprecate push_notebook and direct people exclusively to the jupyter_bokeh package and the BokehWidget wrapper but that does imply that we would have to get timely releases out whenever JupyterLab or ipywidgets break things.

[bryevdv]

@philippjfr no, I meant of jupyter_bokeh. I did not realize that was already the case. So then I'd amend my question: what is the reason we cannot use ipywidget comms internally automatically, and avoid users having to use or know about BokehWidget? (BokehModel ?)

I would be okay with saying that we deprecate push_notebook

Separately, tangentially, I do also think it is a good time to start having this discussion, even if it is only for "4.0" and even if that is some time away.

Edit: Alternatively, we could migrate push_notebook from Bokeh and into jupyter_bokeh and make it work everywhere (I assume) using ipywidget comms here, instead. Mostly, I would just like to excise all comms-related code from Bokeh and put it here.

[philippjfr]

So then I'd amend my question: what is the reason we cannot use ipywidget comms internally automatically, and avoid users having to use or know about BokehWidget? (BokehModel ?)

Good question, and I don't think there is a good reason apart from the fact that it was a little unclear how robust this approach was. In Panel we have long been dropping all VSCode and Google Colab users into this mode since it's really the only thing that will work in those environments and apart from the usual issues with ipywidgets it seems to work pretty well.

Alternatively, we could migrate push_notebook from Bokeh and into jupyter_bokeh and make it work everywhere

push_notebook isn't really needed when combined with ipywidget since bi-directional syncing just happens transparently.

[bryevdv]

OK if "ipywidgets comms mode" seems like it's working reasonably well at this point, I guess I'd gently encourage looking into whether the UX can become more transparent by using it all the time automatically. (Of course I'm not someone who will be working on anything notebook-related, so take that for what it's worth)

push_notebook isn't really needed when combined with ipywidget since bi-directional syncing just happens transparently.

👍 That's fine too, like I said my only real ultimate goal here is to be able to rip all the comms code out of core Bokeh.

[Happily-Coding]

While it'd be nice for it to work by default. It is possible to work around it using jupyter_bokeh as described by @bryevcv . Please check this stack overflow questions if you stumble upon the issue and need a solution right now:
https://stackoverflow.com/questions/77841047/how-to-update-a-bokeh-plot-inside-vscode-jupyter-notebook/78556116#78556116
https://stackoverflow.com/questions/73260026/bokeh-interactive-slider-in-vscode/78556052#78556052

[amarcuvitz]

While it'd be nice for it to work by default. It is possible to work around it using jupyter_bokeh as described by @bryevcv . Please check this stack overflow questions if you stumble upon the issue and need a solution right now: https://stackoverflow.com/questions/77841047/how-to-update-a-bokeh-plot-inside-vscode-jupyter-notebook/78556116#78556116 https://stackoverflow.com/questions/73260026/bokeh-interactive-slider-in-vscode/78556052#78556052

This works! Thanks, I had given up. 😊

[samimia-swks]

I tried the stackoverflow solution and hit this issue: #209