Tabulator not including css in save(''.html") files

Panel
1

Possible bug report and question about inserting custom css to access Tabulator’s features.

Minimal reproducible code:


import pandas as pd

import panel as pn

import panel.widgets as pnw

tab_css = ['.tabulator .tabulator-header .tabulator-col .tabulator-col-content 

                   .tabulator-col-title {white-space: normal;}']

pn.extension('tabulator', comms='vscode', sizing_mode="stretch_both", raw_css=tab_css)

df = pd.DataFrame(data={'long column name #1': [1, 2], 'another long column name': [3,4]})

pnw.Tabulator(df, layout='fit_columns', width=300).save('test.html')

pnw.Tabulator(df, layout='fit_columns', width=300).show()

tab_css is taken from Tabulator docs in order to get the column headers to word wrap when the table is too wide for the display area. The width=300 is to force the column headers to exceed the display width and require word wrap.

Examining the page source of the test.html file shows that it does not include the inserted css, and it never performs word wrap.

Examining the page source of the .show() page reveals the inserted css is present. However, the columns do not sort on the first display, but it sorts on every subsequent display or refresh.

I am most interested in being able to create pure/static .html deliverables that do not require any special software on the client’s computer.

  1. Please update .save() so that it includes the inserted css into the .html file

  2. Please point out any documentation that explains how to access/specify css and/or property features of Tabulate from within the Panels/Holoviews environment.

Thank you