如何用Selenium-Webdriver JS模拟触摸左滑删除DOM元素

我有一个监听touchstart、touchend等触摸事件的HTML组件，已实现左滑删除DOM元素的功能。现需通过Selenium-Webdriver和JS编写自动化测试函数，模拟该触摸逻辑触发元素删除，但尝试多种方案均无效，求可行方法。

已尝试的方案 #

方案一：使用Selenium Actions API #

通过actions模拟滑动操作，无效果：

await driver.actions()
  .move({ origin: element })
  .press()
  .move({ x: endX, y: endY })
  .release()
  .perform();

方案二：手动触发触摸事件 #

通过executeScript直接创建并分发touchstart/touchmove/touchend事件，无效（原代码误用MouseEvent模拟触摸事件，已修正为TouchEvent但仍无效果）：

await driver.executeScript(
  `
  var element = arguments[0];
  var startX = element.getBoundingClientRect().left + window.pageXOffset;
  var startY = element.getBoundingClientRect().top + window.pageYOffset;
  var endX = startX - 100;  // 可按需调整滑动距离

  // 触发touchstart
  const touchStart = new TouchEvent('touchstart', {
    bubbles: true,
    cancelable: true,
    touches: [{ clientX: startX, clientY: startY }],
    targetTouches: [{ clientX: startX, clientY: startY }]
  });
  element.dispatchEvent(touchStart);

  // 触发touchmove
  const touchMove = new TouchEvent('touchmove', {
    bubbles: true,
    cancelable: true,
    touches: [{ clientX: endX, clientY: startY }],
    targetTouches: [{ clientX: endX, clientY: startY }]
  });
  element.dispatchEvent(touchMove);

  // 触发touchend
  const touchEnd = new TouchEvent('touchend', {
    bubbles: true,
    cancelable: true,
    touches: [],
    targetTouches: []
  });
  element.dispatchEvent(touchEnd);
  `,
  element
);

方案三：尝试废弃的触摸API #

尝试使用已被废弃的TouchActions和TouchSequence库，无效果。

方案四：ChromeOptions设置触摸模式 #

尝试通过ChromeOptions开启触摸功能，未生效。

方案五：移动端模拟选项 #

尝试添加移动端模拟配置，但系统基于Electron运行，该选项仅支持IE、Chrome、Safari、Edge、Firefox，无法适配：

const options = new Options().setMobileEmulation({mobileName: 'Nexus 5'})

方案六：第三方手势库 #

• HammerJS：执行时出现window is not defined错误，因库依赖浏览器环境
• interactJS：执行时出现document is not defined错误，代码如下：

const htmlElement = document.getElementById('element1');

interact(htmlElement)
  .draggable({
    modifiers: [
      interact.modifiers.restrictRect({
        restriction: 'parent',
        endOnly: true
      })
    ],
    listeners: {
      move(event) {
        const { dx, dy } = event;
        htmlElement.style.transform = `translate(${dx}px, ${dy}px)`;
      }
    }
  });
  
  
const swipeLeft = async (element) => {
  await driver.executeScript(`
    const target = arguments[0];

    interact(target)
      .gesturable({
        onmove: (event) => {
          const { dx, dy } = event;
          target.style.transform = 'translate(' + dx + 'px, ' + dy + 'px)';
        },
        onend: () => {
          target.style.transform = 'translate(0, 0)';
        }
      })
      .fire({
        type: 'gesturemove',
        deltaX: -100,
        deltaY: 0
      })
      .fire({ type: 'gestureend' });
  `, element);
};

const element = await driver.findElement(By.id('element1'));
await swipeLeft(element);

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