如何让浏览器识别人工PointerEvent的ID以支持setPointerCapture？

我正在开发一款浏览器扩展，通过dispatchEvent触发人工PointerEvent注入页面，代码如下：

function myCreatePointerEvent(pointerId, isPrimary, screenX, screenY, clientX, clientY, pageX, pageY) {
    var target = document.elementFromPoint(clientX, clientY);
    var pointerData = {pointerId: pointerId,
                       isPrimary: isPrimary,
                       pointerType: "touch",
                       button: 1,
                       bubbles: true,
                       screenX: screenX,
                       screenY: screenY,
                       clientX: clientX,
                       clientY: clientY,
                       pageX: pageX,
                       pageY: pageY};
   target.dispatchEvent(new PointerEvent("pointerdown", pointerData));
}

我希望这些人工事件的行为尽可能贴近鼠标或触摸屏产生的原生指针事件，目前正尝试让setPointerCapture功能生效。但Chrome和Firefox调用该方法时均会报错：“No active pointer with the given id is found” / “Invalid pointer id”。

除了通过猴子补丁修改setPointerCapture/releasePointerCapture/hasPointerCapture来实现外，是否有其他方法能让Chrome或Firefox识别这些人工指针事件的ID？

浏览器的指针事件系统会维护一个内部活跃指针ID列表，只有原生输入设备触发的事件才会被纳入这个列表，人工构造的PointerEvent默认不会被标记为“活跃指针”，这是setPointerCapture报错的核心原因。除猴子补丁外，有以下几种可行思路：

1. 使用浏览器调试协议注入事件（推荐） #

Chromium系浏览器（Chrome/Edge）的Chrome DevTools协议（CDP）、Firefox的Remote Debugging Protocol，支持通过调试接口注入原生级别的指针事件。这类事件会被浏览器完全识别为原生输入，系统会自动维护指针ID的活跃状态，setPointerCapture可以正常工作。

示例（Chrome扩展中使用CDP）： #

需要在扩展权限中申请debugger权限，然后通过chrome.debuggerAPI发送命令：

// 假设已获取目标tab的tabId
chrome.debugger.sendCommand({tabId: tabId}, "Input.dispatchPointerEvent", {
  type: "pointerDown",
  pointerId: pointerId,
  isPrimary: isPrimary,
  pointerType: "touch",
  button: 1,
  screenX: screenX,
  screenY: screenY,
  clientX: clientX,
  clientY: clientY,
  pageX: pageX,
  pageY: pageY
});
// 后续可发送pointerMove、pointerUp等事件完成生命周期

这种方式的优势是完全模拟原生事件，所有指针相关API都能正常工作，但需要处理调试连接的逻辑，且不同浏览器的调试协议细节略有差异。

2. 模拟完整触摸事件流（兼容但有局限） #

部分浏览器仍兼容已废弃的createTouch/createTouchEventAPI，通过构造触摸事件触发对应的PointerEvent，系统会自动维护指针状态：

var touch = document.createTouch(window, target, pointerId, screenX, screenY, clientX, clientY, pageX, pageY);
var touchStartEvent = document.createTouchEvent("touchstart", {
  touches: [touch],
  targetTouches: [touch],
  changedTouches: [touch]
});
target.dispatchEvent(touchStartEvent);

但该API已被标准废弃，存在兼容性风险，不推荐在生产环境使用。

3. 补充完整指针事件生命周期（无法彻底解决） #

浏览器认定指针活跃需要完整的pointerdown→pointermove→pointerup/pointercancel事件流，且属性要匹配原生行为：

• 使用大于1000的pointerId，避免与原生指针ID冲突
• 严格按照顺序触发事件流
  但这种方式无法绕过isTrusted属性的限制（人工事件的isTrusted为false，原生事件为true），浏览器内部的指针状态逻辑仍会区分二者，setPointerCapture依然无法正常生效，仅能模拟部分事件行为。

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