customized x-csrftoken contains extra `undefined`

When customizing the x-csrftoken field for requests sent from the browser based on hooks, the actual field value obtained on the backend always contains extra undefined content. This issue does not occur when setting other fields.

import dash
from dash import html
from flask import request
from dash.dependencies import Input, Output

app = dash.Dash(
    __name__,
    hooks={
        "request_pre": """
(payload) => {
    store.getState().config.fetch.headers['x-csrftoken'] = 'test-extra-header-value'
    store.getState().config.fetch.headers['other-field'] = 'other-value'
}
"""
    },
)

app.layout = html.Div(
    [html.Button("test", id="test-input"), html.Br(), html.Span(id="test-output")],
    style={"padding": 50},
)


@app.callback(Output("test-output", "children"), Input("test-input", "n_clicks"))
def test_callback(n_clicks):
    return "x-csrftoken: {}  other-field: {}".format(
        request.headers.get("x-csrftoken"), request.headers.get("other-field")
    )


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

dash                 2.18.2

Start by running the supplied Dash 2.18.2 reproduction, then inspect how the request_pre hook updates fetch headers before the browser request reaches Flask. Done means the backend receives the customized x-csrftoken value without extra undefined content, while other-field still retains its configured value.