Disappearing and Swapping Content in Dash v3

[benmatwil]

Describe your context

Dash package versions:

dash                      3.0.4
dash_ag_grid              31.3.1
dash-bootstrap-components 2.0.3
dash-core-components      2.0.0
dash-html-components      2.0.0
dash-table                5.0.0

Browsers used:
- OS: Windows
- Browser: Chrome and Edge
- Version: latest

Describe the bug

I have a dash app which has multiple tabs and dropdowns which control the majority of the content on the page.

Using v3 of dash and highlighting text or clicking on interactive (e.g. buttons) and non-interactive (e.g. text) content on the page causes elements from previous tabs to appear and replace those on the current page.
Examples being:

• clicking on a dropdown on the currently viewed tab and it gets replaced by a title element of another tab
• highlighting some text from a H3 element causes the whole element to be replaced by a dash table from another tab

The issue doesn't seem to occur after downgrading the installed version of dash to version 2.18.2.

Watching the network tool within the browser's developer tools when the issue occurs would suggest that when the content changes on the page, there is no communication between the browser and the dash app and it's just local javascript running.

Not sure if it's related but also received this error while in debug mode:

Error: undefined was not found.
   at Object.resolve (http://server:8040/_dash-component-suites/dash/dash-renderer/build/dash_renderer.v3_0_3m1749492493.dev.js:83970:11)
   at hydrateFunc (http://server:8040/_dash-component-suites/dash/dash-renderer/build/dash_renderer.v3_0_3m1749492493.dev.js:84756:69)
   at DashWrapper (http://server:8040/_dash-component-suites/dash/dash-renderer/build/dash_renderer.v3_0_3m1749492493.dev.js:84774:16)
   at renderWithHooks (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:15496:20)
   at mountIndeterminateComponent (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:20113:15)
   at beginWork (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:21636:18)
   at beginWork$1 (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:27475:16)
   at performUnitOfWork (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:26609:14)
   at workLoopSync (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:26515:7)
   at renderRootSync (http://server:8040/_dash-component-suites/dash/deps/react-dom@18.v3_0_3m1749492493.3.1.js:26483:9)

Expected behavior

No changes to page when clicking etc.

[AnnMarieW]

Hi @benmatwil
Can you please include an minimal example to reproduce the issue?