Add onSetupError

src/index.js

@@ -36,7 +36,13 @@ const elmWebComponents = {
   register(
     name,
     ElmComponent,
-    { setupPorts = () => {}, staticFlags = {}, onDetached = () => {}, mapFlags = flags => flags } = {}
+    {
+      setupPorts = () => {},
+      staticFlags = {},
+      onDetached = () => {},
+      mapFlags = flags => flags,
+      onSetupError = () => {}
+    } = {}
   ) {
     if (!this.__elmVersion) {
       if (!hasWarnedAboutMissingElmVersion) {
@@ -56,29 +62,36 @@ const elmWebComponents = {
 
     class ElmElement extends HTMLElement {
       connectedCallback() {
-        let props = Object.assign({}, getProps(this), staticFlags)
-        if (Object.keys(props).length === 0) props = undefined
-
-        const flags = mapFlags(props)
-
-        if (elmVersion === '0.19') {
-          /* a change in Elm 0.19 means that ElmComponent.init now replaces the node you give it
-           * whereas in 0.18 it rendered into it. To avoid Elm therefore destroying our custom element
-           * we create a div that we let Elm render into, and manually clear any pre-rendered contents.
-           */
-          const elmDiv = document.createElement('div')
-
-          this.innerHTML = ''
-          this.appendChild(elmDiv)
-
-          const elmElement = ElmComponent.init({
-            flags,
-            node: elmDiv,
-          })
-          setupPorts(elmElement.ports)
-        } else if (elmVersion === '0.18') {
-          const elmElement = ElmComponent.embed(this, flags)
-          setupPorts(elmElement.ports)
+        const context = {};
+        try {
+          let props = Object.assign({}, getProps(this), staticFlags)
+          if (Object.keys(props).length === 0) props = undefined
+
+          const flags = mapFlags(props)
+          context.flags = flags;
+
+          if (elmVersion === '0.19') {
+            /* a change in Elm 0.19 means that ElmComponent.init now replaces the node you give it
+             * whereas in 0.18 it rendered into it. To avoid Elm therefore destroying our custom element
+             * we create a div that we let Elm render into, and manually clear any pre-rendered contents.
+             */
+            const elmDiv = document.createElement('div')
+
+            this.innerHTML = ''
+            this.appendChild(elmDiv)
+
+            const elmElement = ElmComponent.init({
+              flags,
+              node: elmDiv,
+            })
+            setupPorts(elmElement.ports)
+          } else if (elmVersion === '0.18') {
+            const elmElement = ElmComponent.embed(this, flags)
+            setupPorts(elmElement.ports)
+          }
+        } catch (error) {
+          console.error(error)
+          onSetupError(error, context)
         }
       }