tiny-console.js

(function(c,b,cs,r,d){
  b.frameBorder=0;
  b.style = 'position:fixed;bottom:0;left:0;width:100%;height:30vh;background:#fff;border-top:4px solid #bbb;box-shadow:0 0 2px #000;z-index:999;cursor:ns-resize;';
  b.onpointerdown=function(e){b.setPointerCapture(e.pointerId);b.e=e;b.h=b.offsetHeight-4;b.style.borderTopColor='#59f'}
  b.onpointermove=function(e){if(b.e)b.style.height=(b.h-e.y+b.e.y)+'px'}
  b.onpointerup=function(){b.e=null;b.style.borderTopColor='#aaa'}
  document.documentElement.appendChild(b);
  (d=b.contentWindow.document).open();
  d.write('<style>html,body{width:100%;height:100%;overflow:hidden;font:12px/1.2 system-ui,sans-serif;flex:1;display:flex;flex-direction:column;margin:0;}*{box-sizing:border-box;}button{font:inherit;}pre{margin:0;padding:4px;border-bottom:1px solid #ddd;}</style><div style="background:#ddd;border-bottom:1px solid #ccc;display:flex;padding:3px 5px 4px;align-items:center;"><div style="color:#555;flex:1;">Console</div><button onclick="console.clear()">clear</button></div><div style="flex:1;width:100%;overflow:auto;"></div><input style="border:0;outline:none;border-top:1px solid #ccc;padding:5px;font:1em monospace;" placeholder="repl">');
  d.close();
  r=d.body.lastChild.previousSibling;
  r.nextSibling.onkeydown=function(e,v){if(e.keyCode==13){e.preventDefault();v=this.value;this.value='';v&&console.log((0,eval)(v))}}
  if (typeof c=='undefined') self.console=c={log(){},info(){},error(){},clear(){}};
  for (var i in console) {
    cs[i] = console[i] = function(i, o) {
      return function() {
        if (i=='clear') r.textContent = '';
        else {
          var d = document.createElement('pre');
          d.style = i=='error'?'color:red;background:#fee;':i=='warn'?'color:yellow;background:#ffe;':'';
          d.textContent = [].join.call(arguments, ' ');
          r.appendChild(d);
          r.scrollTop = 9999999;
        }
        return o.apply(this, arguments);
      };
    }(i, console[i]);
  }
  addEventListener('error',function(e){cs.error(e.error)},true);
  addEventListener('unhandledrejection',function(e){cs.error(e.reason)},true);
}(self.console,document.createElement('iframe'),{}))