Add support for monitoring via sentry.io

package.json

@@ -121,6 +121,8 @@
   "dependencies": {
     "@fontsource/jost": "^5.0.17",
     "@popperjs/core": "^2.11.8",
+    "@sentry/browser": "^7.114.0",
+    "@sentry/integrations": "^7.114.0",
     "@vueuse/core": "^10.9.0",
     "assert": "^2.1.0",
     "bootstrap": "^5.3.3",

src/ts/index.ts

@@ -9,6 +9,10 @@ import { ConfigLoader } from './config/config-loader';
 import { documentReady } from './util/document-ready';
 import { CONFIG_URLS, CONFIG_INJECTION_KEY } from './builtin-config';
 import { DuplicateIdError } from './config/config-additional-checks';
+import { initSentry } from './util/sentry-io';
+import { sentryDsn } from './stores/options';
+
+if (sentryDsn !== null) initSentry(sentryDsn);
 
 // eslint-disable-next-line no-lone-blocks
 {

src/ts/stores/options.ts

@@ -30,6 +30,8 @@ const markerSlotLabels =
 
 const autoReset = (searchParams.get('autoReset') ?? 'true') === 'true';
 
+export const sentryDsn = searchParams.get('sentryDsn');
+
 export const useOptionStore = defineStore('options', () => {
   const result = {
     useTuioMarkers,
@@ -42,6 +44,7 @@ export const useOptionStore = defineStore('options', () => {
     highlightDerivatives,
     markerSlotLabels,
     autoReset,
+    sentryDsn,
   };
 
   return result as DeepReadonly<typeof result>;

src/ts/util/sentry-io.ts

@@ -0,0 +1,23 @@
+import * as Sentry from '@sentry/browser';
+import * as SentryIntegrations from '@sentry/integrations';
+
+import { GIT_VERSION_INFO } from '../builtin-config';
+
+export function initSentry(sentryDSN: string) {
+  Sentry.init({
+    dsn: sentryDSN,
+    transport: Sentry.makeBrowserOfflineTransport(Sentry.makeFetchTransport),
+    transportOptions: {},
+    release: GIT_VERSION_INFO.tag ?? GIT_VERSION_INFO.hash ?? 'unknown',
+    tracesSampleRate: 0,
+    replaysSessionSampleRate: 0,
+    replaysOnErrorSampleRate: 0,
+    integrations: [
+      SentryIntegrations.captureConsoleIntegration({
+        // array of methods that should be captured
+        // defaults to ['log', 'info', 'warn', 'error', 'debug', 'assert']
+        levels: ['error'],
+      }),
+    ],
+  });
+}