Отправка мыши перемещаться по вкладкам Chrome

Question

У меня есть этот код:

chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
    if (changeInfo.status === 'complete') {
        var host = tab.url;
        var reg = new RegExp("test", "gi");
        if(reg.test(host)) {
            chrome.tabs.executeScript(
                tabId,{
                    code:"$(window).on('mousemove', function(e) {var posX = e.pageX;var posY = e.pageY;console.log(posX);console.log(posY);});"
                },
                function(results) {
            });
        }
    }
});

Если я захожу на страницу, движение мыши захватывается. В консоли отображаются координаты мыши. Теперь я хотел бы отправить те же координаты мыши на другую вкладку Chrome. На другой вкладке должны быть зафиксированы координаты мыши, и этот код выше должен показывать posX и poxY в консоли. Я прошу несколько советов о том, какие функции, методы или ключевые слова, чтобы обратить внимание на это.

Answer 1

Без сервера вы можете сделать это с помощью Window.postMessage(). PostMessages позволяет общаться между двумя объектами окна.

Итак, в вашем родительском окне у вас будет что-то вроде этого:

//Window-A.html
document.onmousemove = function (e) {mousePos(e);};

var mouseX = 0;
var mouseY = 0;

function mousePos (e) {
    if (!mie) {
        mouseX = e.pageX; 
        mouseY = e.pageY;
    }
    else {
        mouseX = event.clientX + document.body.scrollLeft;
        mouseY = event.clientY + document.body.scrollTop;
    }

    document.show.mouseXField.value = mouseX;
    document.show.mouseYField.value = mouseY;

    return true;
}

var newWindow = window.open(...);
newWindow.postMessage(`x: ${mouseX}, y: ${mouseY}`, '*');

И затем в окне получения вы добавляете слушателя:

//Window-b.html
window.addEventListener("message", function (event) {
    console.log(event.data); // will log out the values from the postMessage from Window-A.html
}, false);