search

holoviz / panel

Panel: The powerful data exploration & web app framework for Python
https://panel.holoviz.org
BSD 3-Clause "New" or "Revised" License
4.83k stars 519 forks source link

Panel Tabs: Uncaught (in promise) TypeError: this.grid is undefined #5495

Closed LinuxIsCool closed 4 months ago

LinuxIsCool commented 1 year ago

ALL software version info

bokeh==3.2.2 holoviews==1.17.1 hvplot==0.8.4 panel==1.2.2 param==1.13.0

Python 3.10.12

Description of expected behavior and the observed behavior

Using panel Tabs, certain tabs will randomly not display anything. If I keep clicking between tabs, then they will eventually all show their content. I'm using dynamic=True. My tabs contain hvplot networkx, hvplot bokeh, and tabulators.

Complete, minimal, self-contained example code that reproduces the issue

pn.Tabs(..., dynamic=True)

Stack traceback and/or browser JavaScript console output

_after_layout http://localhost:5006/static/js/bokeh-tables.min.js?v=1e9dbda6b63d0725a710fdd1fbdaf15761b42cfb948bf6ede7c663837fc7189b38451209d5f6efb00dd696dcab96981aa2f57e160852d9eb100a668175734dbc:55
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    after_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    compute_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    invalidate_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    invalidate_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    invalidate_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    invalidate_layout http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    update_children http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:554
    connect_signals http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:567
    i http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:219
    emit http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:180
    emit http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:180
    _setv http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:179
    setv http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:179
    apply_json_patch http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:165
    _handle_patch http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:229
    handle http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:229
    _steady_state_handler http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    _current_handler http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    _on_message http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    onmessage http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    connect http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    connect http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    pull_session http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:226
    d http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:225
    add_document_from_session http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:225
    k http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:163
    embed_items http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:163
    embed_document http://localhost:5006/app:53
    fn http://localhost:5006/app:56
    fn http://localhost:5006/app:72
    safely http://localhost:5006/static/js/bokeh.min.js?v=3ca6425586de5036dc01992dd69aa61e9196dd02619557cfaeb1b3d8b77adf724be49401b1168483d165494ce57a6daa16e6f6d3660fef117d45028221f86357:234
    fn http://localhost:5006/app:48
    EventListener.handleEvent* http://localhost:5006/app:76
    <anonymous> http://localhost:5006/app:77
[bokeh-tables.min.js:55:2761](http://localhost:5006/static/js/bokeh-tables.min.js?v=1e9dbda6b63d0725a710fdd1fbdaf15761b42cfb948bf6ede7c663837fc7189b38451209d5f6efb00dd696dcab96981aa2f57e160852d9eb100a668175734dbc)
LinuxIsCool commented 1 year ago

I noticed this in the python console (panel serve app.py)

2023-09-08 13:50:51,694 Exception in callback functools.partial(<bound method IOLoop._discard_future_result of <tornado.platform.asyncio.AsyncIOMainLoop object at 0x7efe18c10550>>, <Task finished name='Task-1457' coro=<ServerSession.with_document_locked() done, defined at /home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/sessio
n.py:77> exception=RuntimeError("Models must be owned by only a single document, NumeralTickFormatter(id='p1004', ...) is already in a doc")>)
Traceback (most recent call last):
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/tornado/ioloop.py", line 738, in _run_callback
    ret = callback()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/tornado/ioloop.py", line 762, in _discard_future_result
    future.result()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/session.py", line 94, in _needs_document_lock_wrapper
    result = func(self, *args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/session.py", line 226, in with_document_locked
    return func(*args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 485, in wrapper
    return invoke_with_curdoc(doc, invoke)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 443, in invoke_with_curdoc
    return f()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 484, in invoke
    return f(*args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 182, in remove_then_invoke
    return callback()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/panel/layout/base.py", line 115, in _update_model
    with doc.models.freeze():
  File "/usr/lib/python3.10/contextlib.py", line 142, in __exit__
    next(self.gen)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 135, in freeze
    self._pop_freeze()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 288, in _pop_freeze
    self.recompute()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 235, in recompute
    ma._attach_document(document)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/model/model.py", line 575, in _attach_document
    raise RuntimeError(f"Models must be owned by only a single document, {self!r} is already in a doc")
RuntimeError: Models must be owned by only a single document, NumeralTickFormatter(id='p1004', ...) is already in a doc
2023-09-08 13:50:51,704 Exception in callback functools.partial(<bound method IOLoop._discard_future_result of <tornado.platform.asyncio.AsyncIOMainLoop object at 0x7efe18c10550>>, <Task finished name='Task-1458' coro=<ServerSession.with_document_locked() done, defined at /home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/sessio
n.py:77> exception=RuntimeError("Models must be owned by only a single document, NumeralTickFormatter(id='p1004', ...) is already in a doc")>)
Traceback (most recent call last):
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/tornado/ioloop.py", line 738, in _run_callback
    ret = callback()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/tornado/ioloop.py", line 762, in _discard_future_result
    future.result()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/session.py", line 94, in _needs_document_lock_wrapper
    result = func(self, *args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/session.py", line 226, in with_document_locked
    return func(*args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 485, in wrapper
    return invoke_with_curdoc(doc, invoke)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 443, in invoke_with_curdoc
    return f()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 484, in invoke
    return f(*args, **kwargs)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/callbacks.py", line 182, in remove_then_invoke
    return callback()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/panel/layout/base.py", line 115, in _update_model
    with doc.models.freeze():
  File "/usr/lib/python3.10/contextlib.py", line 142, in __exit__
    next(self.gen)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 135, in freeze
    self._pop_freeze()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 288, in _pop_freeze
    self.recompute()
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/document/models.py", line 235, in recompute
    ma._attach_document(document)
  File "/home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/model/model.py", line 575, in _attach_document
    raise RuntimeError(f"Models must be owned by only a single document, {self!r} is already in a doc")
RuntimeError: Models must be owned by only a single document, NumeralTickFormatter(id='p1004', ...) is already in a doc
2023-09-08 13:50:52,551 Exception in callback functools.partial(<bound method IOLoop._discard_future_result of <tornado.platform.asyncio.AsyncIOMainLoop object at 0x7efe18c10550>>, <Task finished name='Task-1485' coro=<ServerSession.with_document_locked() done, defined at /home/ygg/.cache/pypoetry/virtualenvs/alloha-qEy3MGg--py3.10/lib/python3.10/site-packages/bokeh/server/sessi...
ahuang11 commented 1 year ago

My uneducated guess would be that it's a race condition; before Python finishes processing the data and sending it back to the frontend, the user already clicked a new tab, so this data has no where to go but crash.

I wonder if you can add a disabled=True to tabs while something is dynamically loading to prevent the user from changing the active tab too quickly?

philippjfr commented 4 months ago

This is not a Panel issue. If you are using Bokeh models directly you must make sure they are always re-created for each user/session.