Vertical and Horizontal Scrollbars missing from DataTable with border

[ugotscott]

The behavior changed somewhere between textual==0.85.2 and textual==1.0.0.

textual==0.85.2 looks like:

textual==1.0.0 looks like:

The code to reproduce is:

from textual.app import App, ComposeResult
from textual.widgets import Collapsible, DataTable, Label


class MyApp(App):
    def compose(self) -> ComposeResult:
        yield Collapsible(DataTable(id="t1"), id="c1")
        yield Collapsible(Label("hello"), id="c2")

    def on_mount(self) -> None:
        self.query_one("#c1", Collapsible).styles.max_height = "50%"
        self.query_one("#c2", Collapsible).styles.max_height = "50%"

        t1 = self.query_one("#t1", DataTable)
        t1.styles.border = "heavy", "black"
        t1.add_column("A")
        for number in range(1, 100):
            t1.add_row(" " * 200 + str(number))


if __name__ == "__main__":
    app = MyApp()
    app.run()

[github-actions]

We found the following entries in the FAQ which you may find helpful:

• Why doesn't the DataTable scroll programmatically?
• How do I center a widget in a screen?
• How do I fix WorkerDeclarationError?

Feel free to close this issue if you found an answer in the FAQ. Otherwise, please give us a little time to review.

This is an automated reply, generated by FAQtory

[TomJGooding]

It looks like 8b2f056 is the bad commit. The PR mentions removing a workaround that was thought no longer needed, but perhaps this should be reverted?

[willmcgugan]

The issue is that both collapsible and datatable have height auto, which makes it unclear what height should be rendered. The datatable has max-height: 100%, which results in 100% of 0. If you set the tables max height to 100vh, it should work as before.

Given that it's an easy trap to fall into, and the fix isn't obvious, I think that special case may have to be restored. Although not exactly the same, as that caused other issues.

[ugotscott]

Thanks for the look. I can use vh units to get what I want and upgrade to v1.0.0.
In the example above when I set the table max-height to anything above 37vh, the horizontal scroll bar was hidden/missing.

[github-actions]

Don't forget to star the repository!

Follow @textualizeio for Textual updates.