JSFiddle - React, Tailwind, and code Playground

HTML

<input id="abrirPopUp" type="button" value="Abrir PopUp" />

<template id="tmplPopUp">
  <div>
    <label>
      Label 01:
      <input id="label01" type="text" />
    </label>
  </div>
  <div>
    <label>
      Label 02:
      <input id="label02" type="text" />
    </label>
  </div>
  <div>
    <label>
      <input id="enviar" type="button" value="Enviar" />
    </label>
  </div>
</template>

JavaScript

var tmplPopUp = document.getElementById("tmplPopUp");
var abrirPopUp = document.getElementById("abrirPopUp");

abrirPopUp.addEventListener("click", function () {
  var blobPopUp = new Blob([tmplPopUp.innerHTML], { type: 'text/html' });
  var urlPopUp = URL.createObjectURL(blobPopUp);
  var popUp = window.open(urlPopUp, "", "width=350, height=300");

  popUp.addEventListener("load", function (event) {   
    var label1 = popUp.document.getElementById("label01");
    var label2 = popUp.document.getElementById("label02");
    var enviar = popUp.document.getElementById("enviar");      

    enviar.addEventListener("click", function () {
      console.log("button!!");
    });
  });  
});

function btn(){
	alert("btn!");
}