vue error boundary work --- in progress

Author: polluterofminds

example/browser/index.js

@@ -89,17 +89,17 @@ document.addEventListener("DOMContentLoaded", () => {
     });
 });
 
-function throwIndexOutOfRange(indexer, withCustomStacking) {
+async function throwIndexOutOfRange(indexer, withCustomStacking) {
   try {
     getNonexistentData(indexer);
   } catch (e) {
     if (withCustomStacking) {
       if (Math.random() < 0.5) {
-        Exceptionless.createException(e)
+        await Exceptionless.createException(e)
           .setManualStackingKey("MyCustomStackingKey")
           .submit();
       } else {
-        Exceptionless.createException(e)
+        await Exceptionless.createException(e)
           .setManualStackingInfo(
             {
               File: "index.js",
@@ -110,7 +110,7 @@ function throwIndexOutOfRange(indexer, withCustomStacking) {
           .submit();
       }
     } else {
-      Exceptionless.submitException(e);
+      await Exceptionless.submitException(e);
     }
   }
 }

example/react/src/App.js

@@ -28,20 +28,20 @@ class App extends Component {
     this.setState({ error: true });
   };
 
-  submitMessage = () => {
+  submitMessage = async () => {
     const message = "Hello, world!";
     this.setState({ message: "", errorInfo: "" });
-    Exceptionless.submitLog(message);
+    await Exceptionless.submitLog(message);
     this.setState({ message });
   };
 
-  tryCatchExample = () => {
+  tryCatchExample = async () => {
     try {
       this.setState({ message: "", errorInfo: "" });
       throw new Error("Caught in the try/catch");
     } catch (error) {
       this.setState({ errorInfo: error.message });
-      Exceptionless.submitException(error);
+      await Exceptionless.submitException(error);
     }
   };
 

example/vue/src/App.vue

@@ -1,13 +1,16 @@
 <script setup>
 import HelloWorld from './components/HelloWorld.vue'
+// import { Exceptionless, ExceptionlessErrorBoundary } from '@exceptionless/vue'
 
 // This starter template is using Vue 3 experimental <script setup> SFCs
 // Check out https://github.com/vuejs/rfcs/blob/script-setup-2/active-rfcs/0000-script-setup.md
 </script>
 
 <template>
   <div>
-    <HelloWorld msg="Exceptionless Vue Example" />
+
+      <HelloWorld msg="Exceptionless Vue Example" />
+   
   </div>
 </template>
 

example/vue/src/components/HelloWorld.vue

@@ -27,12 +27,12 @@ defineProps({
 
 const state = reactive({ error: "" })
 
-const throwError = () => {
+const throwError = async () => {
   try {
     throw new Error("Whoops, it broke");
   } catch (error) {
     state.error = error.message;
-    Exceptionless.submitException(error);
+    await Exceptionless.submitException(error);
   }
 }
 </script>

example/vue/src/main.js

@@ -1,8 +1,8 @@
 import { createApp } from "vue";
 import App from "./App.vue";
-import { Exceptionless } from "@exceptionless/browser";
+import { Exceptionless } from "@exceptionless/vue";
 
-await Exceptionless.startup((c) => {
+Exceptionless.startup((c) => {
   c.useDebugLogger();
 
   c.apiKey = "LhhP1C9gijpSKCslHHCvwdSIz298twx271n1l6xw";

packages/vue/.gitignore

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

packages/vue/README.md

@@ -0,0 +1,24 @@
+# vue
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

packages/vue/babel.config.cjs

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}

packages/vue/index.js

@@ -0,0 +1,2 @@
+import { Exceptionless, ExceptionlessErrorBoundary } from "./src/main";
+export { Exceptionless, ExceptionlessErrorBoundary };