Table tests

vizro-core/examples/default/app.py

@@ -60,7 +60,10 @@ def AgGrid(data_frame=None):
     components=[
         vm.Table(
             id="table_id",
-            figure=dash_data_table(id="dash_datatable_id", data_frame="table_data", style_cell={"border": "5px solid green"},
+            figure=dash_data_table(
+                id="dash_datatable_id",
+                data_frame="table_data",
+                style_cell={"border": "5px solid green"},
             ),
             actions=[
                 vm.Action(id="filter_interaction", function=filter_interaction(targets=["scatter_chart", "table_2_id"]))

vizro-core/tests/unit/vizro/actions/test_filter_interaction_action.py

@@ -1,8 +1,8 @@
+import plotly.express as px
 import pytest
 from dash._callback_context import context_value
 from dash._utils import AttributeDict
 
-import plotly.express as px
 import vizro.models as vm
 from vizro.actions import filter_interaction
 from vizro.actions._actions_utils import (
@@ -112,14 +112,7 @@ def target_box_filtered_continent(request, gapminder_2007, box_params):
 
 @pytest.mark.usefixtures("managers_one_page_two_graphs_one_table_one_button")
 class TestFilterInteraction:
-    @pytest.mark.parametrize(
-        "callback_context_filter_interaction",
-        [
-            ("Africa", None),
-            ("Europe", None)
-        ],
-        indirect=True
-    )
+    @pytest.mark.parametrize("callback_context_filter_interaction", [("Africa", None), ("Europe", None)], indirect=True)
     def test_filter_interaction_without_targets_temporary_behavior(  # temporary fix, see below test
         self,
         callback_context_filter_interaction,
@@ -134,14 +127,11 @@ def test_filter_interaction_without_targets_temporary_behavior(  # temporary fix
 
     @pytest.mark.xfail  # This is the desired behavior, ie when no target is provided, then all charts filtered
     @pytest.mark.parametrize(
-        "callback_context_filter_interaction,"
-        "target_scatter_filtered_continent,"
-        "target_box_filtered_continent",
+        "callback_context_filter_interaction," "target_scatter_filtered_continent," "target_box_filtered_continent",
         [
-
             (("Africa", None), ("Africa", None), ("Africa", None)),
             (("Europe", None), ("Europe", None), ("Europe", None)),
-            (("Americas", None), ("Americas", None), ("Americas", None))
+            (("Americas", None), ("Americas", None), ("Americas", None)),
         ],
         indirect=True,
     )
@@ -165,7 +155,7 @@ def test_filter_interaction_without_targets_desired_behavior(
         [
             (("Africa", None), ("Africa", None)),
             (("Europe", None), ("Europe", None)),
-            (("Americas", None), ("Americas", None))
+            (("Americas", None), ("Americas", None)),
         ],
         indirect=True,
     )
@@ -229,7 +219,7 @@ def test_filter_interaction_with_invalid_targets(
         [
             ((None, "Algeria"), (None, "Algeria")),
             ((None, "Albania"), (None, "Albania")),
-            ((None, "Argentina"), (None, "Argentina"))
+            ((None, "Argentina"), (None, "Argentina")),
         ],
         indirect=True,
     )
@@ -242,9 +232,7 @@ def test_table_filter_interaction_with_one_target(
             vm.Action(id="test_action", function=filter_interaction(targets=["scatter_chart"]))
         ]
 
-        model_manager["vizro_table"].actions = [
-            vm.Action(function=filter_interaction(targets=["scatter_chart"]))
-        ]
+        model_manager["vizro_table"].actions = [vm.Action(function=filter_interaction(targets=["scatter_chart"]))]
 
         # Run action by picking the above added action function and executing it with ()
         result = model_manager["test_action"].function()
@@ -256,7 +244,7 @@ def test_table_filter_interaction_with_one_target(
         [
             ((None, "Algeria"), (None, "Algeria"), (None, "Algeria")),
             ((None, "Albania"), (None, "Albania"), (None, "Albania")),
-            ((None, "Argentina"), (None, "Argentina"), (None, "Argentina"))
+            ((None, "Argentina"), (None, "Argentina"), (None, "Argentina")),
         ],
         indirect=True,
     )
@@ -285,7 +273,7 @@ def test_table_filter_interaction_with_two_targets(
         [
             (("Africa", "Algeria"), ("Africa", "Algeria"), ("Africa", "Algeria")),
             (("Europe", "Albania"), ("Europe", "Albania"), ("Europe", "Albania")),
-            (("Americas", "Argentina"), ("Americas", "Argentina"),  ("Americas", "Argentina"))
+            (("Americas", "Argentina"), ("Americas", "Argentina"), ("Americas", "Argentina")),
         ],
         indirect=True,
     )

vizro-core/tests/unit/vizro/models/_components/test_table.py

@@ -8,11 +8,17 @@
 
 import vizro.models as vm
 import vizro.plotly.express as px
+from vizro.actions import filter_interaction
 from vizro.managers import data_manager
 from vizro.models._action._action import Action
 from vizro.tables import dash_data_table
 
 
+@pytest.fixture
+def dash_table_with_id(gapminder):
+    return dash_data_table(id="underlying_table_id", data_frame=gapminder)
+
+
 @pytest.fixture
 def dash_table_with_arguments():
     return dash_data_table(data_frame=px.data.gapminder(), style_header={"border": "1px solid green"})
@@ -31,9 +37,27 @@ def expected_table():
             html.Div(dash_table.DataTable(), id="text_table"),
         ],
         className="table-container",
+        id="text_table_outer",
     )
 
 
+@pytest.fixture
+def expected_table_with_id():
+    return html.Div(
+        [
+            None,
+            html.Div(dash_table.DataTable(id="underlying_table_id"), id="text_table"),
+        ],
+        className="table-container",
+        id="text_table_outer",
+    )
+
+
+@pytest.fixture
+def filter_interaction_action():
+    return vm.Action(function=filter_interaction())
+
+
 class TestDunderMethodsTable:
     def test_create_graph_mandatory_only(self, standard_dash_table):
         table = vm.Table(figure=standard_dash_table)
@@ -108,13 +132,59 @@ def test_process_figure_data_frame_df(self, standard_dash_table, gapminder):
             table_with_str_df.figure["data_frame"]
 
 
+class TestPreBuildTable:
+    def test_pre_build_no_actions_no_underlying_table_id(self, standard_dash_table):
+        table = vm.Table(
+            id="text_table",
+            figure=standard_dash_table,
+        )
+        table.pre_build()
+
+        assert hasattr(table, "_underlying_table_id") is False
+
+    def test_pre_build_actions_no_underlying_table_id_exception(self, standard_dash_table, filter_interaction_action):
+        table = vm.Table(
+            id="text_table",
+            figure=standard_dash_table,
+            actions=[filter_interaction_action],
+        )
+        with pytest.raises(ValueError, match="Underlying table object has no attribute 'id'."):
+            table.pre_build()
+
+    def test_pre_build_actions_underlying_table_id(self, dash_table_with_id, filter_interaction_action):
+        table = vm.Table(
+            id="text_table",
+            figure=dash_table_with_id,
+            actions=[filter_interaction_action],
+        )
+        table.pre_build()
+
+        assert hasattr(table, "_underlying_table_id") is True
+        assert table._underlying_table_id == "underlying_table_id"
+
+
 class TestBuildTable:
-    def test_table_build(self, standard_dash_table, expected_table):
+    def test_table_build_mandatory_only(self, standard_dash_table, expected_table):
         table = vm.Table(
             id="text_table",
             figure=standard_dash_table,
         )
 
+        table.pre_build()
+
         result = json.loads(json.dumps(table.build(), cls=plotly.utils.PlotlyJSONEncoder))
         expected = json.loads(json.dumps(expected_table, cls=plotly.utils.PlotlyJSONEncoder))
         assert result == expected
+
+    def test_table_build_with_id(self, dash_table_with_id, filter_interaction_action, expected_table_with_id):
+        table = vm.Table(
+            id="text_table",
+            figure=dash_table_with_id,
+            actions=[filter_interaction_action],
+        )
+
+        table.pre_build()
+
+        result = json.loads(json.dumps(table.build(), cls=plotly.utils.PlotlyJSONEncoder))
+        expected = json.loads(json.dumps(expected_table_with_id, cls=plotly.utils.PlotlyJSONEncoder))
+        assert result == expected