show-js-error
Version:
Show a message about a js error in any browser
2 lines • 7.17 kB
JavaScript
/*! show-js-error | © 2016 Denis Seleznev | MIT License */
var showJSError={init:function(e){var t=this;this.settings=e||{},this._inited||(this._inited=!0,this._isLast=!0,this._i=0,this._buffer=[],this._onerror=function(e){t._buffer.push(e),t._isLast&&(t._i=t._buffer.length-1),t._update()},window.addEventListener?window.addEventListener("error",this._onerror,!1):(this._oldOnError=window.onerror,window.onerror=function(e,i,n,s,a){this._onerror({message:e,filename:i,lineno:n,colno:s,error:a}),"function"==typeof t._oldOnError&&t._oldOnError.apply(window,arguments)}))},destruct:function(){this._inited&&(window.addEventListener?window.removeEventListener("error",this._onerror,!1):(window.onerror=this._oldOnError||null,delete this._oldOnError),document.body&&this._container&&document.body.removeChild(this._container),this._buffer=[],this._inited=!1)},show:function(e){"undefined"!=typeof e&&this._buffer.push("object"==typeof e?e:new Error(e)),this._update(),this._show()},hide:function(){this._container&&(this._container.className=this.elemClass(""))},copyText:function(){var e=this._buffer[this._i],t=this._getDetailedMessage(e),i=document.body,n=this.elem({name:"textarea",tag:"textarea",props:{innerHTML:t},container:i});try{n.select(),document.execCommand("copy")}catch(e){alert("Copying text is not supported in this browser.")}i.removeChild(n)},elem:function(e){var t=document.createElement(e.tag||"div"),i=e.props;for(var n in i)i.hasOwnProperty(n)&&(t[n]=i[n]);return t.className=this.elemClass(e.name),e.container.appendChild(t),t},elemClass:function(e,t){var i="show-js-error";return e&&(i+="__"+e),t&&(i+=" "+i+"_"+t),i},escapeHTML:function(e){return(e||"").replace(/[&<>"'\/]/g,function(e){return{"&":"&","<":"<",">":">",'"':""","'":"'","/":"/"}[e]})},toggleDetailed:function(){var e=this._body;e&&(this._toggleDetailed?(this._toggleDetailed=!1,e.className=this.elemClass("body")):(this._toggleDetailed=!0,e.className=this.elemClass("body","detailed")))},_append:function(){var e=this;this._container=document.createElement("div"),this._container.className=this.elemClass(""),this._title=this.elem({name:"title",props:{innerHTML:this._getTitle()},container:this._container}),this._body=this.elem({name:"body",container:this._container}),this._message=this.elem({name:"message",props:{onclick:function(){e.toggleDetailed()}},container:this._body}),this.settings.helpLinks&&(this._helpLinks=this.elem({name:"help",container:this._body}),this._mdn=this.elem({tag:"a",name:"mdn",props:{target:"_blank",innerHTML:"MDN"},container:this._helpLinks}),this._stackoverflow=this.elem({tag:"a",name:"stackoverflow",props:{target:"_blank",innerHTML:"Stack Overflow"},container:this._helpLinks})),this._filename=this.elem({name:"filename",container:this._body}),this.settings.userAgent&&(this._ua=this.elem({name:"ua",container:this._body})),this.settings.additionalText&&(this._additionalText=this.elem({name:"additional-text",container:this._body})),this.elem({name:"close",props:{innerHTML:"×",onclick:function(){e.hide()}},container:this._container}),this._actions=this.elem({name:"actions",container:this._container}),this.elem({tag:"input",name:"copy",props:{type:"button",value:this.settings.copyText||"Copy",onclick:function(){e.copyText()}},container:this._actions}),this.settings.sendUrl&&(this._sendLink=this.elem({tag:"a",name:"send-link",props:{href:"",target:"_blank"},container:this._actions}),this._send=this.elem({tag:"input",name:"send",props:{type:"button",value:this.settings.sendText||"Send"},container:this._sendLink})),this._arrows=this.elem({tag:"span",name:"arrows",container:this._actions}),this._prev=this.elem({tag:"input",name:"prev",props:{type:"button",value:"←",onclick:function(){e._isLast=!1,e._i&&e._i--,e._update()}},container:this._arrows}),this._next=this.elem({tag:"input",name:"next",props:{type:"button",value:"→",onclick:function(){e._isLast=!1,e._i<e._buffer.length-1&&e._i++,e._update()}},container:this._arrows}),this._num=this.elem({tag:"span",name:"num",props:{innerHTML:this._i+1},container:this._arrows});var t=function(){document.body.appendChild(e._container)};document.body?t():document.addEventListener?document.addEventListener("DOMContentLoaded",t,!1):document.attachEvent&&document.attachEvent("onload",t)},_getDetailedMessage:function(e){for(var t=this.settings,i="object"==typeof window.screen?window.screen:{},n=i.orientation||i.mozOrientation||i.msOrientation||"",s=[["Title",e.title||this._getTitle()],["Message",this._getMessage(e)],["Filename",this._getFilenameWithPosition(e)],["Stack",this._getStack(e)],["Page url",window.location.href],["Refferer",document.referrer],["User-agent",t.userAgent||navigator.userAgent],["Screen size",[i.width,i.height,i.colorDepth].join("×")],["Screen orientation","string"==typeof n?n:n.type],["Cookie enabled",navigator.cookieEnabled]],a="",o=0;o<s.length;o++){var r=s[o];a+=r[0]+": "+r[1]+"\n"}return t.templateDetailedMessage&&(a=t.templateDetailedMessage.replace(/\{message\}/,a)),a},_getExtFilename:function(e){var t=e.filename,i=this.escapeHTML(this._getFilenameWithPosition(e));return t&&t.search(/^(https?|file):/)>-1?'<a target="_blank" href="'+this.escapeHTML(t)+'">'+i+"</a>":i},_get:function(e,t){return"undefined"!=typeof e?e:t},_getFilenameWithPosition:function(e){var t=e.filename||"";return"undefined"!=typeof e.lineno&&(t+=":"+this._get(e.lineno,""),"undefined"!=typeof e.colno&&(t+=":"+this._get(e.colno,""))),t},_getMessage:function(e){var t=e.message;return e.error&&e.error.name&&"number"in e.error&&(t=e.error.name+": "+t),t},_getStack:function(e){return e.error&&e.error.stack||e.stack||""},_getTitle:function(){return this.settings.title||"JavaScript error"},_show:function(){this._container.className=this.elemClass("","visible")},_highlightLinks:function(e){return e.replace(/(at | \(|@)(https?|file)(:.*?)(?=:\d+:\d+\)?$)/gm,function(e,t,i,n){var s=i+n;return t+'<a target="_blank" href="'+s+'">'+s+"</a>"})},_update:function(){this._appended||(this._append(),this._appended=!0);var e,t=this._buffer[this._i],i=this._getStack(t);e=i?this._highlightLinks(this.escapeHTML(i)):this._getExtFilename(t),this._title.innerHTML=this.escapeHTML(t.title||this._getTitle()),this._message.innerHTML=this.escapeHTML(this._getMessage(t)),this._filename.innerHTML=e,this._ua&&(this._ua.innerHTML=this.escapeHTML(this.settings.userAgent)),this._additionalText&&(this._additionalText.innerHTML=this.escapeHTML(this.settings.additionalText)),this._sendLink&&(this._sendLink.href=this.settings.sendUrl.replace(/\{title\}/,encodeURIComponent(this._getMessage(t))).replace(/\{body\}/,encodeURIComponent(this._getDetailedMessage(t)))),this._buffer.length>1&&(this._arrows.className=this.elemClass("arrows","visible")),this._helpLinks&&(this._mdn.href="https://developer.mozilla.org/en-US/search?q="+encodeURIComponent(t.message||t.stack||""),this._stackoverflow.href="https://stackoverflow.com/search?q="+encodeURIComponent("[js] "+(t.message||t.stack||""))),this._prev.disabled=!this._i,this._num.innerHTML=this._i+1+" / "+this._buffer.length,this._next.disabled=this._i===this._buffer.length-1,this._show()}};