Corrupted rendering of collapsed card with plotly pane

[paoloalba]

python 3.11, 3.10
panel 1.3.8
plotly 5.16.1
OS -> MacOS, Windows10
browser -> Safari, Edge

on the change of page, the corresponding panel object should be displayed. Instead a collapsed card with the plotly figure from the previous page is displayed on top of the main. Jumping back and forth from the page with the original collapsed card and the other, multiple nameless cards are added to the main, all with the same plotly figure. Going to a third page, and then back to the second display everything correctly (except for the multiple nameless cards, which remain above the main).

import param

import panel as pn
import plotly.graph_objects as go

from datetime import datetime
from time import sleep

pn.extension(notifications=True)

pn.cache()
def my_view_1(testo):
    return pn.Column("Page 1", testo, pn.Card(pn.pane.Plotly(go.Figure()), title="Collapsed Card with Plotly figure", collapsed=True))

pn.cache()
def my_view_2(testo):
    return pn.Column("Page 2", testo + " something")

pn.cache()
def my_view_3(testo):
    return pn.Column("Page 3", testo + " something more")

class TestClass(param.Parameterized):
    texto = param.String(default="test")

    def view(self):
        return my_view_1(self.texto)

    def view2(self):
        return my_view_2(self.texto)

    def view3(self):
        return my_view_3(self.texto)

tmplt = pn.template.BootstrapTemplate()

insto = TestClass()

page_dct = {}
page_dct["uno"] = insto.view
page_dct["due"] = insto.view2
page_dct["tre"] = insto.view3

def show(page):
    return page_dct[page]

pegero = pn.widgets.Select(options=list(page_dct.keys()))
ishow = pn.bind(show, page=pegero)

tmplt.sidebar.append(pegero)
tmplt.sidebar.append(insto.param)
tmplt.main.append(ishow)

tmplt.servable()

called with python3 -m panel serve --show serve_panel.py

Registrazione.schermo.2024-03-05.alle.21.16.52.mov

[paoloalba]

additional notes:

• if multiple elements are passed to Page 1, the bug with the plotly-card happens only if it is the last element. If a divider is added after the plotly card, then this is copied every time after each nameless card.
• if the plotly-card is not collapsed, then the bug does not appear

[philippjfr]

Thanks for the detailed bug report, I pushed a fix in #6448. Note that you do have declare that you want to use the plotly extension with:

pn.extension('plotly', notifications=True)