Repository: plotly/dash

Issue:
[BUG] background callback - progress key not deleted until the end
Community reported bug by Tphil10, as a DM to me. Bug description below:

We’ve [community members, Tim and Bryan] been tinkering around with some cool download animations for buttons but the way we’ve implemented is shines an odd issue with the background callback module.

The below code works great except for the `time.sleep(1)` line. If you increase this by more than 1 second, the download function downloads the file once a second, every second lol. I wanted to increase it so the checkmark animation stays a bit longer but alas, we can’t cause the file downloads multiple times. Thoughts? I think the problem is with the background callback.

```
import dash
import dash_mantine_components as dmc
from dash import html, Input, Output, DiskcacheManager, dcc
import diskcache
import time
import plotly.express as px

cache = diskcache.Cache('./cache')
background_callback_manager = DiskcacheManager(cache)

app = dash.Dash(
    __name__,
    suppress_callback_exceptions=True,
    background_callback_manager=background_callback_manager,
    external_stylesheets=['https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css']
)

download = html.I(className='fas fa-download fa-fw fa-2x')
loading = html.I(className='fas fa-spinner fa-fw fa-2x fa-spin')
complete = html.I(className='fas fa-check fa-fw fa-2x')


download_btn = dmc.ActionIcon(
        download,
        id='dload-btn',
        variant='filled',
        size='xl',
        p='1.5rem',
        style={'transition': 'all 0.5s ease-in-out'},
        color='blue',
    )

app.layout = html.Div(id='container', 
children=[
    download_btn,
    dcc.Download(id='download')
])


@app.callback(
    Output('dload-btn', 'n_clicks'),
    Input('dload-btn', 'n_clicks'),
    prevent_initial_call=True,
    background=True,
    running=[
         (Output('dload-btn', 'disabled'), True, False),
         (Output('dload-btn','children'), loading, download),
         (Output('dload-btn','className'), None, None)
    ],
    progress=[Output('dload-btn','children'),
              Output('dload-btn','className'),
              Output('download','data')],
)
def downloader(set_progress, _):

    time.sleep(3)

    df = px.data.gapminder()
    set_progress([complete, 'success', dcc.send_data_frame(df.to_csv, "mydf.csv")])
    time.sleep(1)

    return dash.no_update


if __name__ == '__main__':
    app.run_server(debug=True)
```

style.css file:
```
.success {
    border-radius: 50%;
    color: #fff !important;
    background-color: #80bca3 !important;
}
```
Plotly staff member, Philippe, looked into this problem. The ostensible culprit is:

> I've found the reason why it does it twice, we just never delete the progress key until the end, for most case it doesn't matter, but with the download it triggers it everytime it's updated.


Discussion:

Resolving patch:
diff --git a/dash/long_callback/managers/celery_manager.py b/dash/long_callback/managers/celery_manager.py
--- a/dash/long_callback/managers/celery_manager.py
+++ b/dash/long_callback/managers/celery_manager.py
@@ -98,6 +98,7 @@ def get_progress(self, key):
         progress_key = self._make_progress_key(key)
         progress_data = self.handle.backend.get(progress_key)
         if progress_data:
+            self.handle.backend.delete(progress_key)
             return json.loads(progress_data)
 
         return None
diff --git a/dash/long_callback/managers/diskcache_manager.py b/dash/long_callback/managers/diskcache_manager.py
--- a/dash/long_callback/managers/diskcache_manager.py
+++ b/dash/long_callback/managers/diskcache_manager.py
@@ -127,7 +127,11 @@ def call_job_fn(self, key, job_fn, args, context):
 
     def get_progress(self, key):
         progress_key = self._make_progress_key(key)
-        return self.handle.get(progress_key)
+        progress_data = self.handle.get(progress_key)
+        if progress_data:
+            self.handle.delete(progress_key)
+
+        return progress_data
 
     def result_ready(self, key):
         return self.handle.get(key) is not None


Test patch:
diff --git a/tests/integration/long_callback/app_progress_delete.py b/tests/integration/long_callback/app_progress_delete.py
new file mode 100644
--- /dev/null
+++ b/tests/integration/long_callback/app_progress_delete.py
@@ -0,0 +1,45 @@
+from dash import Dash, Input, Output, State, html, clientside_callback
+import time
+
+from tests.integration.long_callback.utils import get_long_callback_manager
+
+long_callback_manager = get_long_callback_manager()
+handle = long_callback_manager.handle
+
+app = Dash(__name__, long_callback_manager=long_callback_manager)
+
+app.layout = html.Div(
+    [
+        html.Button("Start", id="start"),
+        html.Div(id="output"),
+        html.Div(id="progress-output"),
+        html.Div(0, id="progress-counter"),
+    ]
+)
+
+clientside_callback(
+    "function(_, previous) { return parseInt(previous) + 1;}",
+    Output("progress-counter", "children"),
+    Input("progress-output", "children"),
+    State("progress-counter", "children"),
+    prevent_initial_call=True,
+)
+
+
+@app.callback(
+    Output("output", "children"),
+    Input("start", "n_clicks"),
+    progress=Output("progress-output", "children"),
+    interval=200,
+    background=True,
+    prevent_initial_call=True,
+)
+def on_bg_progress(set_progress, _):
+    set_progress("start")
+    time.sleep(2)
+    set_progress("stop")
+    return "done"
+
+
+if __name__ == "__main__":
+    app.run_server(debug=True)
diff --git a/tests/integration/long_callback/test_basic_long_callback.py b/tests/integration/long_callback/test_basic_long_callback.py
--- a/tests/integration/long_callback/test_basic_long_callback.py
+++ b/tests/integration/long_callback/test_basic_long_callback.py
@@ -538,3 +538,12 @@ def test_lcbc013_unordered_state_input(dash_duo, manager):
         dash_duo.find_element("#click").click()
 
         dash_duo.wait_for_text_to_equal("#output", "stored")
+
+
+def test_lcbc014_progress_delete(dash_duo, manager):
+    with setup_long_callback_app(manager, "app_progress_delete") as app:
+        dash_duo.start_server(app)
+        dash_duo.find_element("#start").click()
+        dash_duo.wait_for_text_to_equal("#output", "done")
+
+        assert dash_duo.find_element("#progress-counter").text == "2"