fix(helpers): scroll element into view in moveCursorTo (#5715)

moveCursorTo moved the mouse to the element's center coordinates without
scrolling first. For an element outside the viewport the cursor landed
off-screen and no hover fired, with no error.

Playwright now calls scrollIntoViewIfNeeded() before reading the point.
Puppeteer scrolls the element to the center when it is not fully in the
viewport, the same check its own ElementHandle.hover() performs, using
public API only. WebDriver needs no change: WebdriverIO's moveTo already
scrolls into view.


Claude-Session: https://claude.ai/code/session_01VmYyNa6z4o3hxPkdpDiUmB

Co-authored-by: DavertMik <davert@testomat.io>
Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: 3 people

lib/helper/Playwright.js

@@ -1525,6 +1525,7 @@ class Playwright extends Helper {
       assertElementExists(el, locator)
     }
 
+    await el.scrollIntoViewIfNeeded()
     // Use manual mouse.move instead of .hover() so the offset can be added to the coordinates
     const { x, y } = await clickablePoint(el)
     await this.page.mouse.move(x + offsetX, y + offsetY)

lib/helper/Puppeteer.js

@@ -845,6 +845,9 @@ class Puppeteer extends Helper {
       }
     }
 
+    if (!(await el.isIntersectingViewport({ threshold: 1 }))) {
+      await el.evaluate(el => el.scrollIntoView({ block: 'center', inline: 'center' }))
+    }
     // Use manual mouse.move instead of .hover() so the offset can be added to the coordinates
     const { x, y } = await getClickablePoint(el)
     await this.page.mouse.move(x + offsetX, y + offsetY)

test/data/app/view/form/hover.php

@@ -7,5 +7,8 @@
 
 <div id="show"></div>
 
+<div id="offscreen_show"></div>
+<span id="offscreen_hover" style="display: inline-block; margin-top: 2000px" onmouseover="document.getElementById('offscreen_show').innerText = 'Hovered offscreen!'">Hover me too!</span>
+
 </body>
 </html>

test/helper/Playwright_test.js

@@ -395,6 +395,18 @@ describe('Playwright', function () {
       I.amOnPage('/form/hover')
         .then(() => I.moveCursorTo('#hover', 'body'))
         .then(() => I.see('Hovered', '#show')))
+
+    it('should scroll element into view before hovering', async () => {
+      await I.amOnPage('/form/hover')
+      await I.moveCursorTo('#offscreen_hover')
+      await I.see('Hovered offscreen', '#offscreen_show')
+    })
+
+    it('should scroll element into view before hovering within a context', async () => {
+      await I.amOnPage('/form/hover')
+      await I.moveCursorTo('#offscreen_hover', 'body')
+      await I.see('Hovered offscreen', '#offscreen_show')
+    })
   })
 
   describe('#switchToNextTab, #switchToPreviousTab, #openNewTab, #closeCurrentTab, #closeOtherTabs, #grabNumberOfOpenTabs, #waitForNumberOfTabs', () => {

test/helper/Puppeteer_test.js

@@ -245,6 +245,18 @@ describe('Puppeteer', function () {
       I.amOnPage('/form/hover')
         .then(() => I.moveCursorTo('#hover', 'body'))
         .then(() => I.see('Hovered', '#show')))
+
+    it('should scroll element into view before hovering', async () => {
+      await I.amOnPage('/form/hover')
+      await I.moveCursorTo('#offscreen_hover')
+      await I.see('Hovered offscreen', '#offscreen_show')
+    })
+
+    it('should scroll element into view before hovering within a context', async () => {
+      await I.amOnPage('/form/hover')
+      await I.moveCursorTo('#offscreen_hover', 'body')
+      await I.see('Hovered offscreen', '#offscreen_show')
+    })
   })
 
   describe('#switchToNextTab, #switchToPreviousTab, #openNewTab, #closeCurrentTab, #closeOtherTabs, #grabNumberOfOpenTabs, #waitForNumberOfTabs', () => {