Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] DataTable inside Dialog #13787

Closed
smith666 opened this issue Mar 29, 2024 · 1 comment · Fixed by #13828
Closed

[BUG] DataTable inside Dialog #13787

smith666 opened this issue Mar 29, 2024 · 1 comment · Fixed by #13828
Labels
reso: completed tag: component: bokehjs tag: widgets type: bug
Milestone
3.5

Comments

@smith666
Copy link

smith666 commented Mar 29, 2024 •
edited by mattpap

Software versions

Python version : 3.11.8 | packaged by Anaconda, Inc. | (main, Feb 26 2024, 21:34:05) [MSC v.1916 64 bit (AMD64)]
IPython version : 8.20.0
Tornado version : 6.3.3
Bokeh version : 3.4.0
BokehJS static path : C:\Users\mkonkel\AppData\Local\anaconda3\envs\pyt311\Lib\site-packages\bokeh\server\static
node.js version : v20.1.0
npm version : 9.6.4
jupyter_bokeh version : (not installed)
Operating system : Windows-10-10.0.22621-SP0

Browser name and version

Chrome 123.0.6312.86

Jupyter notebook / Jupyter Lab version

No response

Expected behavior

I expect a dialog box with a DataTable inside.

Observed behavior

Dialog box does not appear, error in browser console

Example code

from datetime import date
from random import randint

from bokeh.io import show
from bokeh.layouts import column
from bokeh.models import Button, Column, Dialog, OpenDialog, DataTable, ColumnDataSource, DateFormatter, TableColumn
from bokeh.models.dom import HTML

show_dt = Button(
    label=HTML(f"Show DataTable"),
    sizing_mode="stretch_width",
)
data = dict(
        dates=[date(2014, 3, i+1) for i in range(10)],
        downloads=[randint(0, 100) for i in range(10)],
    )
source = ColumnDataSource(data)

columns = [
        TableColumn(field="dates", title="Date", formatter=DateFormatter()),
        TableColumn(field="downloads", title="Downloads"),
    ]
data_table = DataTable(source=source, columns=columns, width=400, height=280)

dialog = Dialog(
    title=HTML(f"Dialog with dt"),
    content=Column(
        sizing_mode="stretch_both",
        children=[
            data_table
        ],
    ),
)
show_dt.js_on_click(OpenDialog(dialog=dialog))

layout = column([
    show_dt,
#    data_table,
])

show(layout)

Stack traceback or browser console output

bokeh-3.4.0.min.js:185 [bokeh 3.4.0] setting log level to: 'info'
bokeh-3.4.0.min.js:166 [bokeh 3.4.0] document idle at 11 ms
bokeh-tables-3.4.0.min.js:56 [bokeh 3.4.0] jquery-ui is required to enable DataTable.reorderable
_after_render @ bokeh-tables-3.4.0.min.js:56
after_render @ bokeh-3.4.0.min.js:578
r_after_render @ bokeh-3.4.0.min.js:578
r_after_render @ bokeh-3.4.0.min.js:578
render_to @ bokeh-3.4.0.min.js:578
render @ bokeh-3.4.0.min.js:490
_toggle @ bokeh-3.4.0.min.js:490
(anonimowa) @ bokeh-3.4.0.min.js:490
s @ bokeh-3.4.0.min.js:224
emit @ bokeh-3.4.0.min.js:181
emit @ bokeh-3.4.0.min.js:181
_setv @ bokeh-3.4.0.min.js:180
setv @ bokeh-3.4.0.min.js:180
open @ bokeh-3.4.0.min.js:490
execute @ bokeh-3.4.0.min.js:489
await in execute (asynchronicznie)
t.execute @ bokeh-3.4.0.min.js:216
_process_event @ bokeh-3.4.0.min.js:217
trigger @ bokeh-3.4.0.min.js:166
trigger_event @ bokeh-3.4.0.min.js:217
click @ bokeh-widgets-3.4.0.min.js:57
(anonimowa) @ bokeh-widgets-3.4.0.min.js:47
bokeh-3.4.0.min.js:166 [bokeh 3.4.0] document idle at 8162 ms
bokeh-tables-3.4.0.min.js:93 Uncaught (in promise) Error: SlickGrid Cannot find stylesheet.
    at getColumnCssRules (bokeh-tables-3.4.0.min.js:93:41250)
    at applyColumnWidths (bokeh-tables-3.4.0.min.js:93:52454)
    at updateCanvasWidth (bokeh-tables-3.4.0.min.js:93:20576)
    at reRenderColumns (bokeh-tables-3.4.0.min.js:93:51180)
    at legacyAutosizeColumns (bokeh-tables-3.4.0.min.js:93:51076)
    at autosizeColumns (bokeh-tables-3.4.0.min.js:93:46127)
    at resizeCanvas (bokeh-tables-3.4.0.min.js:93:67947)
    at finishInitialization (bokeh-tables-3.4.0.min.js:93:13246)
    at init (bokeh-tables-3.4.0.min.js:93:12751)
    at new SlickGrid (bokeh-tables-3.4.0.min.js:93:103242)
getColumnCssRules @ bokeh-tables-3.4.0.min.js:93
applyColumnWidths @ bokeh-tables-3.4.0.min.js:93
updateCanvasWidth @ bokeh-tables-3.4.0.min.js:93
reRenderColumns @ bokeh-tables-3.4.0.min.js:93
legacyAutosizeColumns @ bokeh-tables-3.4.0.min.js:93
autosizeColumns @ bokeh-tables-3.4.0.min.js:93
resizeCanvas @ bokeh-tables-3.4.0.min.js:93
finishInitialization @ bokeh-tables-3.4.0.min.js:93
init @ bokeh-tables-3.4.0.min.js:93
SlickGrid @ bokeh-tables-3.4.0.min.js:93
_after_render @ bokeh-tables-3.4.0.min.js:56
after_render @ bokeh-3.4.0.min.js:578
r_after_render @ bokeh-3.4.0.min.js:578
r_after_render @ bokeh-3.4.0.min.js:578
render_to @ bokeh-3.4.0.min.js:578
render @ bokeh-3.4.0.min.js:490
_toggle @ bokeh-3.4.0.min.js:490
(anonimowa) @ bokeh-3.4.0.min.js:490
s @ bokeh-3.4.0.min.js:224
emit @ bokeh-3.4.0.min.js:181
emit @ bokeh-3.4.0.min.js:181
_setv @ bokeh-3.4.0.min.js:180
setv @ bokeh-3.4.0.min.js:180
open @ bokeh-3.4.0.min.js:490
execute @ bokeh-3.4.0.min.js:489
await in execute (asynchronicznie)
t.execute @ bokeh-3.4.0.min.js:216
_process_event @ bokeh-3.4.0.min.js:217
trigger @ bokeh-3.4.0.min.js:166
trigger_event @ bokeh-3.4.0.min.js:217
click @ bokeh-widgets-3.4.0.min.js:57
(anonimowa) @ bokeh-widgets-3.4.0.min.js:47

Screenshots

No response
@mattpap mattpap added this to the 3.5 milestone Mar 29, 2024
@mattpap
Copy link
Contributor

mattpap commented Mar 29, 2024

This will probably be resolved by PR #13522.

@mattpap mattpap mentioned this issue May 2, 2024
Merged
5 tasks
mattpap added a commit that referenced this issue May 2, 2024
@mattpap
Add a regression test for issue #13787
be35df7
mattpap added a commit that referenced this issue May 3, 2024
@mattpap
Add a regression test for issue #13787
1e4544a
mattpap added a commit that referenced this issue May 3, 2024
@mattpap
Add support for CSS-based theming on the canvas (#13828)
9aaa141 
* Separate rendering from painting

* rendering is for constructing DOM nodes
* painting is for drawing to the canvas

* Make RendererView inherit from DOMComponentView

* Don't use append(), remove() and replaceWith()

* Move RendererGroup to a separate module

* Introduce StyledElement base class

* Attach renderers' elements to the canvas

* Use CSS variables in canvas visuals

* Add styling/visuals/css_variables.py

* Restore functionality of HTML label annotation

* Update bokehjs' unit tests

* Use stylesheet based styling in HTML labels

* Update cross tests baselines

* Correctly render the Toolbar in ToolbarPanel

* Add CSS support to Text and Hatch visuals

* Style text in css_variables example

* Migrate styling/visuals/css_variables.py to bokehjs

* Allow to specific rendering target for canvas renderers

* Reposition menu after toolbar resize if open

* Correctly update canvas renderers' elements

* Allow to recover from invalid gesture state

* Safeguard against disconnected elements

* Use render_to() to render toolbar's tool buttons

* Add integration tests for HTMLLabel

* Add docstrings to models/ui/ui_element.py

* Remove deprecated APIs from core/dom.ts

* Compute CSS prefix of visual properties once

* Robustify render() and after_render() logic

* Call r_after_render() after updating children

* Use computed_renderer_views to avoid race conditions

* Display duration in devtools' progress bar

* Robustify is_paused and hold_render logic

* Recompute toolbar buttons after layout

* Update integration baseline images

* Robustify ready state in TileRenderer

* Mark _was_build in after_render()

* Correctly render contents in Dialog

* Add a regression test for issue #13787

* Update *.blf baseline files

* Update bokeh's examples

* Add release notes
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
reso: completed tag: component: bokehjs tag: widgets type: bug
Projects
None yet
Milestone
3.5
Development

Successfully merging a pull request may close this issue.

Add support for CSS-based theming on the canvas bokeh/bokeh
2 participants
@mattpap @smith666