Skip to content

Conversation

hhubert6
Copy link
Contributor

The problem is that debugger connect to the client via websocket using single root socket id but when dealing with "embedded" LiveViews there is more than one.

Solution I came up with:

  • when route is rendered as regular LiveView with embedded LiveView: for communication find socket_id of regular LiveView (it's the only LiveView on transport_pid that is neither embedded nor nested)
  • when route is controller with embedded LiveView: send all root socket ids found on the page when connecting to websocket and subscribe to multiple 'client:socket_id' topics

Also fixes #723

@hhubert6 hhubert6 linked an issue Oct 14, 2025 that may be closed by this pull request
Copy link
Contributor

@GuzekAlan GuzekAlan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice!


const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
console.log('mutation');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is this needed?

Comment on lines 11 to 14
if (
mutation.type === 'attributes' &&
mutation.attributeName === 'data-phx-root-id'
) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nitpick: how about early return?

Comment on lines 18 to 28
if (Object.keys(rootIDs).length >= liveViewElements.length) {
const rootSocketIDs = new Set(Object.values(rootIDs));
rootSocketIDs.delete(mainID);

observer.disconnect();

resolve({
mainSocketID: mainID,
rootSocketIDs: [...rootSocketIDs],
});
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please split it to a function and name it so that it will be easier to understand what is happening here?

@hhubert6 hhubert6 requested a review from GuzekAlan October 17, 2025 15:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Highlighting does not work with embedded LiveViews Inspecting not working with Embedded Live Views

2 participants