Ipyvuetify widgets using vuetify2 have completely broken in terms of appearence

[ramayyala]

Hi,
So I think this issue just arose like this past week cause I was using version 1.10.0 last week everything was working fine. Now the widgets don't seem to be appearing as normal. Rather, they render relatively incomplete. I upgrade the package to version 1.11.0 and that still didnt fix the issue. So i took a look at the browser console and found this:

I'm no expert in this but my guess is something happened to the vuetify2 api? Also this is happening on y'alls documentation page as well if you take a look below at the screenshot:

For now upgrading to the 3.0 version which I understand is in alpha has fixed the rendering issue, but it's not super ideal because I have to go in and change all of the on event inputs to what vuetify3 uses. If y'all have a quick fix available, please let me know and if you need any other logs or anything, happy to provide.

[ramayyala]

Sorry i forgot to include a screenshot of what I am seeing on my own personal instance. Here is what shows up on my web app now when using version 1.11.0:

As you can see, the widgets themselves are not appearing the way they are supposed to.

[iisakkirotko]

Hey @ramayyala! Thanks a lot for bringing this to our attention.

For clarity, when you say

So I think this issue just arose like this past week cause I was using version 1.10.0 last week everything was working fine

and

I upgrade the package to version 1.11.0 and that still didnt fix the issue.

Do you mean that this issue also occurs with ipyvuetify==1.10.0?

Looking at your first screenshot, it looks like it says that an error occurred when fetching unpkg.com/jupyter-vuetify@%5E1.8.5/dist/index.js, although I can't make that part out perfectly. Could you confirm that the error indeed says that, and double-check the version of ipyvuetify you have in your environment?

[mariobuikhuizen]

Hi @ramayyala, I can't reproduce this issue. Can you provide a minimal environment where this happens?

I tried it in a fresh environment with pip install jupyterlab ipyvuetify

[mariobuikhuizen]

For our docs, readthedocs.io doesn't seem to serve files with right MIME type anymore:

[ramayyala]

Hey @ramayyala! Thanks a lot for bringing this to our attention.

For clarity, when you say

So I think this issue just arose like this past week cause I was using version 1.10.0 last week everything was working fine

and

I upgrade the package to version 1.11.0 and that still didnt fix the issue.

Do you mean that this issue also occurs with ipyvuetify==1.10.0?

Looking at your first screenshot, it looks like it says that an error occurred when fetching unpkg.com/jupyter-vuetify@%5E1.8.5/dist/index.js, although I can't make that part out perfectly. Could you confirm that the error indeed says that, and double-check the version of ipyvuetify you have in your environment?

Hi @iisakkirotko
Sorry about the vagueness. So to clarify, this issue was occurring for me in both ipyvuetify==1.10.0 and ipyvuetify==1.11.0. When I was checking out some stuff yesterday, the package was at ipyvuetify==1.10.0, and thats when i started noticing the issues described above. So i thought maybe I just need to update the package, so I updated to ipyvuetify==1.11.0 and still saw the same issue. The console logs from the browser i attached earlier were the same for both versions. So to summarize, currently I have ipyvuetify==1.11.0 in my env, but I updated to 3.0.0a2 to get the widgets functioning again.

In terms of the error you see in the screenshot, I apologize for the blurriness of the screenshot. Here is the full console log:
/static/extensions/ipywidgets_bokeh/ ipywidgets_bokeh.js:8:1473506
strict mode: use allowUnionTypes to allow union type keyword at "#/properties/state/additionalProperties/properties/buffers/items/properties/path/items" (strictTypes) ipywidgets_bokeh.js:2:749225
[bokeh 3.4.1] setting log level to: 'info' bokeh.min.js:185:1338
[bokeh 3.4.1] Websocket connection 0 is now open bokeh.min.js:234:3385
Starting WebSocket: api/kernels/0 ipywidgets_bokeh.js:2:612055
Loading jupyter-vuetify@^1.8.5 from https://unpkg.com ipywidgets_bokeh.js:8:1832851
Loading jupyter-vue@^1.11.0 from https://unpkg.com ipywidgets_bokeh.js:8:1832851
Loading jupyter-vuetify@^1.8.5 from https://unpkg.com 42 ipywidgets_bokeh.js:8:1832851
Bokeh items were rendered successfully bokeh.min.js:164:889
Loading jupyter-vuetify@^1.8.5 from https://unpkg.com 2 ipywidgets_bokeh.js:8:1832851
[Vuetify] v-ripple can only be used on block-level elements 3 index.js:2:621526
[bokeh 3.4.1] document idle at 6665 ms bokeh.min.js:166:1469
Source map error: Error: NetworkError when attempting to fetch resource.
Resource URL: https://unpkg.com/jupyter-vuetify@%5E1.8.5/dist/index.js
Source Map URL: index.js.map

[ramayyala]

Hi @ramayyala, I can't reproduce this issue. Can you provide a minimal environment where this happens?

I tried it in a fresh environment with pip install jupyterlab ipyvuetify

Hi @mariobuikhuizen,
So in terms of my environment, I am running a conda environment to run a panel web app using the ipyvuetify package as the widgets. The panel web app is currently being served locally just for dev purposes but this error is occuring on all of our hosted instances as well on dev and prod.

Here are the version numbers;
conda==24.3.0
python==3.10.0
panel==1.6.1
ipyvue=-1.11.2
ipyvuetify==1.11.0
ipywidgets==8.1.5
ipywidgets-bokeh==1.6.0
jupyterlab=4.3.5
Please let me know if you need any other information.

[iisakkirotko]

Could you verify that the issue still occurs with version 1.11.0 now? 1.11.0 wasn't released on conda until yesterday afternoon (~4 PM CET). We'll also give reproducing this another shot using the packages you have in your environment.

[ramayyala]

Could you verify that the issue still occurs with version 1.11.0 now? 1.11.0 wasn't released on conda until yesterday afternoon (~4 PM CET). We'll also give reproducing this another shot using the packages you have in your environment.

Sorry for confusion, so I run all of this in a conda env, but I am installing ipyvuetify via pip which is why I was able to install version 1.11.0 before it was available on conda. But yes, this seems to fix the issue completely. Thank you so much for the help!

[mariobuikhuizen]

There was an issue in the ipyvuetify release on CDN. It should now work again without needing to change anything.

[arie-havasov]

There was an issue in the ipyvuetify release on CDN. It should now work again without needing to change anything.

Is it possible to include the dependency locally so we don't depend on the CDN?