on air not working with ui.charts

[jdess]

Description

Hello,

When trying to launch an application on air (nicegui version 1.3.6, Python 3.10.1) which contains a ui.chart object, the page does not load because the Highcharts javascript files are not available. The expectation is that on-air instances work with Highchart plots as they do with local instances.

Below is a minimal example which fails:

from nicegui import ui

chart = ui.chart({
    'title': False,
    'chart': {'type': 'bar'},
    'xAxis': {'categories': ['A', 'B']},
    'series': [
        {'name': 'Alpha', 'data': [0.1, 0.2]},
        {'name': 'Beta', 'data': [0.3, 0.4]},
    ],
}).classes('w-full h-64')

def update():
    chart.options['series'][0]['data'] = chart.options['series'][0]['data'][::-1]
    chart.update()

ui.button('Update', on_click=update)

ui.run(on_air=True)

The error message of the on-air website in the browser are as follows:

Failed to load resource: the server responded with a status of 500 (Internal Server Error)
/devices/kz51SNxZ/_nicegui/1.3.6/libraries/6fa6d5d3f0b83e88a6a399dccc25b337/highcharts-3d.js:1

Failed to load resource: the server responded with a status of 500 (Internal Server Error)
/devices/kz51SNxZ/_nicegui/1.3.6/libraries/6fa6d5d3f0b83e88a6a399dccc25b337/highcharts.js:1 

Failed to load resource: the server responded with a status of 500 (Internal Server Error)
/devices/kz51SNxZ/_nicegui/1.3.6/libraries/6fa6d5d3f0b83e88a6a399dccc25b337/highcharts-more.js:1

When trying to add additional resources like extras=['exporting'], these files will also not be available.

It seems like the CDN of the on-air instance does not publish the Highcharts javascript files. Somewhat related (but possibly a separate issue) is that files published with app.add_static_file(s) are also not available with on-air instances.

Thank you

[falkoschindler]

That's bad... Thanks for reporting, @jdess!

[falkoschindler]

Strange, I can't reproduce the issue. I tested with the original relay server, a local test instance, with Python 3.11 and 3.10.
Can you, please, check if the problem still persists? Maybe it was a temporary problem on our server?

[jdess]

Hello @falkoschindler,

thank you for the fast reply. I just double-checked the issue and it persists:

The complete libraries folder seems to be missing.

[rodja]

I've already spend the morning on this and have some clue about whats going on. I hope to fix it tomorrow and create a pull request which we could release in 1.3.7.

[jdess]

Hello @falkoschindler and @rodja,

Thank you for working on this issue so quickly. I just tried out the new 1.3.7 release of NiceGUI and, unfortunately, I'm still facing the same issue.

Here is what I did:

1. Set up a new virtual environment with Python 3.11.4-64.
2. Installed NiceGUI version 1.3.7
3. Launched the minimal example from the initial bug report above.
   => This yields a first error message aiohttp package not installed.
   In fact, I already had to install aiohttp for the on-air support the last time (which I had not mentioned in the bug report).
4. pip-installed aiohttp (version 3.8.5) into my virtual environment
5. Re-launched the minimal example

When opening the link to the on-air website, the highcharts files are still not available:

In case it helps, here is the list of installed packages in my virtual environment from pip list:

Package            Version
------------------ ---------
aiofiles           23.1.0
aiohttp            3.8.5
aiosignal          1.3.1
annotated-types    0.5.0
anyio              3.7.1
async-timeout      4.0.2
attrs              23.1.0
bidict             0.22.1
certifi            2023.7.22
charset-normalizer 3.2.0
click              8.1.6
colorama           0.4.6
fastapi            0.101.0
fastapi-socketio   0.0.10
frozenlist         1.4.0
h11                0.14.0
httpcore           0.17.3
httptools          0.6.0
httpx              0.24.1
idna               3.4
itsdangerous       2.1.2
Jinja2             3.1.2
markdown2          2.4.10
MarkupSafe         2.1.3
multidict          6.0.4
nicegui            1.3.7
orjson             3.9.3
pip                23.2.1
pscript            0.7.7
pydantic           2.1.1
pydantic_core      2.4.0
Pygments           2.16.1
python-dotenv      1.0.0
python-engineio    4.5.1
python-multipart   0.0.6
python-socketio    5.8.0
PyYAML             6.0.1
setuptools         65.5.0
sniffio            1.3.0
starlette          0.27.0
typing_extensions  4.7.1
uvicorn            0.22.0
vbuild             0.8.2
watchfiles         0.19.0
websockets         11.0.3
yarl               1.9.2

Please let me know if providing any additional information helps.

[rodja]

Wow! We totally missed the aiohttp dependency. Thanks for bringing this up. Will be fixed in the 1.3.8 release coming later today. We have some other On Air improvements in this release. It would be great if you could try then. I'm not sure why the code is working for me but not for you.

[jdess]

Sounds good, I'll give it a try when the new version becomes available.

[rodja]

1.3.8 has just been released.

[jdess]

Just tested it again with 1.3.8 - still the same issue:

[rodja]

Ok. We will get to the bottom of this 🔬
My browser shows me that it tries to load https://on-air.nicegui.io/devices/3B5QafWV/_nicegui/1.3.8/libraries/ccc962f3aab18d4e9d5ccfda53536f14/highcharts.js. The Composition is like this: <host>/devices/<deviceid>/<version>/libraries/<hashed_path>/<filename>. I suspect your hashed_path is wrong. We compute it like this

nicegui/nicegui/dependencies.py

Lines 90 to 100 in 34db9b7

	def compute_key(path: Path) -> str:
	"""Compute a key for a given path using a hash function.
	If the path is relative to the NiceGUI base directory, the key is computed from the relative path.
	"""
	nicegui_base = Path(__file__).parent
	try:
	path = path.relative_to(nicegui_base)
	except ValueError:
	pass
	return f'{hash_file_path(path.parent)}/{path.name}'

Could you try your test code with a fresh docker container? Something like

docker run --rm -it -v $(pwd):/app/ zauberzeug/nicegui:1.3.8

[jdess]

Hi @rodja,

if I don't misinterpret the listing of available files for the on-air instance (see screenshot above), the complete libraries folder does not get published in my case.

I'll probably only get to testing the docker container later this week and will let you know what I found out when I had time to do so.

[falkoschindler]

We just found a tiny but crucial bug in our hash computation. Commit d9186ab replaces it with an OS-independent solution that should fix this issue for you (and all other Windows users 🤦🏻‍♂️).

[jdess]

Perfect 👍
In that case, I'm going to wait for the next release and will test it then again

[jdess]

Just noticed that release 1.3.9 is already there. I can confirm that the minimal example now works correctly.

Thank you!

[rodja]

What a relief. Thank you so much for being so persistent @jdess ❤️. Your testing unveiled this crucial bug. I admit, it took to long to figure it out. But at least it is now fixed.