Pull react into the page

inject-react.js

(function(inj){ 
    inj('https://unpkg.com/react@16/umd/react.development.js').then(()=>inj('https://unpkg.com/react-dom@16/umd/react-dom.development.js')).then(()=>inj('https://unpkg.com/[email protected]/babel.min.js')).then(function(){ 
var out=document.createElement("div");out.id='testing';
document.body.appendChild(out)
console.log('loaded babel')
Babel.registerPlugin('eval_wrapper', function eval_wrapper() { return {visitor: {
  FunctionDeclaration(path) {
    console.log('a func')
  //  debugger
  },
  ClassDeclaration(path) {
  console.log('a class')
   // debugger
  }}}});
  console.log('injected plugin')
eval(Babel.transform(`
function CustomTextInput(props) {
  return (
    <div>
      <input ref={props.inputRef} />
    </div>
  );
}

function Parent(props) {
  return (
    <div>
      My input: <CustomTextInput inputRef={props.inputRef} />
    </div>
  );
}

class Grandparent extends React.Component {
  constructor(props) {
    super(props);
    this.inputElement = React.createRef();
  }
  render() {
    return (
      <Parent inputRef={this.inputElement} />
    );
  }
}

    ReactDOM.render(
            <Grandparent/>,
            document.getElementById('testing')
          );
    `,{presets: ["react"], plugins:['eval_wrapper']}).code) //"es2015",

})
})((src)=>new Promise(function(c,d){var a=document.createElement("script");a.src=src;a.type="text/javascript";a.onload=c;a.onerror=d;document.head.appendChild(a)}))