Fix initial callbacks rerunning on existing elements during Patch() ops

Author: Aaron-Wrote-This

CHANGELOG.md

@@ -9,9 +9,10 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 
 ## Fixed
 - [#3629](https://github.com/plotly/dash/pull/3629) Fix date pickers not showing date when initially rendered in a hidden container.
-- [#3627][(](https://github.com/plotly/dash/pull/3627)) Make dropdowns searchable wheen focused, without requiring to open them first
+- [#3627][(](https://github.com/plotly/dash/pull/3627)) Make dropdowns searchable when focused, without requiring to open them first
 - [#3656][(](https://github.com/plotly/dash/pull/3656)) Improved dropdown performance for large collections of options
 - [#3660][(](https://github.com/plotly/dash/pull/3660)) Allow same date to be selected for both start and end in DatePickerRange components
+- [#3682](https://github.com/plotly/dash/pull/3682) Fix initial callbacks when created via dcc.Patch
 
 
 

dash/dash-renderer/src/actions/dependencies.js

@@ -1194,7 +1194,8 @@ export function getWatchedKeys(id, newProps, graphs) {
  *   See getCallbackByOutput for details.
  */
 export function getUnfilteredLayoutCallbacks(graphs, paths, layoutChunk, opts) {
-    const {outputsOnly, removedArrayInputsOnly, newPaths, chunkPath} = opts;
+    const {outputsOnly, removedArrayInputsOnly, newPaths, chunkPath, oldPaths} =
+        opts;
     const foundCbIds = {};
     const callbacks = [];
 
@@ -1249,7 +1250,12 @@ export function getUnfilteredLayoutCallbacks(graphs, paths, layoutChunk, opts) {
                     // unless specifically requested not to.
                     // ie this is the initial call of this callback even if it's
                     // not the page initialization but just a new layout chunk
-                    if (!cb.callback.prevent_initial_call) {
+                    // Don't fire initial call for components that already existed before
+                    // this chunk update (e.g. existing MATCH items when Patch adds a new one).
+                    if (
+                        !cb.callback.prevent_initial_call &&
+                        !(chunkPath && oldPaths && getPath(oldPaths, id))
+                    ) {
                         cb.initialCall = true;
                         addCallback(cb);
                     }

dash/dash-renderer/src/observers/executedCallbacks.ts

@@ -160,6 +160,7 @@ const observer: IStoreObserverDefinition<IStoreState> = {
                                 requestedCallbacks,
                                 getLayoutCallbacks(graphs, paths, children, {
                                     chunkPath: oldChildrenPath,
+                                    oldPaths: oPaths,
                                     filterRoot
                                 }).map(rcb => ({
                                     ...rcb,

tests/integration/callbacks/test_wildcards.py

@@ -1,12 +1,13 @@
 import pytest
 import re
+import threading
 from selenium.webdriver.common.keys import Keys
 import json
 from multiprocessing import Lock
 
 from dash.testing import wait
 import dash
-from dash import Dash, Input, Output, State, ALL, ALLSMALLER, MATCH, html, dcc
+from dash import Dash, Input, Output, State, ALL, ALLSMALLER, MATCH, html, dcc, Patch
 
 from tests.assets.todo_app import todo_app
 from tests.assets.grouping_app import grouping_app
@@ -619,3 +620,92 @@ def on_click(_) -> str:
         assert not dash_duo.find_element("#buttons button:nth-child(2)").get_attribute(
             "disabled"
         )
+
+
+def test_cbwc009_patch_no_spurious_match_callbacks(dash_duo):
+    """Regression test for the oldPaths fix in getUnfilteredLayoutCallbacks.
+
+    When Patch() appends a new MATCH-pattern component, existing MATCH callbacks
+    must NOT re-fire for pre-existing components. Previously, crawlLayout would
+    visit all children in the layout chunk and mark every matching output as
+    initialCall=true, causing all existing callbacks to spuriously re-execute.
+
+    The fix passes oldPaths (the pre-update paths snapshot) into
+    getUnfilteredLayoutCallbacks and skips initialCall for any component whose
+    ID already exists in oldPaths.
+    """
+    lock = threading.Lock()
+    fire_counts = {}  # {index: count} how many times each MATCH callback fired
+
+    def make_item(index):
+        return html.Div(
+            [
+                dcc.Input(
+                    id={"type": "item-input", "index": index},
+                    value=index,
+                    type="number",
+                    className="item-input",
+                ),
+                html.Div(
+                    "init",
+                    id={"type": "item-output", "index": index},
+                    className="item-output",
+                ),
+            ]
+        )
+
+    app = Dash(__name__)
+    app.layout = html.Div(
+        [
+            html.Button("Add", id="add-btn", n_clicks=0),
+            html.Div([make_item(0), make_item(1)], id="container"),
+        ]
+    )
+
+    @app.callback(
+        Output("container", "children"),
+        Input("add-btn", "n_clicks"),
+        prevent_initial_call=True,
+    )
+    def add_item(n):
+        p = Patch()
+        p.append(make_item(n + 1))
+        return p
+
+    @app.callback(
+        Output({"type": "item-output", "index": MATCH}, "children"),
+        Input({"type": "item-input", "index": MATCH}, "value"),
+    )
+    def on_value_change(value):
+        from dash import ctx
+
+        idx = ctx.outputs_grouping["id"]["index"]
+        with lock:
+            fire_counts[idx] = fire_counts.get(idx, 0) + 1
+            count = fire_counts[idx]
+        return f"fired-{idx}-#{count}"
+
+    dash_duo.start_server(app)
+
+    # Wait for the initial callbacks to fire for both pre-existing items.
+    wait.until(lambda: fire_counts.get(0, 0) >= 1, 5)
+    wait.until(lambda: fire_counts.get(1, 0) >= 1, 5)
+
+    counts_before = {0: fire_counts[0], 1: fire_counts[1]}
+
+    # Add a new item via Patch, this should fire only for index 2.
+    dash_duo.find_element("#add-btn").click()
+    wait.until(lambda: fire_counts.get(2, 0) >= 1, 5)
+
+    # Pre-existing callbacks must NOT have re-fired.
+    assert fire_counts[0] == counts_before[0], (
+        f"Item 0 callback fired spuriously after Patch: "
+        f"was {counts_before[0]}, now {fire_counts[0]}"
+    )
+    assert fire_counts[1] == counts_before[1], (
+        f"Item 1 callback fired spuriously after Patch: "
+        f"was {counts_before[1]}, now {fire_counts[1]}"
+    )
+    assert (
+        fire_counts[2] == 1
+    ), f"New item 2 callback should have fired exactly once, fired {fire_counts[2]}"