Jupyter4Science / scipy2024-jupyter-widgets-tutorial

SciPy2024 Tutorial on "Building Complex Web Applications with Jupyter Notebooks"
Apache License 2.0
5 stars 6 forks source link

Rendering ipywidgets in Quarto #12

Open nicole-brewer opened 1 month ago

nicole-brewer commented 1 month ago

TLDR: I don't think it's possible to use server-side widgets using Jupyter Notebooks and Quarto. It may be possible to render basic widgets in a .qmd document instead, though there is confusion about which Jupyter widgets actually will work.

In the documentation, it appears that this should be possible

"Jupyter Widgets and htmlwidgets ... run entirely client-side so can be deployed within normal static HTML documents.

There are several issues that suggest that this documentation is somewhat misleading.

In https://github.com/quarto-dev/quarto-cli/discussions/6496, some people say that there is confusion because some, but not all of the client-side widgets seem to work. That point aside, the following working example was proposed:

---
format: html
---

```{python}
import ipywidgets as widgets
widgets.IntSlider()


and then calling the command `quarto render example.qmd` and opening the resulting file, `example.html`, *in a browser tab*. 

This work for me as well when I put that code in a *quarto markdown document* (.qmd) only.

<img width="589" alt="Screenshot 2024-06-19 at 7 11 22 PM" src="https://github.com/Jupyter4Science/scipy2024-jupyter-widgets-tutorial/assets/20686935/98afbc20-0ae9-4777-ab23-36e6b8628504">

However, when I try the same example using a *Jupyter Notebook*, the code appears just the same, but the javascript widget doesn't appear.

<img width="358" alt="Screenshot 2024-06-19 at 7 15 46 PM" src="https://github.com/Jupyter4Science/scipy2024-jupyter-widgets-tutorial/assets/20686935/677bade0-000b-4d5b-93d0-101b1bf191a5">
mwcraig commented 3 weeks ago

I think it would be worth adding something about the current state of affairs with Quarto. I know @JuanCab is finding there are issues with voici as well. Providing folks with an accurate state of affairs is useful, even if the state of affairs is that the tool doesn't quite do what it seems it might...