升级至Selenium 4后悬停操作失效，求偏移悬停优化方案

问题背景 #

将Selenium从3版本升级至4版本后，以下带偏移量的鼠标悬停代码无法正常执行：

public void mouseMoveToRightEdge(Element element) {
        executeAction(element, new EventType(EventType.Message.ACTION_HOVER), (by, failedEx) -> {
            WebElement webElement = driverServices.getDriver().findElement(by);
            Dimension d = webElement.getSize();

            int xOffset = d.width - 2; //Works on remote running (maven/selenoid) only when reducing 2 pixels
            int yOffset = d.height / 2;

            org.openqa.selenium.interactions.Actions builder = new org.openqa.selenium.interactions.Actions(driverServices.getDriver());
            org.openqa.selenium.interactions.Actions hoverOverRightEdge = builder.moveToElement(webElement, xOffset, yOffset);
            hoverOverRightEdge.perform();
            return true;
        });
    }

核心原因：Selenium 4 的偏移量计算差异 #

Selenium 4 完全遵循W3C WebDriver 规范，而 Selenium 3 部分实现基于旧的非标准协议，两者在偏移量计算上存在关键区别：

• 在W3C规范中，moveToElement(WebElement, xOffset, yOffset)的偏移量是相对于元素左上角的像素坐标，且元素的getSize()返回的尺寸包含边框（border）、内边距（padding）和内容区域。如果元素存在边框，直接使用d.width计算偏移会导致鼠标超出元素的可交互区域。
• 远程环境（如Selenoid）中，浏览器默认缩放比例可能不为1:1，进一步放大了尺寸计算的偏差，这也是之前减2像素能临时生效的原因。

Selenium 4 中更优的实现方式 #

1. 优化Actions链式调用（推荐） #

Selenium 4 简化了Actions类的使用，支持流畅链式调用，同时调整偏移量以适配元素边框：

public void mouseMoveToRightEdge(Element element) {
    executeAction(element, new EventType(EventType.Message.ACTION_HOVER), (by, failedEx) -> {
        WebElement webElement = driverServices.getDriver().findElement(by);
        // 使用clientWidth获取元素内容+padding的宽度（不含边框）
        int elementWidth = (int) ((Long) ((JavascriptExecutor) driverServices.getDriver()).executeScript("return arguments[0].clientWidth;", webElement));
        int elementHeight = webElement.getSize().height;
        
        int xOffset = elementWidth - 1; // 偏移至右边缘内侧1像素
        int yOffset = elementHeight / 2;

        new Actions(driverServices.getDriver())
            .moveToElement(webElement, xOffset, yOffset)
            .perform();
        return true;
    });
}

2. 基于元素中心的相对偏移 #

如果目标是悬停在右边缘中心，可以先定位到元素中心，再向右偏移，避免边框干扰：

public void mouseMoveToRightEdge(Element element) {
    executeAction(element, new EventType(EventType.Message.ACTION_HOVER), (by, failedEx) -> {
        WebElement webElement = driverServices.getDriver().findElement(by);
        Dimension d = webElement.getSize();
        
        new Actions(driverServices.getDriver())
            .moveToElement(webElement) // 先定位到元素中心
            .moveByOffset((d.width / 2) - 1, 0) // 从中心向右偏移至接近右边缘
            .perform();
        return true;
    });
}

3. 备选方案：使用JavascriptExecutor模拟悬停 #

当Actions类方法失效时，直接通过JS触发鼠标悬停事件，兼容性更强：

public void mouseMoveToRightEdge(Element element) {
    executeAction(element, new EventType(EventType.Message.ACTION_HOVER), (by, failedEx) -> {
        WebElement webElement = driverServices.getDriver().findElement(by);
        Dimension d = webElement.getSize();
        Point location = webElement.getLocation();
        
        // 计算右边缘中心的绝对坐标
        int absoluteX = location.getX() + d.width - 1;
        int absoluteY = location.getY() + d.height / 2;
        
        JavascriptExecutor js = (JavascriptExecutor) driverServices.getDriver();
        // 触发精确位置的mouseover事件
        js.executeScript("""
            var target = document.elementFromPoint(arguments[0], arguments[1]);
            if(target) {
                var event = new MouseEvent('mouseover', {
                    bubbles: true,
                    cancelable: true,
                    clientX: arguments[0],
                    clientY: arguments[1]
                });
                target.dispatchEvent(event);
            }
        """, absoluteX, absoluteY);
        return true;
    });
}

关键排查要点 #

• 验证元素实际尺寸：用浏览器开发者工具查看元素的clientWidth、offsetWidth，确认代码中使用的尺寸是否匹配元素可交互区域。
• 强制远程浏览器缩放：在Selenoid启动参数中添加--force-device-scale-factor=1，避免缩放导致的像素偏差。
• 确认元素状态：悬停前调用webElement.isDisplayed()和webElement.isEnabled()，确保元素处于可交互状态。

内容的提问来源于stack exchange，提问作者Eugen FLOCEA