dbc.Popover loses target when target leaves DOM and cannot be "retargeted"

Dash Python
1

I’m working with dbc.Popovers that target things that are not in the DOM when being created like not yet opened dbc.Modals.
I noticed, that when the target is set to such a component when the dbc.Modal opens for the first time, it works. However, if the target dbc.Modal closes and opens again, the dbc.Popover loses its target and I cannot set it back again.
Even when clicking twice :smiley:

from dash import Dash, html, callback
from dash.dependencies import Input, Output, State
import dash_bootstrap_components as dbc

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

app.layout = html.Div([
    dbc.Modal(
        id="modal",
        is_open=False,
        children=dbc.ModalBody([
            html.Div(id="div-in-modal",
                     children="I'm a div in a modal"),
            dbc.Button(id="button-open-popover", children="Toggle Popover"),
            dbc.Button(
                id="button-set-popover-target",
                children="Set Popover target"
            ),
            ])
    ),
    dbc.Popover(
        id="popover",
        body=True,
        children=html.Div("Popover")
    ),
    dbc.Button(
        id="button-open-modal",
        children="Toggle Modal"
    )
])


@callback(
    Output("modal", "is_open"),
    Output("popover", "is_open", allow_duplicate=True),
    Input("button-open-modal", "n_clicks"),
    State("modal", "is_open"),
    prevent_initial_call=True,
)
def toggle_modal(n, is_open):
    return not is_open, False


@callback(
    Output("popover", "target"),
    Input("button-set-popover-target", "n_clicks"),
    prevent_initial_call=True,
)
def reset_popover_target(n):
    return "div-in-modal"


@callback(
    Output("popover", "is_open", allow_duplicate=True),
    Input("button-open-popover", "n_clicks"),
    State("popover", "is_open"),
    prevent_initial_call=True,
)
def toggle_popover(n, is_open):
    return not is_open


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

Peek 2024-05-31 13-15

2

As a very unhandy workaround, I figured out, that if one set the target=False, every time the popover closes, and resets it again afterwards, it finds its target again …


@callback(
    Output("popover", "target", allow_duplicate=True),
    Input("popover", "is_open"),
    prevent_initial_call=True,
)
def reset_popover_target(is_open):
    if not is_open:
        return False
    else:
        raise PreventUpdate