Setup action hook callback to capture React Error Boundary exceptions…

… in Gutenberg with Sentry

Register a callback to `editor.ErrorBoundary.errorLogged` action that will forward the error to Sentry everytime the action is called.

The action has been added to all active React Error Boundaries in Gutenberg in the following changeset: WordPress/gutenberg#42024 .

apps/editing-toolkit/editing-toolkit-plugin/error-reporting/index.js

@@ -1,5 +1,6 @@
 import * as Sentry from '@sentry/browser';
 import apiFetch from '@wordpress/api-fetch';
+import { addAction } from '@wordpress/hooks';
 
 const shouldActivateSentry = window.A8C_ETK_ErrorReporting_Config?.shouldActivateSentry === 'true';
 /**
@@ -18,6 +19,12 @@ function activateSentry() {
 		release: 'wpcom-test-01',
 	} );
 
+	// Capture exceptions from Gutenberg React Error Boundaries
+	addAction( 'editor.ErrorBoundary.errorLogged', 'etk/error-reporting', ( error ) => {
+		// error is the exception's error object
+		Sentry.captureException( error );
+	} );
+
 	// We still need to report the head errors, if any.
 	headErrors.forEach( ( error ) => Sentry.captureException( error ) );
 	Sentry.flush().then( () => delete window._jsErr );