2025-12-04 13:14:02 +00:00
|
|
|
<!doctype html>
|
2019-05-31 15:56:07 +00:00
|
|
|
<html>
|
2025-12-04 13:14:02 +00:00
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
<title>Zone.js Basic Demo</title>
|
|
|
|
|
<link rel="stylesheet" href="css/style.css" />
|
|
|
|
|
<script src="../dist/zone.js"></script>
|
|
|
|
|
<script src="../dist/long-stack-trace-zone.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<h1>Basic Example</h1>
|
|
|
|
|
|
|
|
|
|
<button id="b1">Bind Error</button>
|
|
|
|
|
<button id="b2">Cause Error</button>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
/*
|
|
|
|
|
* This is a simple example of async stack traces with zones
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
function main() {
|
|
|
|
|
b1.addEventListener('click', bindSecondButton);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* What if your stack trace could tell you what
|
|
|
|
|
* order the user pushed the buttons from the stack trace?
|
|
|
|
|
*
|
|
|
|
|
* What if you could log this back to the server?
|
|
|
|
|
*
|
|
|
|
|
* Think of how much more productive your debugging could be!
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
function bindSecondButton() {
|
|
|
|
|
b2.addEventListener('click', throwError);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function throwError() {
|
|
|
|
|
throw new Error('aw shucks');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* Bootstrap the app
|
|
|
|
|
*/
|
|
|
|
|
//main();
|
|
|
|
|
Zone.current
|
|
|
|
|
.fork({
|
|
|
|
|
onHandleError: function (parentZoneDelegate, currentZone, targetZone, error) {
|
|
|
|
|
console.log(error.stack);
|
2025-12-16 00:23:55 +00:00
|
|
|
},
|
2025-12-04 13:14:02 +00:00
|
|
|
})
|
|
|
|
|
.fork(Zone.longStackTraceZoneSpec)
|
|
|
|
|
.run(main);
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
