How to make cloned DOM element JSON serializable
<p>I'm currently working with <a href="http://electron.atom.io/" rel="nofollow">GitHub's Electron</a> framework, and I'm trying to send a cloned DOM element from a preloaded script in a <code>webview</code> through their <a href="http://electron.atom.io/docs/v0.36.8/api/web-view-tag/#event-ipc-message" rel="nofollow">IPC messaging</a> system to my renderer process. Though, DOM elements are not able to be converted to JSON, and thus the received message is printing out an empty Object (<em><code>Object {}</code></em>). Here's my code:</p>

<p><strong>Preload.js</strong>  </p>

<pre><code>var ipc = require("electron").ipcRenderer;

function getData(element, trait){
  if(trait === "id"){
    var elem = document.getElementById(element);
  }
  else{
    var elem = document.getElementsByClass(element);
  }
  var cloned = elem.cloneNode(true);
  ipc.sendToHost("retrieve", cloned);
  console.log("sent");
}

ipc.on("incoming", function(event, initData){
  getData(initData.selected, initData.trait);
});
</code></pre>

<p><strong>Renderer.js</strong></p>

<pre><code>loader.addEventListener("ipc-message", function (e) {
  if (e.channel === "retrieve") {
    console.log(e.args[0]);   // I want this to print out the DOM object
  }
});     

loader.addEventListener("dom-ready", function() {
  console.log("loaded");    
  var x = marks.list[i];
  loader.send("incoming", x);    
  loader.openDevTools();
  i++;    
});
</code></pre>

<p>I can't just pick what I need out of the DOM, as I <strong>need</strong> everything inside the <code>initData.selected</code>'s element and it's attached CSS.</p>

<p>Is there a potential fix for this? And if not, then is there any way possible to send a DOM element between these two processes, possibly with another program or node.js module? Thanks.</p>