From b6fba9d66dd56d3aa66899d6974eee55ce0d09e9 Mon Sep 17 00:00:00 2001
From: Richard Hansen <rhansen@rhansen.org>
Date: Mon, 2 Aug 2021 18:45:36 -0400
Subject: [PATCH] Pad: Improve page load error handler

  * Install the error handler early.
  * Include stack trace.
  * Remove unnecessary escaping.
  * Improve formatting.
  * Move to a separate script file.
---
 src/static/js/basic_error_handler.js | 48 ++++++++++++++++++++++++++++
 src/templates/pad.html               | 22 +------------
 2 files changed, 49 insertions(+), 21 deletions(-)
 create mode 100644 src/static/js/basic_error_handler.js

diff --git a/src/static/js/basic_error_handler.js b/src/static/js/basic_error_handler.js
new file mode 100644
index 000000000..ab400aa8a
--- /dev/null
+++ b/src/static/js/basic_error_handler.js
@@ -0,0 +1,48 @@
+// @license magnet:?xt=urn:btih:8e4f440f4c65981c5bf93c76d35135ba5064d8b7&dn=apache-2.0.txt Apache-2.0
+
+/* Copyright 2021 Richard Hansen <rhansen@rhansen.org> */
+
+'use strict';
+
+// Set up an error handler to display errors that happen during page load. This handler will be
+// overridden with a nicer handler by setupGlobalExceptionHandler() in pad_utils.js.
+
+(() => {
+  const originalHandler = window.onerror;
+  window.onerror = (...args) => {
+    const [msg, url, line, col, err] = args;
+
+    // Purge the existing HTML and styles for a consistent view.
+    document.body.textContent = '';
+    for (const el of document.querySelectorAll('head style, head link[rel="stylesheet"]')) {
+      el.remove();
+    }
+
+    const box = document.body;
+    box.textContent = '';
+    const summary = document.createElement('p');
+    box.appendChild(summary);
+    summary.appendChild(document.createTextNode('An error occurred while loading the page:'));
+    const msgBlock = document.createElement('blockquote');
+    box.appendChild(msgBlock);
+    msgBlock.style.fontWeight = 'bold';
+    msgBlock.appendChild(document.createTextNode(msg));
+    const loc = document.createElement('p');
+    box.appendChild(loc);
+    loc.appendChild(document.createTextNode(`in ${url}`));
+    loc.appendChild(document.createElement('br'));
+    loc.appendChild(document.createTextNode(`at line ${line}:${col}`));
+    const stackSummary = document.createElement('p');
+    box.appendChild(stackSummary);
+    stackSummary.appendChild(document.createTextNode('Stack trace:'));
+    const stackBlock = document.createElement('blockquote');
+    box.appendChild(stackBlock);
+    const stack = document.createElement('pre');
+    stackBlock.appendChild(stack);
+    stack.appendChild(document.createTextNode(err.stack || err.toString()));
+
+    if (typeof originalHandler === 'function') originalHandler(...args);
+  };
+})();
+
+// @license-end
diff --git a/src/templates/pad.html b/src/templates/pad.html
index 43120fd67..bcede8fd3 100644
--- a/src/templates/pad.html
+++ b/src/templates/pad.html
@@ -33,6 +33,7 @@
     for the JavaScript code in this page.|
     */
   </script>
+  <script src="../static/js/basic_error_handler.js?v=<%=settings.randomVersionString%>"></script>
 
   <meta charset="utf-8">
   <meta name="robots" content="noindex, nofollow">
@@ -441,27 +442,6 @@
   <% e.begin_block("scripts"); %>
 
   <script type="text/javascript" src="../static/js/require-kernel.js?v=<%=settings.randomVersionString%>"></script>
-
-  <script type="text/javascript">
-      // @license magnet:?xt=urn:btih:8e4f440f4c65981c5bf93c76d35135ba5064d8b7&dn=apache-2.0.txt
-      (function() {
-        // Display errors on page load to the user
-        // (Gets overridden by padutils.setupGlobalExceptionHandler)
-        const originalHandler = window.onerror;
-        window.onerror = function(msg, url, line) {
-          const box   = document.getElementById('editorloadingbox');
-          const cleanMessage = msg.replace(/[^0-9a-zA-Z=\.?&:\/]+/,'');
-          const cleanSource = url.replace(/[^0-9a-zA-Z=\.?&:\/]+/,'');
-          const cleanLine = parseInt(line);
-          box.innerText = `An error occurred while loading the pad\n${cleanMessage} in
-            ${cleanSource} at line ${cleanLine}`
-          // call original error handler
-          if(typeof(originalHandler) == 'function') originalHandler.call(null, arguments);
-        };
-      })();
-      // @license-end
-  </script>
-
   <script type="text/javascript" src="../socket.io/socket.io.js?v=<%=settings.randomVersionString%>"></script>
 
   <!-- Include base packages manually (this help with debugging) -->