Autofilled values in dcc.Input with debounce=True are not detected on submit

[brogrammeur]

dash version: #3.0.4

When using dcc.Input with debounce=True, values autofilled by a browser are not captured unless the user manually interacts with the input (e.g., clicks or types).

This leads to None values being submitted, even though the fields appear visually filled.

[AnnMarieW]

@brogrammeur can you try setting autoComplete=“on”. Or some other valid auto complete string https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete

[brogrammeur]

Hello @AnnMarieW . Maybe I didn't understand the question clearly but it seems to me that autocomplete and autofill are two different features. Anyway, I tried the autocomplete feature and it works fine and do not produce None values.

[AnnMarieW]

@brogrammeur - Just confirming - is this issue OK to close?

[brogrammeur]

as far as I know, the autofill feature still does not work correctly

[AnnMarieW]

Not sure what you mean. Can you make a minimal example that replicates the issue?

[brogrammeur]

Here is some code that I use to reproduce the behavior.

As soon as I run this code, the username field contains the string user and the passsword field contains some **** password, automatically fill by the browser from some previous login info.

If I click on the button (without clicking anywhere else), the string Username: None, Password: None will appear in the output label under the button.

import dash
import dash_bootstrap_components as dbc
from dash import dcc, html, Input, Output, State

app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = dbc.Container([

    html.H2("Login Form"),

    dbc.Label("Username", html_for="username"),
    dcc.Input(type="text", id="username", name="username", debounce=True, placeholder="Enter your username"),
    html.Br(),

    dbc.Label("Password", html_for="password"),
    dcc.Input(type="password", id="password", name="password", debounce=True, placeholder="Enter your password"),
    html.Br(),

    dbc.Button("Login", color="primary", type="submit", id="submit"),

    html.Div(id="output")
], className="p-4")


@app.callback(
    Output("output", "children"),
    Input("submit", "n_clicks"),
    State("username", "value"),
    State("password", "value"),
    prevent_initial_call=True
)
def on_submit(n, user, pwd):
    return f"Username: {user}, Password: {pwd}"

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

[gvwilson]

thanks @brogrammeur I'll see if we can get eyes on this in the next couple of weeks