Transcript

In this Quick Tip we're going to learn about the "An unhandled error occurs" event. We create this by clicking to add an event in the Workflow tab and navigating to General --> "An unhandled error occurs".

In the Events Property Editor, we have one property called "Catch" which we must define so the workflow knows which error it's looking for. If we select "Element workflow errors only", we are looking for errors that occur from element interaction events, like when an element is clicked or when an input is changed. If we select "Any workflow error", we are looking for any error that may trigger in a workflow. We use this because sometimes a workflow can invoke an error that Bubble doesn't know about, be it from a plugin or maybe even a bug. This is your way to intercept that error and display something else to your users.

This also includes errors that Bubble does catch, like if a user is already signed up to your app and tries to sign up again. When this happens, Bubble displays an error message from a browser alert. While this is the default behavior, this is where catching the error allows you to customize this.

With an Alert element on our page, we can show a message as an action and customize what it says. Here we have access to the "Current Workflow Error" data source where we can access its code ("Current Workflow Error's code"), which is a short sentence about the error, or we can access the "Current Workflow Error's message", which is the entire error message. By doing so, Bubble will automatically replace the alert from the browser with the Alert element that we can customize on the page.

For errors that Bubble handles, you can customize the message from the Languages sub-tab (within the Settings tab in the Editor) by finding the appropriate error that we're catching.

Finally, one thing to keep in mind: "An unhandled error occurs" event will catch both element and workflow errors, but we have a sister event called "Element has an error running a workflow" that pinpoints specific elements for errors. If we had both of these events set, this "Element has an error running a workflow" event will supersede the "An unhandled error occurs" event and run instead.

Catching errors is good practice to create better interactions for users, so try this event out for yourself!

That's it for this Quick Tip! For more, be sure to check out bubble.io/academy.