Test switching tabs without Graph resizing

Author: valentijnnieman

test/test_integration.py

@@ -469,6 +469,68 @@ def test_tabs_with_children_undefined(self):
 
         self.snapshot('Tabs component with children undefined')
 
+    def test_graph_does_not_resize_in_tabs(self):
+        app = dash.Dash(__name__)
+
+        app.layout = html.Div([
+            html.H1('Dash Tabs component demo'),
+            dcc.Tabs(id="tabs-example", value='tab-1-example', children=[
+                dcc.Tab(label='Tab One', value='tab-1-example', id='tab-1'),
+                dcc.Tab(label='Tab Two', value='tab-2-example', id='tab-2'),
+            ]),
+            html.Div(id='tabs-content-example')
+        ])
+
+
+        @app.callback(Output('tabs-content-example', 'children'),
+                    [Input('tabs-example', 'value')])
+        def render_content(tab):
+            if tab == 'tab-1-example':
+                return html.Div([
+                    html.H3('Tab content 1'),
+                    dcc.Graph(
+                        id='graph-1-tabs',
+                        figure={
+                            'data': [{
+                                'x': [1, 2, 3],
+                                'y': [3, 1, 2],
+                                'type': 'bar'
+                            }]
+                        }
+                    )
+                ])
+            elif tab == 'tab-2-example':
+                return html.Div([
+                    html.H3('Tab content 2'),
+                    dcc.Graph(
+                        id='graph-2-tabs',
+                        figure={
+                            'data': [{
+                                'x': [1, 2, 3],
+                                'y': [5, 10, 6],
+                                'type': 'bar'
+                            }]
+                        }
+                    )
+                ])
+        self.startServer(app=app)
+
+        tab_one = self.wait_for_element_by_css_selector('#tab-1')
+        tab_two = self.wait_for_element_by_css_selector('#tab-2')
+
+        self.snapshot("Tabs with Graph - initial (graph should not resize)")
+
+        tab_two.click()
+        time.sleep(1)
+
+        self.snapshot("Tabs with Graph - clicked tab 2 (graph should not resize)")
+
+        tab_one.click()
+        time.sleep(1)
+
+        self.snapshot("Tabs with Graph - clicked tab 1 (graph should not resize)")
+
+
     def test_location_link(self):
         app = dash.Dash(__name__)