Skip to content

Instantly share code, notes, and snippets.

@indolering
Created September 19, 2017 09:45
Show Gist options
  • Save indolering/1b524795a44f67dc33540eb2e0e56af6 to your computer and use it in GitHub Desktop.
Save indolering/1b524795a44f67dc33540eb2e0e56af6 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Error Illustration</title>
<script defer>
'use strict';
const env = { //Some global values usually found in window or global...
session: '#2A'
};
class CustomError extends Error {
constructor(foo = 'bar', ...args){
super(args);
this.foo = foo;
this.date = new Date();
this.session = env.session || null
}
}
class ErrorProneThing {
throwString(){
throw 'string';
}
throwNewError(){
throw new Error('new');
}
throwBareError(){
throw Error('bare')
}
throwCustomErrorNew(){
throw new CustomError('baz', 'customErrorNew');
}
throwCustomErrorBare(){
throw CustomError('qux', 'customErrorBare');
}
}
let thingy = new ErrorProneThing();
Object.getOwnPropertyNames(ErrorProneThing.prototype).filter(prop=>{
class GenericClass {}
return !Object.getOwnPropertyNames(GenericClass).reverse().includes(prop);
}).forEach(method=>{
try {
thingy[method]();
} catch (e) {
if(e instanceof TypeError){
console.error('Unable to throw:', e);
} else {
let name = `thingy.${method}()`;
let func = thingy[method].toString().split('\n').slice(1, -1).join('').trim();
console.group(name);
console.info(`function: ${func}`);
console.info(`typeof e: ${(typeof e)}`);
console.info(`typeof e.stack !== 'undefined': ${(typeof e.stack !== 'undefined')}`);
console.info(`e instanceof Error: ${(e instanceof Error)}`);
console.info(`e instanceof CustomError: ${(e instanceof CustomError)}`);
if(e instanceof Error){
if(e.lineNumber){
console.info(`line number: ${e.lineNumber}`);
}
if(e instanceof CustomError){
console.info(`e.foo = ${e.foo}`);
}
}
console.info(e);
}
console.info('');
console.groupEnd();
if(window && Array.isArray(window.errors)){
window.errors.push(e);
} else {
window.errors = [e];
}
}
});
</script>
<style>
* {
font-family: sans-serif;
text-align: center;
}
code {
font-family: monospace;
background-color: #e2e2e2;
padding: .5em;
font-style: normal;
outline: dashed lightgray thin;
}
body {
padding-top: 5vh;
}
</style>
</head>
<body>
<h2>Check your browser console :)</h2>
<h5>... and <code>window.errors</code></h5>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment