From fae843cd6cd4c6e793abc11eb6aa289e45c9e7df Mon Sep 17 00:00:00 2001
From: Cameron DeCoster <cameron.decoster@gmail.com>
Date: Mon, 22 Sep 2025 18:45:09 -0600
Subject: [PATCH 1/3] Update style check to use isResponsive

---
 .../src/fragments/Graph.react.js              | 74 +++++--------------
 1 file changed, 20 insertions(+), 54 deletions(-)

diff --git a/components/dash-core-components/src/fragments/Graph.react.js b/components/dash-core-components/src/fragments/Graph.react.js
index c33feebf6f..85780327cf 100644
--- a/components/dash-core-components/src/fragments/Graph.react.js
+++ b/components/dash-core-components/src/fragments/Graph.react.js
@@ -457,27 +457,6 @@ class PlotlyGraph extends Component {
         });
     }
 
-    getStyle() {
-        const {responsive} = this.props;
-        let {style} = this.props;
-
-        // When there is no forced responsive style, return the original style property
-        if (!responsive) {
-            return style;
-        }
-
-        // Otherwise, if the height is not set, we make the graph size equal to the parent one
-        if (!style) {
-            style = {};
-        }
-
-        if (!style.height) {
-            return Object.assign({height: '100%'}, style);
-        }
-
-        return style;
-    }
-
     componentDidMount() {
         const p = this.plot(this.props);
         this._queue = this.amendTraces(p, {}, this.props);
@@ -536,46 +515,33 @@ class PlotlyGraph extends Component {
     }
 
     render() {
-        const {className, id, loading_state} = this.props;
-        const style = this.getStyle();
-
-        if (window.dash_component_api) {
-            return (
-                <LoadingElement
-                    id={id}
-                    key={id}
-                    className={className}
-                    style={style}
-                    ref={this.parentElement}
-                >
-                    <ResizeDetector
-                        onResize={this.graphResize}
-                        targets={[this.parentElement, this.gd]}
-                    />
-                    <div
-                        ref={this.gd}
-                        style={{height: '100%', width: '100%'}}
-                    />
-                </LoadingElement>
-            );
+        const {className, id, loading_state, style = {}} = this.props;
+        if (this.isResponsive(this.props)) {
+            style.height ||= '100%';
         }
+
+        let Container = LoadingElement;
+        const containerProps = {
+            className,
+            id,
+            key: id,
+            ref: this.parentElement,
+            style,
+        };
+        if (!window.dash_component_api) {
+            Container = 'div';
+            containerProps['data-dash-is-loading'] =
+                loading_state?.is_loading || undefined;
+        }
+
         return (
-            <div
-                id={id}
-                key={id}
-                className={className}
-                style={style}
-                ref={this.parentElement}
-                data-dash-is-loading={
-                    (loading_state && loading_state.is_loading) || undefined
-                }
-            >
+            <Container {...containerProps}>
                 <ResizeDetector
                     onResize={this.graphResize}
                     targets={[this.parentElement, this.gd]}
                 />
                 <div ref={this.gd} style={{height: '100%', width: '100%'}} />
-            </div>
+            </Container>
         );
     }
 }

From 909ffc94495ffba04ffd883a71191bb976f57497 Mon Sep 17 00:00:00 2001
From: Cameron DeCoster <cameron.decoster@gmail.com>
Date: Thu, 6 Nov 2025 16:13:55 -0700
Subject: [PATCH 2/3] Add comment about plotly.js resize function

---
 components/dash-core-components/src/fragments/Graph.react.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/dash-core-components/src/fragments/Graph.react.js b/components/dash-core-components/src/fragments/Graph.react.js
index 85780327cf..fdff615190 100644
--- a/components/dash-core-components/src/fragments/Graph.react.js
+++ b/components/dash-core-components/src/fragments/Graph.react.js
@@ -393,6 +393,7 @@ class PlotlyGraph extends Component {
 
         gd.classList.add('dash-graph--pending');
 
+        // Calling resize enables layout.autosize in plotly.js
         Plotly.Plots.resize(gd)
             .catch(() => {})
             .finally(() => gd.classList.remove('dash-graph--pending'));

From be8eb23122aac0c8a549420e401ef26b36ce63d9 Mon Sep 17 00:00:00 2001
From: Cameron DeCoster <cameron.decoster@gmail.com>
Date: Fri, 7 Nov 2025 14:45:36 -0700
Subject: [PATCH 3/3] Update changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2b85deb17a..0821acdcea 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,6 +20,7 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 - [#3415](https://github.com/plotly/dash/pull/3415) Fix the error triggered when only a single no_update is returned for client-side callback functions with multiple Outputs. Fix [#3366](https://github.com/plotly/dash/issues/3366)
 - [#3416](https://github.com/plotly/dash/issues/3416) Fix DeprecationWarning in dash/_jupyter.py by migrating from deprecated ipykernel.comm.Comm to comm module
 - [#3488](https://github.com/plotly/dash/pull/3488) Fix pkgutil.find_loader removal in Python 3.14
+- [#3496](https://github.com/plotly/dash/pull/3496) Fix dcc.Graph infinite resize loop
 
 ## [3.2.0] - 2025-07-31