chore(sentry): improve log for non error exceptions (#15)

Author: faris-imi

lib/__test__/script.test.ts

@@ -63,11 +63,11 @@ describe('fetchScript', () => {
       });
 
       it('should reject when onerror is called', async () => {
-          spyOnError.set.mockImplementationOnce((callback: (any) => void) => {
-              callback({event: 'test'});
+          spyOnError.set.mockImplementationOnce((callback: (any) => any) => {
+            callback('Invalid Script');
           });
 
-          await expect(fetchScript()).rejects.toThrow(SCRIPT_ERROR);
+          await expect(fetchScript()).rejects.toBe('Invalid Script');
 
           expect(spyOnAppend).toHaveBeenCalled();
           expect(spyOnRemove).toHaveBeenCalled();

lib/__test__/sentry.test.ts

@@ -6,6 +6,7 @@ import {
   getSentry,
   getSentryHubWrapper,
 } from '../src/sentry';
+import { SCRIPT_ERROR } from '../src/constants.js';
 
 jest.mock('@sentry/browser', () => ({
   BrowserClient: jest.fn(),
@@ -64,7 +65,7 @@ describe('Sentry', () => {
     const mockHub = {
       addBreadcrumb: jest.fn(),
       captureMessage: jest.fn(),
-      captureException: jest.fn(),
+      captureEvent: jest.fn(),
       withScope: jest.fn(callback => callback(mockScope)),
     };
 
@@ -79,8 +80,19 @@ describe('Sentry', () => {
     sentryHubWrapper.captureMessage('test message');
     expect(mockHub.captureMessage).toHaveBeenCalledWith('test message');
 
-    sentryHubWrapper.captureException('test exception');
-    expect(mockHub.captureException).toHaveBeenCalledWith('test exception');
+    sentryHubWrapper.captureException(new Error('test error'));
+    expect(mockHub.captureEvent).toHaveBeenCalledWith({
+      message: SCRIPT_ERROR,
+      level: 'error',
+      extra: new Error('test error'),
+    });
+
+    sentryHubWrapper.captureException('test non error');
+    expect(mockHub.captureEvent).toHaveBeenCalledWith({
+      message: SCRIPT_ERROR,
+      level: 'error',
+      extra: 'test non error',
+    });
   });
 });
 

lib/src/loader.ts

@@ -73,6 +73,7 @@ export function hCaptchaLoader(params: ILoaderParams = { cleanup: true }): Promi
           sentry.addBreadcrumb({
             category: 'hCaptcha:script',
             message: 'hCaptcha failed to load',
+            data: error,
           });
 
           sentry.captureException(error);

lib/src/script.ts

@@ -1,4 +1,4 @@
-import { HCAPTCHA_LOAD_FN_NAME, SCRIPT_ERROR, SCRIPT_ID } from './constants';
+import { HCAPTCHA_LOAD_FN_NAME, SCRIPT_ID } from './constants';
 import { getFrame, getMountElement } from './utils';
 
 import type { IScriptParams } from './types';
@@ -34,7 +34,7 @@ export function fetchScript({
     };
 
     script.onload = (event) => onComplete(event, resolve);
-    script.onerror = (event) => onComplete(event, () => reject(new Error(SCRIPT_ERROR)));
+    script.onerror = (event) => onComplete(event, reject);
 
     script.src += query !== '' ? `&${query}` : '';
 

lib/src/sentry.ts

@@ -1,6 +1,7 @@
 import * as Sentry from '@sentry/browser';
 
 import { ScopeTag, SentryHub } from './types';
+import { SCRIPT_ERROR } from './constants';
 
 const SENTRY_DSN = process.env.SENTRY_DSN_TOKEN;
 
@@ -71,15 +72,18 @@ export function getSentryHubWrapper(
         sentryHub.captureMessage(message);
       });
     },
-    captureException: (e) => {
+    captureException: (error) => {
       if (!sentryHub) {
         return;
       }
 
       sentryHub.withScope(function (scope) {
         scope.setTag(tag.key, tag.value);
-
-        sentryHub.captureException(e);
+        sentryHub.captureEvent({
+          message: SCRIPT_ERROR,
+          level: 'error',
+          extra: error
+        });
       });
     }
   };

lib/src/types.ts

@@ -23,7 +23,7 @@ export interface ILoaderParams extends IScriptParams {
 
 export interface SentryHub {
     addBreadcrumb: (breadcrumb: object) => void;
-    captureException: (e: any) => void;
+    captureException: (error: any) => void;
     captureMessage: (message: string) => void;
 }
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hcaptcha/loader",
   "description": "This is a JavaScript library to easily configure the loading of the hCaptcha JS client SDK with built-in error handling.",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "author": "hCaptcha team and contributors",
   "license": "MIT",
   "keywords": [