`ha-code-editor` does not update when switching between nested sub-elements in card editor

[SnakeEater96]

Checklist

• [X] I have updated to the latest available Home Assistant version.
• [X] I have cleared the cache of my browser.
• [X] I have tried a different browser to see if it is related to my browser.
• [X] I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.

Describe the issue you are experiencing

With the new version of HAOS, the code editor is not updated if you have buttons that lead to different pages where the code must also be adapted when you change the tab

Reproducible if you upgrade to version 2024.10.X

Bug See video

https://www.youtube.com/watch?v=Q6agYdNeyZs

With this bug, the code editor is not updated correctly, so that incorrect code can be changed to the wrong tab. The behavior does not occur in version 2024.09.x . So far, this can only be seen in the dashboard, whether this also applies to other areas still needs to be checked. At least it is no longer possible to make changes in the Visual Editor / Tab.

Describe the behavior you expected

With the new version of HAOS, the code editor is not updated if you have buttons that lead to different pages where the code must also be adapted when you change the tab

Reproducible if you upgrade to version 2024.10.X

Bug See video

https://www.youtube.com/watch?v=Q6agYdNeyZs

With this bug, the code editor is not updated correctly, so that incorrect code can be changed to the wrong tab. The behavior does not occur in version 2024.09.x . So far, this can only be seen in the dashboard, whether this also applies to other areas still needs to be checked. At least it is no longer possible to make changes in the Visual Editor / Tab.

Steps to reproduce the issue

1.update Home Assistant 2. 3. ...

What version of Home Assistant Core has the issue?

2024.10.1

What was the last working version of Home Assistant Core?

2024.9.X

In which browser are you experiencing the issue with?

N/A

Which operating system are you using to run this browser?

N/A

State of relevant entities

No response

Problem-relevant frontend configuration

No response

Javascript errors shown in your browser console/inspector

No response

Additional information

No response

[karwosts]

I think I can see what you mean, and I believe I have a more simplified example as follows:

Setup a card with the following configuration, and save.

type: vertical-stack
cards:
  - type: horizontal-stack
    cards:
      - type: foo
  - type: horizontal-stack
    cards:
      - type: bar

Open the visual editor:

Select 2 to go to the second card in the vertical stack:

See that the yaml editor still shows the code from card 1, when it should be showing the code of card 2.