feat: update register editor events

This commit is contained in:
Rohit
2025-07-06 21:44:19 +05:30
parent a677cb91af
commit be42c1d8ef

View File

@@ -1286,129 +1286,181 @@ export class RemoteBrowser {
* @returns void * @returns void
*/ */
public registerEditorEvents = (): void => { public registerEditorEvents = (): void => {
// For each event, include userId to make sure events are handled for the correct browser // For each event, include userId to make sure events are handled for the correct browser
logger.log('debug', `Registering editor events for user: ${this.userId}`); logger.log("debug", `Registering editor events for user: ${this.userId}`);
this.socket.on(`captureDirectScreenshot:${this.userId}`, async (settings) => { this.socket.on(
logger.debug(`Direct screenshot capture requested for user ${this.userId}`); `captureDirectScreenshot:${this.userId}`,
async (settings) => {
logger.debug(
`Direct screenshot capture requested for user ${this.userId}`
);
await this.captureDirectScreenshot(settings); await this.captureDirectScreenshot(settings);
}); }
);
// For backward compatibility // For backward compatibility
this.socket.on('captureDirectScreenshot', async (settings) => { this.socket.on("captureDirectScreenshot", async (settings) => {
await this.captureDirectScreenshot(settings); await this.captureDirectScreenshot(settings);
}); });
// Listen for specific events for this user // Listen for specific events for this user
this.socket.on(`rerender:${this.userId}`, async () => { this.socket.on(`rerender:${this.userId}`, async () => {
logger.debug(`Rerender event received for user ${this.userId}`); logger.debug(`Rerender event received for user ${this.userId}`);
await this.makeAndEmitScreenshot(); if (this.renderingMode === "dom") {
}); await this.makeAndEmitDOMSnapshot();
} else {
await this.makeAndEmitScreenshot();
}
});
// For backward compatibility, also listen to the general event this.socket.on("rerender", async () => {
this.socket.on('rerender', async () => { logger.debug(
logger.debug(`General rerender event received, checking if for user ${this.userId}`); `General rerender event received, checking if for user ${this.userId}`
await this.makeAndEmitScreenshot(); );
}); if (this.renderingMode === "dom") {
await this.makeAndEmitDOMSnapshot();
} else {
await this.makeAndEmitScreenshot();
}
});
this.socket.on(`settings:${this.userId}`, (settings) => { this.socket.on(`settings:${this.userId}`, (settings) => {
this.interpreterSettings = settings; this.interpreterSettings = settings;
logger.debug(`Settings updated for user ${this.userId}`); logger.debug(`Settings updated for user ${this.userId}`);
}); });
this.socket.on(`changeTab:${this.userId}`, async (tabIndex) => { this.socket.on(`changeTab:${this.userId}`, async (tabIndex) => {
logger.debug(`Tab change to ${tabIndex} requested for user ${this.userId}`); logger.debug(
await this.changeTab(tabIndex); `Tab change to ${tabIndex} requested for user ${this.userId}`
}); );
await this.changeTab(tabIndex);
});
this.socket.on(`addTab:${this.userId}`, async () => { this.socket.on(`addTab:${this.userId}`, async () => {
logger.debug(`New tab requested for user ${this.userId}`); logger.debug(`New tab requested for user ${this.userId}`);
await this.currentPage?.context().newPage(); await this.currentPage?.context().newPage();
const lastTabIndex = this.currentPage ? this.currentPage.context().pages().length - 1 : 0; const lastTabIndex = this.currentPage
await this.changeTab(lastTabIndex); ? this.currentPage.context().pages().length - 1
}); : 0;
await this.changeTab(lastTabIndex);
});
this.socket.on(`closeTab:${this.userId}`, async (tabInfo) => { this.socket.on(`closeTab:${this.userId}`, async (tabInfo) => {
logger.debug(`Close tab ${tabInfo.index} requested for user ${this.userId}`); logger.debug(
const page = this.currentPage?.context().pages()[tabInfo.index]; `Close tab ${tabInfo.index} requested for user ${this.userId}`
if (page) { );
if (tabInfo.isCurrent) { const page = this.currentPage?.context().pages()[tabInfo.index];
if (this.currentPage?.context().pages()[tabInfo.index + 1]) { if (page) {
// next tab if (tabInfo.isCurrent) {
await this.changeTab(tabInfo.index + 1); if (this.currentPage?.context().pages()[tabInfo.index + 1]) {
} else { // next tab
//previous tab await this.changeTab(tabInfo.index + 1);
await this.changeTab(tabInfo.index - 1);
}
}
await page.close();
logger.log(
'debug',
`Tab ${tabInfo.index} was closed for user ${this.userId}, new tab count: ${this.currentPage?.context().pages().length}`
);
} else { } else {
logger.log('error', `Tab index ${tabInfo.index} out of range for user ${this.userId}`); //previous tab
await this.changeTab(tabInfo.index - 1);
} }
}); }
await page.close();
logger.log(
"debug",
`Tab ${tabInfo.index} was closed for user ${
this.userId
}, new tab count: ${this.currentPage?.context().pages().length}`
);
} else {
logger.log(
"error",
`Tab index ${tabInfo.index} out of range for user ${this.userId}`
);
}
});
this.socket.on(`setViewportSize:${this.userId}`, async (data: { width: number, height: number }) => { this.socket.on(
const { width, height } = data; `setViewportSize:${this.userId}`,
logger.log('debug', `Viewport size change to width=${width}, height=${height} requested for user ${this.userId}`); async (data: { width: number; height: number }) => {
const { width, height } = data;
logger.log(
"debug",
`Viewport size change to width=${width}, height=${height} requested for user ${this.userId}`
);
// Update the browser context's viewport dynamically // Update the browser context's viewport dynamically
if (this.context && this.browser) { if (this.context && this.browser) {
this.context = await this.browser.newContext({ viewport: { width, height } }); this.context = await this.browser.newContext({
logger.log('debug', `Viewport size updated to width=${width}, height=${height} for user ${this.userId}`); viewport: { width, height },
});
logger.log(
"debug",
`Viewport size updated to width=${width}, height=${height} for user ${this.userId}`
);
}
}
);
// For backward compatibility, also register the standard events
this.socket.on(
"settings",
(settings) => (this.interpreterSettings = settings)
);
this.socket.on(
"changeTab",
async (tabIndex) => await this.changeTab(tabIndex)
);
this.socket.on("addTab", async () => {
await this.currentPage?.context().newPage();
const lastTabIndex = this.currentPage
? this.currentPage.context().pages().length - 1
: 0;
await this.changeTab(lastTabIndex);
});
this.socket.on("closeTab", async (tabInfo) => {
const page = this.currentPage?.context().pages()[tabInfo.index];
if (page) {
if (tabInfo.isCurrent) {
if (this.currentPage?.context().pages()[tabInfo.index + 1]) {
await this.changeTab(tabInfo.index + 1);
} else {
await this.changeTab(tabInfo.index - 1);
} }
}); }
await page.close();
}
});
this.socket.on(
"setViewportSize",
async (data: { width: number; height: number }) => {
const { width, height } = data;
if (this.context && this.browser) {
this.context = await this.browser.newContext({
viewport: { width, height },
});
}
}
);
// For backward compatibility, also register the standard events this.socket.on(
this.socket.on('settings', (settings) => this.interpreterSettings = settings); "extractListData",
this.socket.on('changeTab', async (tabIndex) => await this.changeTab(tabIndex)); async (data: {
this.socket.on('addTab', async () => { listSelector: string;
await this.currentPage?.context().newPage(); fields: Record<string, any>;
const lastTabIndex = this.currentPage ? this.currentPage.context().pages().length - 1 : 0; currentListId: number;
await this.changeTab(lastTabIndex); pagination: any;
});
this.socket.on('closeTab', async (tabInfo) => {
const page = this.currentPage?.context().pages()[tabInfo.index];
if (page) {
if (tabInfo.isCurrent) {
if (this.currentPage?.context().pages()[tabInfo.index + 1]) {
await this.changeTab(tabInfo.index + 1);
} else {
await this.changeTab(tabInfo.index - 1);
}
}
await page.close();
}
});
this.socket.on('setViewportSize', async (data: { width: number, height: number }) => {
const { width, height } = data;
if (this.context && this.browser) {
this.context = await this.browser.newContext({ viewport: { width, height } });
}
});
this.socket.on('extractListData', async (data: {
listSelector: string,
fields: Record<string, any>,
currentListId: number,
pagination: any
}) => { }) => {
if (this.currentPage) { if (this.currentPage) {
const extractedData = await this.extractListData( const extractedData = await this.extractListData(
this.currentPage, this.currentPage,
data.listSelector, data.listSelector,
data.fields data.fields
); );
this.socket.emit('listDataExtracted', { this.socket.emit("listDataExtracted", {
currentListId: data.currentListId, currentListId: data.currentListId,
data: extractedData data: extractedData,
}); });
} }
}); }
);
}; };
/** /**
* Subscribes the remote browser for a screencast session * Subscribes the remote browser for a screencast session
@@ -1782,8 +1834,13 @@ export class RemoteBrowser {
url: this.currentPage.url(), url: this.currentPage.url(),
userId: this.userId userId: this.userId
}); });
await this.makeAndEmitScreenshot(); if (this.isDOMStreamingActive) {
await this.subscribeToScreencast(); await this.makeAndEmitDOMSnapshot();
await this.subscribeToDOM();
} else {
await this.makeAndEmitScreenshot();
await this.subscribeToScreencast();
}
} else { } else {
logger.log('error', `${tabIndex} index out of range of pages`) logger.log('error', `${tabIndex} index out of range of pages`)
} }