diff --git a/server/src/browser-management/inputHandlers.ts b/server/src/browser-management/inputHandlers.ts index 602807ae..da48f4fd 100644 --- a/server/src/browser-management/inputHandlers.ts +++ b/server/src/browser-management/inputHandlers.ts @@ -718,6 +718,8 @@ const handleKeyboardAction = async ( } const generator = activeBrowser.generator; + + await page.press(data.selector, data.key); await generator.onDOMKeyboardAction(page, data); logger.log( "debug", diff --git a/src/components/recorder/DOMBrowserRenderer.tsx b/src/components/recorder/DOMBrowserRenderer.tsx index 09df5a34..e409ff64 100644 --- a/src/components/recorder/DOMBrowserRenderer.tsx +++ b/src/components/recorder/DOMBrowserRenderer.tsx @@ -611,19 +611,34 @@ export const DOMBrowserRenderer: React.FC = ({ if (!isInCaptureMode && socket && snapshot?.baseUrl) { const iframe = iframeRef.current; if (iframe) { - const iframeRect = iframe.getBoundingClientRect(); - const iframeX = lastMousePosition.x - iframeRect.left; - const iframeY = lastMousePosition.y - iframeRect.top; + const focusedElement = iframeDoc.activeElement as HTMLElement; + let coordinates = { x: 0, y: 0 }; + + if (focusedElement && focusedElement !== iframeDoc.body) { + // Get coordinates from the focused element + const rect = focusedElement.getBoundingClientRect(); + coordinates = { + x: rect.left + rect.width / 2, + y: rect.top + rect.height / 2 + }; + } else { + // Fallback to last mouse position if no focused element + const iframeRect = iframe.getBoundingClientRect(); + coordinates = { + x: lastMousePosition.x - iframeRect.left, + y: lastMousePosition.y - iframeRect.top + }; + } const selector = clientSelectorGenerator.generateSelector( iframeDoc, - { x: iframeX, y: iframeY }, + coordinates, ActionType.Keydown ); const elementInfo = clientSelectorGenerator.getElementInformation( iframeDoc, - { x: iframeX, y: iframeY }, + coordinates, clientSelectorGenerator.getCurrentState().listSelector, clientSelectorGenerator.getCurrentState().getList );