From b1b64926f1e59ccf750aec671b6b994fce111a8d Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Sun, 18 Nov 2018 23:24:56 -0400
Subject: [PATCH 1/8] fix(docs): fix issue with playground export button

Fixes the export to fiddle button when JS and HTML are valid-ish.
---
 docs/pages/play.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 0b056e0662d..16be008f70d 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -214,17 +214,17 @@ export default {
     isOk () {
       // Check if JS and HTML are "valid-ish"
       // Used to enable export to JS Fiddle Button
-      let options
+      let opts
       const js = this.js.trim() || '{}'
       // Check if JS will compile without error
       try {
         /* eslint-disable no-eval */
-        eval(`obj = ${js}`)
+        eval(`opts = ${js}`)
         /* eslint-enable no-eval */
       } catch (err) {
         return false
       }
-      if (o.el) {
+      if (opts.el) {
         return false
       }
       // Check for template existance

From d2fb1ddf320b30707602dbb7cc2e941b1a3a0a52 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Sun, 18 Nov 2018 23:57:09 -0400
Subject: [PATCH 2/8] Update play.vue

---
 docs/pages/play.vue | 37 +++++++++----------------------------
 1 file changed, 9 insertions(+), 28 deletions(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 16be008f70d..4ad3d73a3ed 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -194,6 +194,7 @@ export default {
     return {
       html: '',
       js: '',
+      isOk: false,
       messages: [],
       logIdx: 1, // used as the ":key" on console section for transition hooks
       vertical: false,
@@ -211,30 +212,6 @@ export default {
       return this.js.trim() === defaultJS.trim() &&
         this.html.trim() === defaultHTML.trim()
     },
-    isOk () {
-      // Check if JS and HTML are "valid-ish"
-      // Used to enable export to JS Fiddle Button
-      let opts
-      const js = this.js.trim() || '{}'
-      // Check if JS will compile without error
-      try {
-        /* eslint-disable no-eval */
-        eval(`opts = ${js}`)
-        /* eslint-enable no-eval */
-      } catch (err) {
-        return false
-      }
-      if (opts.el) {
-        return false
-      }
-      // Check for template existance
-      // Doesn't check validity of HTML markup though
-      // Vue.compile(html) doesn't throw an error in production mode!
-      if (!this.html && !opts.template && typeof opts.render !== 'function') {
-        return false
-      }
-      return true
-    },
     fiddle_dependencies () {
       return [
         '//unpkg.com/bootstrap/dist/css/bootstrap.min.css',
@@ -363,6 +340,9 @@ export default {
       let options
       let console
 
+      // Disable the export to fiddle button
+      this.isOk = false
+
       // Test and assign options JavaScript
       try {
         // Options are eval'ed in our variable scope, so we can override
@@ -376,10 +356,10 @@ export default {
       }
 
       // Sanitize template possibilities
-      if (!html && !options.template && typeof options.render !== 'function') {
+      if (!(html || typeof options.template === 'string' || typeof options.render === 'function')) {
         this.errHandler('No template or render function provided', 'template')
         return
-      } else if (!html && options.template && options.template.trim().charAt(0) === '#') {
+      } else if (!html && tyepof options.template === 'string' && options.template.charAt(0) === '#') {
         this.errHandler('Do not set template to an element ID', 'template')
         return
       }
@@ -388,7 +368,7 @@ export default {
         return
       }
       if (options.render && typeof options.render !== 'function') {
-        this.errHandler('Render must be a function', 'javascript')
+        this.errHandler('render must be a function', 'javascript')
         return
       }
       if (!options.render) {
@@ -424,7 +404,8 @@ export default {
         return
       }
 
-      // We got this far, so save the JS/HTML changes to localStorage
+      // We got this far, so save the JS/HTML changes to localStorage and enable export button
+      this.isOk = true
       this.save()
     },
     errHandler(err, info) {

From 1666c22f453577d0cd1b353aaba313599e29ef2c Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Sun, 18 Nov 2018 23:59:28 -0400
Subject: [PATCH 3/8] lint

---
 docs/pages/play.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 4ad3d73a3ed..a9c5ca15439 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -359,7 +359,7 @@ export default {
       if (!(html || typeof options.template === 'string' || typeof options.render === 'function')) {
         this.errHandler('No template or render function provided', 'template')
         return
-      } else if (!html && tyepof options.template === 'string' && options.template.charAt(0) === '#') {
+      } else if (!html && typeof options.template === 'string' && options.template.charAt(0) === '#') {
         this.errHandler('Do not set template to an element ID', 'template')
         return
       }

From 321c10c8cb2ca8f259003296164920097300c911 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 19 Nov 2018 00:08:10 -0400
Subject: [PATCH 4/8] Update play.vue

---
 docs/pages/play.vue | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index a9c5ca15439..2da5e59759b 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -139,7 +139,7 @@
   </div>
 </template>
 
-<style>
+<style scoped>
 .flip-move {
   transition: all .3s;
 }
@@ -168,16 +168,28 @@ const defaultJS = `{
   },
   watch: {
     show: function (newVal, oldVal) {
-      console.log('Alert is ' + (this.show ? 'visible' : 'hidden'))
+      console.log('Alert is now ' + (this.show ? 'visible' : 'hidden'))
+    }
+  },
+  methods: {
+    toggle: function () {
+      console.log('Toggle button clicked')
+      this.show = !this.show
+    },
+    dismissed: function () {
+      console.log('Dismiss button clicked')
     }
   }
 }`
 
 const defaultHTML = `<div style="height:7.5rem;">
-  <b-button @click="show = !show">
+  <b-button @click="toggle">
     {{ show ? 'Hide' : 'Show' }} Alert
   </b-button>
-  <b-alert v-model="show" dismissible class="mt-3">
+  <b-alert v-model="show"
+           dismissible
+           @dismissed="dismissed"
+           class="mt-3">
     Hello {{ name }}!
   </b-alert>
 </div>`

From d711989dc653b174e7231cdb363d6791c917a6cf Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 19 Nov 2018 00:53:59 -0400
Subject: [PATCH 5/8] Update play.vue

Test leaving global error handler in place
---
 docs/pages/play.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 2da5e59759b..335c0b55381 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -300,8 +300,8 @@ export default {
   mounted () {
     // Disable any global errorHandler, as it can cause endless console loops on ocassion.
     // Also prevents Vue-Analytics from logging errors from the user generated apps
-    this.oldErrorHandler = Vue.config.errorHandler
-    Vue.config.errorHandler = null
+//    this.oldErrorHandler = Vue.config.errorHandler
+//    Vue.config.errorHandler = null
 
     // Create our debounced runner
     this.run = debounce(this._run, 500)

From a8f44e33fb82f461a28878b36b09b05da0a9a8c6 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 19 Nov 2018 03:15:19 -0400
Subject: [PATCH 6/8] hanlde errors thrown in methods

---
 docs/pages/play.vue | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 335c0b55381..5b7d9ebaa55 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -347,6 +347,7 @@ export default {
       this.$refs.result.innerHTML = ''
     },
     createVM () {
+      const playground = this
       const js = this.js.trim() || '{}'
       const html = this.html.trim()
       let options
@@ -389,9 +390,30 @@ export default {
         delete options.template
       }
 
+      // Vue's errorCapture doesn't always handle errors in methods, so we
+      // wrap any methods with a try/catch handler so we can show the error in our GUI console
+      // https://github.com/vuejs/vue/issues/8568
+      // Doesn't handle errors in async methods
+      if (options.methods) {
+        Object.keys(options.methods).forEach((methodName) => {
+          const fn = options.methods[methodName]
+          if (typeof fn !== 'function') {
+             this.errorHandler(`TypeError: ${methodName} is not a function`, 'methods')
+          } else {
+            // Replace it with a wrapped method
+            options.methods[methodName] = funtion () {
+              try {
+                return fn.apply(this, arguments)
+              } catch (err) {
+                playground.errHandler(err, `method "${methodName}"`)
+              }
+            }
+          }
+        })
+      }
+
       // Try and buld the user app
       try {
-        let playground = this
         let holder = document.createElement('div')
         this.$refs.result.appendChild(holder)
         this.playVM = new Vue(Object.assign({}, options, {

From 372a12288abe8bfbdc44a821d4c10386c7ba67c7 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 19 Nov 2018 03:25:03 -0400
Subject: [PATCH 7/8] lint

---
 docs/pages/play.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index 5b7d9ebaa55..b10ff91724c 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -401,7 +401,7 @@ export default {
              this.errorHandler(`TypeError: ${methodName} is not a function`, 'methods')
           } else {
             // Replace it with a wrapped method
-            options.methods[methodName] = funtion () {
+            options.methods[methodName] = function () {
               try {
                 return fn.apply(this, arguments)
               } catch (err) {

From 32e4277e6e9cda4d7c25a8cf2658af57df5de3de Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 19 Nov 2018 03:39:09 -0400
Subject: [PATCH 8/8] Remove global error handler override

---
 docs/pages/play.vue | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/docs/pages/play.vue b/docs/pages/play.vue
index b10ff91724c..bf001f17159 100755
--- a/docs/pages/play.vue
+++ b/docs/pages/play.vue
@@ -293,16 +293,10 @@ export default {
   created () {
     // Create some non reactive properties
     this.playVM = null
-    this.oldErrorHandler = null
     this.contentUnWatch = null
     this.run = () => {}
   },
   mounted () {
-    // Disable any global errorHandler, as it can cause endless console loops on ocassion.
-    // Also prevents Vue-Analytics from logging errors from the user generated apps
-//    this.oldErrorHandler = Vue.config.errorHandler
-//    Vue.config.errorHandler = null
-
     // Create our debounced runner
     this.run = debounce(this._run, 500)
 
@@ -324,9 +318,6 @@ export default {
     if (!this.$isServer) {
       this.destroyVM()
     }
-    if (this.oldErrorHandler) {
-      Vue.config.errorHandler = this.oldErrorHandler
-    }
   },
   methods: {
     destroyVM () {