Handling Flow Errors

This guide will cover displaying and controlling behavior around flow errors. Within Descope screens, if an external error is provided during an action, you can transform the error to be a more consumable error for your end user. Outside of screens, you can route based on errors.

Customizing Flow Errors via Client SDKs

Client SDK

Install SDK

npm i --save @descope/react-sdk

Import and initialize SDK

import { AuthProvider } from '@descope/react-sdk'
import { Descope, useDescope } from '@descope/react-sdk'
 
const AppRoot = () => {
	return (
		<AuthProvider
			projectId="__ProjectID__"
			// If the Descope project manages the token response in cookies,
            // a custom domain must be configured
            // (e.g., https://auth.app.example.com)
			// and should be set as the baseUrl property.
			// baseUrl = "https://auth.app.example.com"
		>
			<App />
		</AuthProvider>
	);
};

Customizing Flow Errors

Below are examples of how to transform errors during flow execution.

import { Descope } from '@descope/react-sdk'
 
const App = () => {
  return (
    {...}
    <Descope
      flowId="my-flow-id"
      onSuccess={(e) => console.log('Logged in!')}
      onError={(e) => console.log('Could not logged in')}
 
      const errorTransformer = useCallback(
      	(error: { text: string; type: string }) => {
      		const translationMap = {
      			SAMLStartFailed: 'Failed to start SAML flow'
      		};
      		return translationMap[error.type] || error.text;
      	},
      	[]
      );
      errorTransformer={errorTransformer}
    />
  )
}

Customizable Errors

Below outlines the customizable errors you can transform when running Descope flows.

Drag and Drop Flow Error Handling

Error handling in flows is done in a couple ways:

• (1) Auto-handling: If a widget is not linked to something, the error is automatically presented in the most recent flow screen step.
• (2) Specifically Exposed Errors: Certain widgets have hard-coded error handling, allowing the Descoper to configure the output.
• (3) Custom Error Handling: Errors thrown in widgets that are not caught automatically are exposed as generic, allowing the Descoper to route to a desired screen or action.

By adjusting the Error Handling in the configuration of a widget from Automatic to Custom, the ability to route to a particular action, screen, condition, or connector will show up.