Я пишу расширение Chrome. Мне нужно передать объект элемента из скрипта содержимого в фоновый скрипт.

Цель:
Расширение о записи и воспроизведении действий пользователя.
Данные сохраняются в локальном хранилище расширения на разных объектах для каждой вкладки (по идентификатору вкладки).
Структура данных представляет собой список{x: x, y:y, element: element}
Когда пользователь хочет воспроизвести, я использую цикл для каждого объекта в списке и использую.click() на элементе

Код в содержании скрипта:

Функция, которая отправляет сообщение в фоновый скрипт:

function addToEventHistory(cords) {
    console.log(cords)
    chrome.runtime.sendMessage({action: "addToEventHistory", cords: cords}, function(response) {
        return response;
    });
}

Функция, которая получает элемент и чувствует его:

mouseClick: function(e) {
                var target = e.target || e.srcElement
                var clickEvent = {x: e.pageX, y: e.pageY, element: target}
                addToEventHistory(clickEvent)
            }

Код в фоновом скрипте:

var tabId = sender.tab.id;
var existingRecords = JSON.parse(localStorage.getItem('record_'+tabId)) || [];
existingRecords.push(request.cords)
console.log(request.cords)
localStorage.setItem('record_'+tabId, JSON.stringify(existingRecords));
sendResponse();

Проблема в том, что отправляемый мной элемент получен как пустой объект. уведомление дляconsole.log на отправку и получение. выходы:

отправка:

Object {x: 1205, y: 1067, element: div#content.snippet-hidden}

прием:

Object {x: 1205, y: 1067, element: Object}

* элемент Object пуст и имеет только_proto_

Какова причина?
Как я могу решить эту проблему?

Похоже, что проблема не в том, чтобы сериализовать объект DOM, потому что объект выглядит нормально перед отправкой, а не при получении.