I recently updated panel from 0.12.1 to 0.12.6
I am trying to run the example here GoldenLayout — Panel 0.12.6 documentation
by changing the servable() to show()
I don’t see any content
Inspection the HTML elements shows some errors in the log. I am not too familiar with this - any ideas?
I recall this working with 0.12.1
The links to the CSS and JS files in the templates folder are likely out-of-date?
Updating them seems to fix this?
Should I create a bug ticket?
Ok. uninstalled and reinstalled and created my conda env
Still seeing the same thing
Does anyone know what this below css.map file is referring to?
WARNING:tornado.access:404 GET /static/extensions/panel/bundled/css/files/latest/css/goldenlayout-base.css.map (::1) 2.00ms
Could this be caused by mixing conda channels ie 0.12.1 was in main/default channel
while 12.6 was from conda-forge?
I reinstalled the env with packages only from the default channel (main)
panel 0.12.1
bokeh 2.3.3
And this works again. I could try just panel or just bokeh and see which one breaks this for me.
Hi @haditya
The CSS map file is not cause the problem. You are just getting a warning that its missing. Its used when/ if you debug things.
What is a CSS map file?
It is a JSON format file that links the CSS file to its source files, normally, files written in preprocessors (i.e., Less, Sass, Stylus, etc.), this is in order do a live debug to the source files from the web browser.
Ok… I’m starting to suspect I might be running into those mismatched bokeh.js issues - browser is using a cached js file. Is there a way to check what bokeh.js in using in the browser?
I’ve tried uninstalling and reinstalling the browser to no effect. Deleting cache and temporary files in the browser also has no effect.
The only thing I know of is a “hard refresh” of the browser How to hard refresh your browser Chrome, Firefox, Safari (fabricdigital.co.nz)
This is sometimes required when a new version of Panel/ Bokeh is used.
Hard refresh - no impact either…
This is the error in the browser
Blockquote
Uncaught (in promise) Error: Error rendering Bokeh model: could not find #6e5cbbf1-3efb-49e4-b9ce-7a8bc0e0b64f HTML tag
at u (bokeh.min.js?v=None:585)
at n._resolve_root_elements (bokeh.min.js?v=None:585)
at w (bokeh.min.js?v=None:163)
at Object.t.embed_items (bokeh.min.js?v=None:163)
u @ bokeh.min.js?v=None:585
n._resolve_root_elements @ bokeh.min.js?v=None:585
w @ bokeh.min.js?v=None:163
t.embed_items @ bokeh.min.js?v=None:163
function _(o, e, n, t, r) {
t();
const l = o(43)
, d = o(44);
function u(o) {
let e = document.getElementById(o);
if (null == e)
throw new Error(`Error rendering Bokeh model: could not find #${o} HTML tag`);
if (!document.body.contains(e))
throw new Error(`Error rendering Bokeh model: element #${o} must be under <body>`);
if ("SCRIPT" == e.tagName) {
const o = (0,
l.div)({
class: n.BOKEH_ROOT
});
(0,
l.replaceWith)(e, o),
e = o
}
return e
}```
This is the function that seems to be returning a NULL for the some element. I don't know enough about this to be sure.when i use panel serve <filename>.py - I get this
2022-01-07 11:04:46,017 Starting Bokeh server version 2.4.2 (running on Tornado 6.1)
2022-01-07 11:04:46,024 User authentication hooks NOT provided (default user enabled)
2022-01-07 11:04:46,030 Bokeh app running at: http://localhost:5006/try2
2022-01-07 11:04:46,030 Starting Bokeh server with process id: 6460
2022-01-07 11:05:26,825 Starting Bokeh server version 2.4.2 (running on Tornado 6.1)
2022-01-07 11:05:26,827 User authentication hooks NOT provided (default user enabled)
Launching server at http://localhost:49502
2022-01-07 11:05:28,956 WebSocket connection opened
2022-01-07 11:05:28,959 ServerConnection created
2022-01-07 11:05:40,742 WebSocket connection closed: code=1001, reason=None
Ok… Did some more work here…
On a completely different PC that has never run Panel before
OS : Fedora 35
I followed the developer guide to install the dev environment (Instructions here - Getting Set Up — Panel 0.12.6 documentation)
I had to additionally install nodejs and run python setup.py install to build panel.js
Same results
MaterialTemplate displays the two plots correctly, GoldenTemplate does not.
Inspection of the source on browser - shows the same above error.
Hi @haditya
I can see that there is a difference between chrome and firefox. I can replicate your issue with Panel 0.12.6, bokeh 2.4.2 and Chrome or Edge browser. But it works with firefox (right below).
import panel as pn
import numpy as np
import holoviews as hv
pn.extension(sizing_mode = 'stretch_width')
golden = pn.template.GoldenTemplate(title='Golden Template')
xs = np.linspace(0, np.pi)
freq = pn.widgets.FloatSlider(name="Frequency", start=0, end=10, value=2)
phase = pn.widgets.FloatSlider(name="Phase", start=0, end=np.pi)
@pn.depends(freq=freq, phase=phase)
def sine(freq, phase):
return hv.Curve((xs, np.sin(xs*freq+phase))).opts(
responsive=True, min_height=400)
@pn.depends(freq=freq, phase=phase)
def cosine(freq, phase):
return hv.Curve((xs, np.cos(xs*freq+phase))).opts(
responsive=True, min_height=400)
golden.sidebar.append(freq)
golden.sidebar.append(phase)
golden.main.append(
pn.Row(
pn.Card(hv.DynamicMap(sine), title='Sine'),
pn.Card(hv.DynamicMap(cosine), title='Cosine')
)
)
golden.main.append(
pn.Row(
pn.Card(hv.DynamicMap(sine), title='Sine'),
pn.Card(hv.DynamicMap(cosine), title='Cosine')
)
)
golden.servable()
Thank you @Marc for the secondary validation (and potential solution in using firefox!!) So this must be an issue common to all chromium based browsers… I see it fail to load on Vscode notebooks with .servable() too. So something must be common to that too.