Skip to content

Error handling

The error handling feature is 100% reactive, which means that all the flow to catch and display errors happens using a reactive behavior.

For now, we only catch "Fatal errors", this types of errors prevents the application to continuing its normal execution showing an error panel with detailed information of each error handled.

Usage

The error handler feature is reactive, so you need to attach your error to an action that should be created using the createFatalErrorAction method.

When you dispatch an action that was created using the createFatalErrorAction function an effect of the "Error Handler" feature will be executed.

The effect dispatch an other action that add the error (serialized) in the store and route the user to the "Error panel' that display the stack trace of errors and details of each one.

Create your own error action

The property required to dispatch that action its an Error object, its not necessary for you to store that value in the feature store, but if you want to do it we strongly recommend to store the message only.

TypeScript
1
2
3
4
export const AuthenticationFailure = createFatalErrorAction(
    '[Authentication] Authentication failure.',
    props<{ error: Error }>()
);

As you know, the store only contains POJOs (Plain Old Javascript Objects), so if the error is an instance of new Error('My error') the value couldn't be stored.

Fortunately the error handling feature define a serialization method that map the three basic properties name, message and stack and try to map al the printable metadata of the error.