add download link for report

static/js/run.js

@@ -108,7 +108,11 @@ function showReport(results) {
 
   summary.appendChild(report.toDom());
 
-  details.innerHTML = JSON.stringify(results, null, 2);
+  let reportJSON = JSON.stringify(results, null, 2);
+  details.innerText = reportJSON;
+  let reportBlob = new Blob([ reportJSON ], { type : 'application/json' });
+  document.querySelector('.details__download').href = URL.createObjectURL(reportBlob);
+
 }
 
 checkStatus();

styles/components/_details.scss

@@ -3,6 +3,10 @@
   padding: space(8) 0;
 }
 
+.details > .container {
+  position: relative;
+}
+
 .details summary {
   cursor: pointer;
   list-style-type: disclosure-closed;
@@ -28,4 +32,11 @@
   padding: space(2);
   font-size: typesize(-1);
   margin-top: space(2);
+  white-space: pre-wrap;
+}
+
+.details__download {
+  position: absolute;
+  top: 0;
+  right: 0;
 }

views/run.html

@@ -64,6 +64,7 @@
           </summary>
           <pre class="details__report"></pre>
         </details>
+        <a class="details__download" download="report.json">download the full report</a>
       </div>
     </div>
     <!-- END DETAILS SECTION -->