From 8463134125160f1b1ec72d0d02f7932cb953d294 Mon Sep 17 00:00:00 2001
From: Richard Hansen <rhansen@rhansen.org>
Date: Mon, 19 Oct 2020 20:25:08 -0400
Subject: [PATCH] pad: Improve rendering of uncaught exceptions

  * Use jQuery to build the message HTML so that special characters in
    the error message, URL, etc. are properly escaped. This helps
    avoid XSS vulnerabilities.
  * Use bold text for the error message to make it stand out.
  * Add a line break between the error message and "in <url> at line
    <line>" so that the error message stands out more.
  * Use `<p>...</p>` instead of `</br>` to separate the parts of the
    popup.
  * Use CSS for spacing instead of `</br>`.
  * Grammar fixes (add a missing comma, "at" instead of "in").
---
 src/static/js/pad_utils.js | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/static/js/pad_utils.js b/src/static/js/pad_utils.js
index 4f958a6ca..d200420e6 100644
--- a/src/static/js/pad_utils.js
+++ b/src/static/js/pad_utils.js
@@ -484,7 +484,6 @@ function setupGlobalExceptionHandler() {
     globalExceptionHandler = function test (msg, url, linenumber)
     {
       var errorId = randomString(20);
-      var userAgent = padutils.escapeHtml(navigator.userAgent);
 
       var msgAlreadyVisible = false;
       $('.gritter-item .error-msg').each(function() {
@@ -494,13 +493,19 @@ function setupGlobalExceptionHandler() {
       });
 
       if (!msgAlreadyVisible) {
-        errorMsg = "<b>Please press and hold Ctrl and press F5 to reload this page</b></br> \
-                    If the problem persists please send this error message to your webmaster: </br></br>\
-                    <div style='text-align:left; font-size: .8em'>\
-                    ErrorId: " + errorId + "<br>\
-                    URL: " + padutils.escapeHtml(window.location.href) + "<br>\
-                    UserAgent: " + userAgent + "<br>\
-                    <span class='error-msg'>"+ msg + "</span> in " + url + " at line " + linenumber + '</div>';
+        const txt = document.createTextNode.bind(document); // Convenience shorthand.
+        const errorMsg = [
+          $('<p>')
+              .append($('<b>').text('Please press and hold Ctrl and press F5 to reload this page')),
+          $('<p>')
+              .text('If the problem persists, please send this error message to your webmaster:'),
+          $('<div>').css('text-align', 'left').css('font-size', '.8em').css('margin-top', '1em')
+              .append(txt(`ErrorId: ${errorId}`)).append($('<br>'))
+              .append(txt(`URL: ${window.location.href}`)).append($('<br>'))
+              .append(txt(`UserAgent: ${navigator.userAgent}`)).append($('<br>'))
+              .append($('<b>').addClass('error-msg').text(msg)).append($('<br>'))
+              .append(txt(`at ${url} at line ${linenumber}`)).append($('<br>')),
+        ];
 
         $.gritter.add({
           title: "An error occurred",