From 70f68da0b731660574b0c441798e1b40e0fc4e62 Mon Sep 17 00:00:00 2001
From: Max Lynch <max@drifty.com>
Date: Tue, 15 Nov 2016 16:45:20 -0600
Subject: [PATCH] fix(errors): runtime error immediately, selectable stack

---
 bin/ion-dev.js                        | 25 +++++++++++++++++--------
 src/dev-client/sass/_stack-block.scss |  3 +++
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/bin/ion-dev.js b/bin/ion-dev.js
index 47f346f0..0a2f6125 100644
--- a/bin/ion-dev.js
+++ b/bin/ion-dev.js
@@ -41,6 +41,7 @@ window.IonicDevServer = {
   handleError: function(err) {
     if (!err) return;
 
+    // Socket is ready so send this error to the server for prettifying
     if (this.socketReady) {
       var msg = {
         category: 'runtimeError',
@@ -168,6 +169,9 @@ window.IonicDevServer = {
     }
   },
 
+  /**
+   * Process a build update message and display something to the friendly user.
+   */
   buildUpdate: function(msg) {
     var status = 'success';
 
@@ -187,6 +191,8 @@ window.IonicDevServer = {
       this.buildingNotification(false);
 
       var diagnosticsEle = document.getElementById('ion-diagnostics');
+
+      // If we have an element but no html created yet
       if (diagnosticsEle && !msg.data.diagnosticsHtml) {
         diagnosticsEle.classList.add('ion-diagnostics-fade-out');
 
@@ -199,21 +205,24 @@ window.IonicDevServer = {
 
       } else if (msg.data.diagnosticsHtml) {
 
-        clearTimeout(this.diagnosticsTimerId);
+        // We don't have an element but we have diagnostics HTML, so create the error
 
         if (!diagnosticsEle) {
           diagnosticsEle = document.createElement('div');
           diagnosticsEle.id = 'ion-diagnostics';
           diagnosticsEle.className = 'ion-diagnostics-fade-out';
           document.body.insertBefore(diagnosticsEle, document.body.firstChild);
-
-          this.diagnosticsTimerId = setTimeout(function() {
-            var diagnosticsEle = document.getElementById('ion-diagnostics');
-            if (diagnosticsEle) {
-              diagnosticsEle.classList.remove('ion-diagnostics-fade-out');
-            }
-          }, 24);
         }
+
+        // Show the last error
+        clearTimeout(this.diagnosticsTimerId);
+        this.diagnosticsTimerId = setTimeout(function() {
+          var diagnosticsEle = document.getElementById('ion-diagnostics');
+          if (diagnosticsEle) {
+            diagnosticsEle.classList.remove('ion-diagnostics-fade-out');
+          }
+        }, 24);
+
         diagnosticsEle.innerHTML = msg.data.diagnosticsHtml
       }
     }
diff --git a/src/dev-client/sass/_stack-block.scss b/src/dev-client/sass/_stack-block.scss
index 645e8419..a8e342ce 100644
--- a/src/dev-client/sass/_stack-block.scss
+++ b/src/dev-client/sass/_stack-block.scss
@@ -14,4 +14,7 @@
   white-space: pre;
   overflow: auto;
   padding: 10px;
+
+  user-select: auto;
+  -webkit-user-select: text;
 }