Selenium Java moveToElement在Chrome正常，headless模式下canvas悬停失效

失效核心原因 #

Headless Chrome默认使用旧版渲染逻辑，设备像素比、视口坐标计算规则和桌面版Chrome存在差异，即使手动设置窗口尺寸，元素实际渲染坐标仍可能存在缩放偏移，导致Actions类的坐标计算失效。

修复步骤 #

• 优先切换新版Headless模式，配置启动参数对齐桌面版Chrome行为

  ChromeOptions options = new ChromeOptions();
  // 采用新版Headless模式，交互逻辑与桌面版Chrome完全一致
  options.addArguments("--headless=new");
  // 启动前预设窗口尺寸，避免启动后修改尺寸带来的坐标计算偏差
  options.addArguments("--window-size=1296,696");
  // 强制设备像素比为1，禁用高DPI缩放
  options.addArguments("--force-device-scale-factor=1");
  options.addArguments("--high-dpi-support=1");
  

• 优化元素坐标计算逻辑，确保元素在视口范围内

  WebElement canvas = driver.findElement(By.xpath(canvasElementXpath));
  // 滚动到canvas居中显示，排除元素不在视口导致的坐标偏移
  ((JavascriptExecutor)driver).executeScript("arguments[0].scrollIntoView({block: 'center', inline: 'center'})", canvas);
  // 采用getRect获取元素完整坐标与尺寸，覆盖getSize仅返回宽高的局限性
  Rectangle canvasRect = canvas.getRect();
  int canvas_center_x = canvasRect.getWidth()/2;
  int canvas_center_y = canvasRect.getHeight()/2;
  int mouse_hover_x = (canvas_center_x/-9)*2;
  int mouse_hover_y = (canvas_center_y/-9)*2;
  

• 若Actions类仍不生效，改用JS直接注入鼠标事件，兼容性更强

  String hoverScript = "const canvas = arguments[0];" +
      "const offsetX = arguments[1];" +
      "const offsetY = arguments[2];" +
      "const rect = canvas.getBoundingClientRect();" +
      // 触发mouseover事件
      "canvas.dispatchEvent(new MouseEvent('mouseover', {bubbles: true, clientX: rect.left + offsetX, clientY: rect.top + offsetY}));" +
      // 触发mousemove事件完成悬停定位
      "canvas.dispatchEvent(new MouseEvent('mousemove', {bubbles: true, clientX: rect.left + offsetX, clientY: rect.top + offsetY}));";
  ((JavascriptExecutor)driver).executeScript(hoverScript, canvas, mouse_hover_x, mouse_hover_y);
  

注意：已废弃的旧版--headless无参模式存在大量交互兼容性问题，所有模拟用户操作的场景都建议替换为新版--headless=new模式。

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