Estoy tratando de usar Polymer en una extensión de Chrome. El objetivo general es aprovechar la encapsulación de estilo para que mis scripts de contenido se ejecuten aislados del CSS de la página que se visita.

Comenzando con un elemento personalizado en my-element.html

Estoy usando Vulcanize así:

vulcanize -o build.html my-element.html

Si intento algo como esto en mi script de contenido:

// content_script.js
$.get(chrome.extension.getURL('build.html'), function(data) {
  var html = document.createElement('div');
  html.innerHTML = data;
  document.body.appendChild(html);

  var custom = document.createElement('my-element');
  document.body.appendChild(custom);
});

build.html se carga bien, pero my-element no funciona. Simplemente crea una etiqueta vacía con ninguno de mis contenidos DOM de sombra.

Veo un par de posibles problemas con lo que estoy haciendo:

Estoy cargando el material de polímero en un div. ¿Necesita cargarse directamente en el cuerpo? Si es así, ¿cómo se hace?Supongo que cargar build.html con ajax funcionará en primer lugar. ¿Es esta una suposición incorrecta?