Failed to load model class 'VegaFusionModel' from module 'vegafusion-jupyter'

[wybert]

example from the VegaFusion, Quickstart 3: Accelerate interactive charts failed, my code is like,

import pandas as pd
import altair as alt
import vegafusion as vf

vf.enable_widget()

flights = pd.read_parquet(
    "https://vegafusion-datasets.s3.amazonaws.com/vega/flights_1m.parquet"
)

brush = alt.selection(type='interval', encodings=['x'])

# Define the base chart, with the common parts of the
# background and highlights
base = alt.Chart().mark_bar().encode(
    x=alt.X(alt.repeat('column'), type='quantitative', bin=alt.Bin(maxbins=20)),
    y='count()'
).properties(
    width=160,
    height=130
)

# gray background with selection
background = base.encode(
    color=alt.value('#ddd')
).add_selection(brush)

# blue highlights on the selected data
highlight = base.transform_filter(brush)

# layer the two charts & repeat
chart = alt.layer(
    background,
    highlight,
    data=flights
).transform_calculate(
    "time",
    "hours(datum.date)"
).repeat(column=["distance", "delay", "time"])
chart

I use it in Jupyter-lab and Vscode, but both are not showing the charts, see the error in Jupyter-lab,

and the log of my browser,

Uncaught DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.
at g.blit_webgl (:678:2808)
at _._paint_levels (:796:15897)
at _._actual_paint (:796:15203)
at _.paint (:796:14159)
at _._after_layout (:796:13996)
at _.after_layout (:761:6166)
at c.after_layout (:761:6146)
at c.compute_layout (:761:5546)
at c._after_resize (:761:738)
at c.after_resize (:644:2553)
2150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1 Failed to fetch ipywidgets through the "jupyter.widget.control" comm channel, fallback to fetching individual model state. Reason: Control comm was closed too early
_loadFromKernel @ 150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1
3VM392:678 Uncaught DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.
at g.blit_webgl (:678:2808)
at _._paint_levels (:796:15897)
at _._actual_paint (:796:15203)
at _.paint (:796:14159)
at _._after_layout (:796:13996)
at _.after_layout (:761:6166)
at c.after_layout (:761:6146)
at c.compute_layout (:761:5546)
at c._after_resize (:761:738)
at c.after_resize (:644:2553)
general.js:102 [LaunchDarkly] Error on stream connection: {"isTrusted":true}, will continue retrying after 588 milliseconds.
(anonymous) @ general.js:102
clientstream.launchdarkly.com/eval/62913038bb88120c8d0102a7/eyJrZXkiOiJjZDU4NjEyZS1mMDFhLTQ0NzYtOTVjMi0wNjFiNmUwZTQ5OWMiLCJjdXN0b20iOnsiZGlhbHVwSGFzaCI6LTg5NCwiZW1haWxzIjpbIlhpYW9rYW5nIEZ1IiwiYW5vbnltb3VzIl0sImluaXRpYWxJbnN0YWxsRGF0ZSI6MTY3NDU5NjI2Njk3MH19:1 Failed to load resource: net::ERR_NETWORK_CHANGED
index.es6.js:391 TypeError: Cannot set properties of undefined (setting 'text')
at f._setValue (jsoneditor.js:265:25)
at set source [as source] (jsoneditor.js:84:14)
at s._update (notebooktools.js:467:25)
at s.onActiveCellChanged (notebooktools.js:457:18)
at s.processMessage (notebooktools.js:211:26)
at b (index.es6.js:444:21)
at Object.t [as sendMessage] (index.es6.js:180:13)
at notebooktools.js:140:13
at c (index.es6.js:1563:13)
at L._onActiveCellChanged (notebooktools.js:139:9)
m @ index.es6.js:391
translate.js:1091 Uncaught (in promise) Error: getTranslators: detection is already running
at Zotero.Translate.Web. (translate.js:1091:45)
at Zotero.Translate.Web.getTranslators (promise.js:36:17)
at Object.init (inject.js:106:25)
2150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1 Failed to fetch ipywidgets through the "jupyter.widget.control" comm channel, fallback to fetching individual model state. Reason: Control comm was closed too early
_loadFromKernel @ 150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1
3150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1 Error: No version of module vegafusion-jupyter is registered
at f.loadClass (134.402424ef4079078b2e0e.js?v=402424ef4079078b2e0e:1:74855)
at f.loadModelClass (150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:10729)
at f._make_model (150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:7517)
at f.new_model (150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:5137)
at f.handle_comm_open (150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1:3894)
at _handleCommOpen (134.402424ef4079078b2e0e.js?v=402424ef4079078b2e0e:1:73392)
at b._handleCommOpen (default.js:1095:19)
at async b._handleMessage (default.js:1262:43)
loadModelClass @ 150.1a6d6a3a0542a41bec5a.js?v=1a6d6a3a0542a41bec5a:1
general.js:102 [LaunchDarkly] Error on stream connection: {"isTrusted":true}, will continue retrying after 806 milliseconds.
(anonymous) @ general.js:102
clientstream.launchdarkly.com/eval/62913038bb88120c8d0102a7/eyJrZXkiOiJjZDU4NjEyZS1mMDFhLTQ0NzYtOTVjMi0wNjFiNmUwZTQ5OWMiLCJjdXN0b20iOnsiZGlhbHVwSGFzaCI6LTg5NCwiZW1haWxzIjpbIlhpYW9rYW5nIEZ1IiwiYW5vbnltb3VzIl0sImluaXRpYWxJbnN0YWxsRGF0ZSI6MTY3NDU5NjI2Njk3MH19:1 Failed to load resource: net::ERR_NETWORK_CHANGED
DevTools failed to load source map: Could not load content for chrome-extension://nllcnknpjnininklegdoijpljgdjkijc/bundles/content.js.map: System error: net::ERR_BLOCKED_BY_CLIENT
DevTools failed to load source map: Could not load content for chrome-extension://lggdbpblkekjjbobadliahffoaobaknh/content.7cf7f7cf.js.map: System error: net::ERR_BLOCKED_BY_CLIENT
DevTools failed to load source map: Could not load content for chrome-extension://nllcnknpjnininklegdoijpljgdjkijc/bundles/writingMonitor.js.map: System error: net::ERR_BLOCKED_BY_CLIENT
3Untitled.ipynb:1 Uncaught (in promise) DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.
at g.blit_webgl (:678:2808)
at _._paint_levels (:796:15897)
at _._actual_paint (:796:15203)
at _.paint (:796:14159)
at _.repaint (:796:14055)
at :796:3376
at a (:797:193)
Promise.then (async)
i @ VM392:433
emit @ VM392:394
trigger @ VM392:679
_key_down @ VM392:679
handleEvent @ VM392:679
general.js:102 [LaunchDarkly] Error on stream connection: {"isTrusted":true}, will continue retrying after 901 milliseconds.
(anonymous) @ general.js:102
u @ general.js:102
l. @ general.js:102
E @ general.js:102
clientstream.launchdarkly.com/eval/62913038bb88120c8d0102a7/eyJrZXkiOiJjZDU4NjEyZS1mMDFhLTQ0NzYtOTVjMi0wNjFiNmUwZTQ5OWMiLCJjdXN0b20iOnsiZGlhbHVwSGFzaCI6LTg5NCwiZW1haWxzIjpbIlhpYW9rYW5nIEZ1IiwiYW5vbnltb3VzIl0sImluaXRpYWxJbnN0YWxsRGF0ZSI6MTY3NDU5NjI2Njk3MH19:1 Failed to load resource: net::ERR_NETWORK_CHANGED

[jonmmease]

Thanks for the report. I'm not able to reproduce and I'm not sure what's going on here unfortunately. What is the result of running the following from the command line?

 jupyter labextension list

[wybert]

➤ jupyter labextension list (base)
Config option kernel_spec_manager_class not recognized by ListLabExtensionsApp.
[W 2023-05-23 21:09:17.432 LabApp] Config option kernel_spec_manager_class not recognized by LabApp.
JupyterLab v3.5.1
/opt/homebrew/Caskroom/mambaforge/base/share/jupyter/labextensions
jupyterlab-jupytext v1.3.8+dev enabled OK (python, jupytext)
jupyter-cytoscape v1.3.3 enabled OK
keplergl-jupyter v0.3.2 enabled OK
jupyter-vuetify v1.8.2 enabled OK
jupyterlab_pygments v0.2.2 enabled OK (python, jupyterlab_pygments)
bqplot v0.5.40 enabled OK (python, bqplot)
jupyter-vue v1.7.0 enabled OK
nbdime-jupyterlab v2.1.1 enabled OK
jupyter-matplotlib v0.11.3 enabled OK
jupyterlab-datawidgets v7.1.2 enabled OK
jupyter-leaflet v0.17.2 enabled OK
jupyter-threejs v2.4.1 enabled OK (python, pythreejs)
jupyter-webrtc v0.6.0 enabled OK
ipyvolume v0.6.0-alpha.8 enabled OK
jupyterlab-plotly v5.9.0 enabled OK
@pyviz/jupyterlab_pyviz v2.2.0 enabled OK (python, pyviz_comms)
@voila-dashboards/jupyterlab-preview v2.2.0 enabled OK (python, voila)
@jupyterlab/server-proxy v3.2.1 enabled OK
@jupyter-widgets/jupyterlab-manager v5.0.7 enabled OK (python, jupyterlab_widgets)

Other labextensions (built into JupyterLab)
app dir: /opt/homebrew/Caskroom/mambaforge/base/share/jupyter/lab
@databeanstalk/jupyterlab-theme-solarized-dark v2.0.3 enabled OK
jupyterlab-dash v0.4.0 enabled OK

[jonmmease]

Thanks. It looks like something may be corrupt in the installation of the vegafusion-jupyter Python package. I would expect to see an entry in jupyter labextension list like this:

% jupyter labextension list
JupyterLab v3.5.1
/path/to/miniconda3/envs/try_vegafusion_1.2.4/share/jupyter/labextensions
        vegafusion-jupyter v1.2.4 enabled OK (python, vegafusion-jupyter)

Did you install the package with pip or conda? If pip, you can force reinstall with

pip install --force-reinstall "vegafusion-jupyter"

If conda, you can try uninstalling and reinstalling the vegafusion-jupyter package.