From 40cc2db3b908d1be36ee83bccca2d7156ee3b5bb Mon Sep 17 00:00:00 2001 From: darrenburns Date: Mon, 10 Apr 2023 16:13:48 +0100 Subject: [PATCH] Fix for viewport units, remove DataTable max-height (#2247) * Add viewport units snapshot test * Fix snapshot app * Update snapshots * Update DataTable max-height to 100% * Update CHANGELOG.md * Remove max height from DataTable CSS --- CHANGELOG.md | 7 + src/textual/_resolve.py | 8 +- src/textual/layouts/horizontal.py | 3 +- src/textual/layouts/vertical.py | 3 +- src/textual/widgets/_data_table.py | 1 - .../__snapshots__/test_snapshots.ambr | 156 ++++++++++++++++++ .../snapshot_apps/viewport_units.py | 14 ++ tests/snapshot_tests/test_snapshots.py | 5 + 8 files changed, 188 insertions(+), 9 deletions(-) create mode 100644 tests/snapshot_tests/snapshot_apps/viewport_units.py diff --git a/CHANGELOG.md b/CHANGELOG.md index 705778a17..338e7324b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/). +## Unreleased + +### Fixed + +- Fix viewport units using wrong viewport size https://github.com/Textualize/textual/pull/2247 + + ## [0.19.0] - 2023-04-07 ### Added diff --git a/src/textual/_resolve.py b/src/textual/_resolve.py index cfc4445e1..aba0a1769 100644 --- a/src/textual/_resolve.py +++ b/src/textual/_resolve.py @@ -82,7 +82,7 @@ def resolve_box_models( dimensions: list[Scalar | None], widgets: list[Widget], size: Size, - parent_size: Size, + viewport_size: Size, margin: Size, dimension: Literal["width", "height"] = "width", ) -> list[BoxModel]: @@ -92,7 +92,7 @@ def resolve_box_models( dimensions: A list of Scalars or Nones for each dimension. widgets: Widgets in resolve. size: Size of container. - parent_size: Size of parent. + viewport_size: Viewport size. margin: Total space occupied by margin dimensions: Which dimension to resolve. @@ -111,7 +111,7 @@ def resolve_box_models( None if dimension is not None and dimension.is_fraction else widget._get_box_model( - size, parent_size, fraction_width, fraction_height + size, viewport_size, fraction_width, fraction_height ) ) for (dimension, widget) in zip(dimensions, widgets) @@ -148,7 +148,7 @@ def resolve_box_models( box_model or widget._get_box_model( size, - parent_size, + viewport_size, width_fraction, height_fraction, ) diff --git a/src/textual/layouts/horizontal.py b/src/textual/layouts/horizontal.py index e6f214d82..4455ea20c 100644 --- a/src/textual/layouts/horizontal.py +++ b/src/textual/layouts/horizontal.py @@ -25,7 +25,6 @@ class HorizontalLayout(Layout): placements: list[WidgetPlacement] = [] add_placement = placements.append x = max_height = Fraction(0) - parent_size = parent.outer_size child_styles = [child.styles for child in children] box_margins: list[Spacing] = [styles.margin for styles in child_styles] @@ -52,7 +51,7 @@ class HorizontalLayout(Layout): [styles.width for styles in child_styles], children, size, - parent_size, + parent.app.size, resolve_margin, dimension="width", ) diff --git a/src/textual/layouts/vertical.py b/src/textual/layouts/vertical.py index 4b0e5092b..b498fd637 100644 --- a/src/textual/layouts/vertical.py +++ b/src/textual/layouts/vertical.py @@ -22,7 +22,6 @@ class VerticalLayout(Layout): ) -> ArrangeResult: placements: list[WidgetPlacement] = [] add_placement = placements.append - parent_size = parent.outer_size child_styles = [child.styles for child in children] box_margins: list[Spacing] = [styles.margin for styles in child_styles] @@ -49,7 +48,7 @@ class VerticalLayout(Layout): [styles.height for styles in child_styles], children, size, - parent_size, + parent.app.size, resolve_margin, dimension="height", ) diff --git a/src/textual/widgets/_data_table.py b/src/textual/widgets/_data_table.py index 885a4963c..369c11778 100644 --- a/src/textual/widgets/_data_table.py +++ b/src/textual/widgets/_data_table.py @@ -249,7 +249,6 @@ class DataTable(ScrollView, Generic[CellType], can_focus=True): background: $surface ; color: $text; height: auto; - max-height: 100vh; } DataTable > .datatable--header { text-style: bold; diff --git a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr index 58db7fff9..e6c116485 100644 --- a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr +++ b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr @@ -21420,6 +21420,162 @@ ''' # --- +# name: test_viewport_height_and_width_properties + ''' + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ViewportUnits + + + + + + + + + + ────────────────────────────────────────────────────────────────────────────── + Hello, world! + + + + + + + + + + + + + + + + + + + + + + ────────────────────────────────────────────────────────────────────────────── + + + + + ''' +# --- # name: test_visibility ''' diff --git a/tests/snapshot_tests/snapshot_apps/viewport_units.py b/tests/snapshot_tests/snapshot_apps/viewport_units.py new file mode 100644 index 000000000..9a3800629 --- /dev/null +++ b/tests/snapshot_tests/snapshot_apps/viewport_units.py @@ -0,0 +1,14 @@ +from textual.app import App, ComposeResult +from textual.widgets import Static + + +class ViewportUnits(App): + CSS = """Static {width: 100vw; height: 100vh; border: solid cyan;} """ + + def compose(self) -> ComposeResult: + yield Static("Hello, world!") + + +app = ViewportUnits() +if __name__ == '__main__': + app.run() diff --git a/tests/snapshot_tests/test_snapshots.py b/tests/snapshot_tests/test_snapshots.py index 1ab64f8ea..14226a191 100644 --- a/tests/snapshot_tests/test_snapshots.py +++ b/tests/snapshot_tests/test_snapshots.py @@ -211,6 +211,11 @@ def test_css_property(file_name, snap_compare): assert snap_compare(path_to_app) +def test_viewport_height_and_width_properties(snap_compare): + path_to_app = SNAPSHOT_APPS_DIR / "viewport_units.py" + assert snap_compare(path_to_app) + + def test_multiple_css(snap_compare): # Interaction between multiple CSS files and app-level/classvar CSS assert snap_compare("snapshot_apps/multiple_css/multiple_css.py")