MouseEvent 对象的 x 和 y 值在某些站点上与调试器 API 调度的 x 和 y 值不同

Question

我正在使用Chrome 的调试器 API将点击事件从扩展程序的后台脚本发送到页面。这是我用来调度事件的代码

背景.js

x=50
y=50
//tabId=<id>    //Add the tab's id to a tabId variable
mousePressedOptions={type:"mousePressed",x,y,button:"left",clickCount:1}
mouseReleasedOptions={type:"mouseReleased",x,y,button:"left",clickCount:1}

sendCommand(tabId,mousePressedOptions,sendCommand.bind(null,tabId,mouseReleasedOptions))

function sendCommand(tabId,options,callback=function(){}){
    chrome.debugger.sendCommand({tabId},
        "Input.dispatchMouseEvent",
        options,
        callback)
}

正如您所看到的，我正在点 (x=50,y=50) 上调度事件。然后在我的页面中，我在窗口对象上设置了一个简单的点击监听器，它只记录 (x,y) 坐标

索引.html

 function handleClick(e){
    console.log(e.x,e.y)
 }

window.addEventListener("click",handleClick)

当我在本地测试时，控制台记录的 (x,y) 值与我用来调度事件的值相同，这正是您所期望的。但是，当我在实际网站上对此进行测试时，其中一些会显示不同的结果，尤其是 google、facebook 和 reddit。

当我访问 google.com 并将 handleClick 代码注入 devtools 控制台窗口时，我得到 (45,45) 而不是 (50,50)。在不同的坐标上测试它们似乎总是偏离 9.1%，四舍五入到最接近的整数。因此，如果我在 (100,200) 上调度，页面将显示 (90,181)，对于 (400,1000)，它将显示 (363,909)，依此类推。这个问题只发生在某些网站上，而不是我提到的所有网站上。但奇怪的是，显示错误值的站点都以相同的百分比关闭。因此，对于在 (50,50) 上调度的事件，它将在 google、reddit、facebook...等上显示相同的错误值 (45,45)。

那么是什么导致调试器发送的值与事件对象接收的值之间存在这种差异呢？我应该考虑什么价值而我没有？

谢谢你。