Issue 5917 - Improve display of report data in the issue reporter

issue-reporter.js

Index: issue-reporter.js
===================================================================
--- a/issue-reporter.js
+++ b/issue-reporter.js
@@ -294,29 +294,52 @@ function initCommentPage()
     let value = event.target.value.trim();
     commentElement.textContent = value.substr(0, 1000);
     if (value)
       reportData.documentElement.appendChild(commentElement);
     document.getElementById("commentLengthWarning")
             .setAttribute("data-invisible", value.length <= 1000);
   });
 
+  let showDataOverlay = document.getElementById("showDataOverlay");
   document.getElementById("showData").addEventListener("click", event =>
   {
     event.preventDefault();
 
-    // window.open() won't open data: URIs in Chrome
-    browser.tabs.getCurrent().then(tab =>
+    showDataOverlay.hidden = false;
+
+    let element = document.getElementById("showDataValue");
+    element.value = serializeReportData();
+    element.focus();
+  });
+
+  document.getElementById("showDataClose").addEventListener("click", event =>
+  {
+    showDataOverlay.hidden = true;
+    document.getElementById("showData").focus();
+  });
+
+  showDataOverlay.addEventListener("keydown", event =>
+  {
+    if (event.key == "Enter" || event.key == "Escape")
     {
-      browser.tabs.create({
-        url: "data:text/xml;charset=utf-8," +
-             encodeURIComponent(serializeReportData()),
-        openerTabId: tab.id
-      });

[Wladimir Palant, 2017/10/24 11:58:29]

It would have been possible to merely fix this call. However, showing report
data in a new tab was only meant to be a stopgap solution anyway, we can replace
it by something more usable while at it.

[kzar, 2017/10/24 13:39:57]

Acknowledged.

-    });
+      // Stop propagation to prevent higher level event handler from processing
+      // this event.
+      event.stopPropagation();
+      document.getElementById("showDataClose").click();
+    }
+  });
+
+  showDataOverlay.addEventListener("click", event =>
+  {
+    if (event.eventPhase == event.AT_TARGET)
+    {
+      // User clicked outside overlay content
+      document.getElementById("showDataClose").click();
+    }
   });
 
   emailField.focus();
 }
 
 function leaveCommentPage()
 {
   setCurrentPage("sendPage");