Dash: [BUG] UI components not updating from dash_table connected callback

Created on 8 Jan 2020  路  1Comment  路  Source: plotly/dash

Describe your context

dash                 1.7.0
dash-core-components 1.6.0
dash-html-components 1.0.2
dash-renderer        1.2.2
dash-table           4.5.1
  • macOS Catalina Version 10.15.2
  • Chrome Version 79.0.3945.88

Describe the bug

The issue is not apparent in dash 1.6.1, but appeared in 1.7.0.
For certain callback graphs, UI components with callbacks connected to a dash_table will not update their state.

Example callback graph and code:
dash_callback_graph

import dash
import dash_html_components as html
import dash_table
from dash.dependencies import Input, Output
import random


app = dash.Dash(__name__)
app.layout = html.Div(
    [
        html.Div(id="level-1_1"),
        html.Div(id="level-1_2"),
        html.Div(id="level-2_1"),
        html.H1(id="level-2_2"),
        html.Button("Update", id="button"),
        dash_table.DataTable(id="table"),
    ],
)


@app.callback(
    # Changing the order of outputs here fixes the issue
    [Output("level-1_2", "children"), Output("level-1_1", "children")],
    [Input("button", "n_clicks")],
)
def level1(n_clicks):
    if n_clicks is None:
        return "initializing", "initializing"
    return "level-1_2", "level-1_1"


@app.callback(
    Output("level-2_1", "children"), [Input("level-1_1", "children")],
)
def level2_1(data):
    if data is None:
        return "initializing"
    return "level-2_1"


@app.callback(
    Output("level-2_2", "children"),
    [Input("level-1_2", "children"), Input("table", "selected_cells")],
)
def level2_2(data, selected_cells):
    if data is None:
        return "initializing"
    return "hello " + str(random.randint(0,100))

if __name__ == "__main__":
    app.run_server(debug=True)

Expected behavior

The UI displays the H1 element with "hello" and a random number. When clicking the "Update" button, the H1 element will be updated.

Actual behavior and investigation

The H1 UI element nondeterministically displays either "hello XX" or "initializing" (see screenshot below) on startup. Clicking the update button does not change the H1 element. This is despite the browser receiving the correct callback response from the backend on _dash-update-component, e.g.

{"response": {"props": {"children": "hello 65"}}}

The issue only occurs with the dash_table connected as input to the callback (independent on using selected_cells or another attribute).
Changing the order of outputs in the first callback above (see comment), or removing the seemingly unrelated callback for Div 2_1 also make the issue disappear.

Looking at the differences between 1.6.1 and 1.7.0, this might potentially be related to changes in
https://github.com/plotly/dash/pull/1027.

Screenshots
initializing

dash-type-bug

Most helpful comment

Confirmed, thanks for the clear report @tsiq-bertram
I wonder if this is related to #1053 - anyway I'm reworking the whole callback dispatching machinery as part of wildcards #475 so will try to sort this out as well.

>All comments

Confirmed, thanks for the clear report @tsiq-bertram
I wonder if this is related to #1053 - anyway I'm reworking the whole callback dispatching machinery as part of wildcards #475 so will try to sort this out as well.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

alexcjohnson picture alexcjohnson  路  3Comments

germayneng picture germayneng  路  4Comments

rpkyle picture rpkyle  路  3Comments

mheydasch picture mheydasch  路  3Comments

Ricardo-C-Oliveira picture Ricardo-C-Oliveira  路  4Comments