chore: added more logging for some errors

src/customizations/volto/components/theme/Error/Error.jsx

@@ -0,0 +1,76 @@
+/**
+ * @module components/theme/Error/Error
+ * Customization:
+ * - added logging of errors
+ */
+
+import React from 'react';
+import loadable from '@loadable/component';
+import config from '@plone/volto/registry';
+
+const sentryLibraries = {
+  Sentry: loadable.lib(
+    () => import(/* webpackChunkName: "s_entry-browser" */ '@sentry/browser'),
+  ),
+};
+
+/**
+ * Error function.
+ * @function Error
+ * @returns {string} Markup of the error page.
+ */
+const Error = (props) => {
+  const { views } = config;
+  const { error } = props;
+  let FoundView;
+
+  // CUSTOMIZATION: added logging of errors
+  const notifySentry = (error) => {
+    const loaders = Object.entries(sentryLibraries).map(
+      ([name, Lib]) =>
+        new Promise((resolve) =>
+          Lib.load().then((mod) => resolve([name, mod])),
+        ),
+    );
+    Promise.all(loaders).then((libs) => {
+      const libraries = Object.assign(
+        {},
+        ...libs.map(([name, lib]) => ({ [name]: lib })),
+      );
+      libraries.Sentry.captureException(error);
+    });
+  };
+
+  if (error.status === undefined) {
+    // For some reason, while development and if CORS is in place and the
+    // requested resource is 404, it returns undefined as status, then the
+    // next statement will fail
+    // eslint-disable-next-line no-console
+    console.error(
+      'DEV MODE CORS ERROR in Error component: ',
+      JSON.stringify(props, null, 2),
+    );
+    notifySentry(props);
+    FoundView = views.errorViews.corsError;
+  } else {
+    if (error.status.toString() === 'corsError') {
+      // eslint-disable-next-line no-console
+      console.error(
+        'CORS ERROR in Error component: ',
+        JSON.stringify(props, null, 2),
+      );
+      notifySentry(props);
+    }
+    FoundView = views.errorViews[error.status.toString()];
+  }
+  if (!FoundView) {
+    FoundView = views.errorViews['404']; // default to 404
+  }
+  return (
+    <div id="view">
+      <FoundView {...props} />
+    </div>
+  );
+};
+
+export default Error;