Add copyable bug report generation on errors

Generate a structured, anonymous bug report on every error: build info
(volview version, git SHA, vtk.js/itk-wasm versions), browser UA,
error stack trace, dataset metadata (dimensions, scalar type, source
format, segment group save format). Users copy it from a button in the
notification center title bar.

Uses dependency injection (setBugReportGenerator) to avoid circular
deps between the message store and dataset stores.

Author: PaulHax

src/store/messages.ts

@@ -56,16 +56,17 @@ export const useMessageStore = defineStore('message', {
     addError(title: string, opts?: ErrorOptions) {
       console.error(title, opts?.error ?? opts?.details);
 
-      const details = opts?.details ?? opts?.error?.stack;
-
-      const id = this._addMessage(
-        { type: MessageType.Error, title },
-        { details, persist: opts?.persist ?? false }
+      return this._addMessage(
+        {
+          type: MessageType.Error,
+          title,
+          bugReport: generateBugReport(opts?.error),
+        },
+        {
+          details: opts?.details ?? opts?.error?.stack,
+          persist: opts?.persist ?? false,
+        }
       );
-
-      this.byID[id].bugReport = generateBugReport(opts?.error);
-
-      return id;
     },
     /**
      * Adds a warning message.

src/utils/bugReport.ts

@@ -9,40 +9,8 @@ const MAX_ERROR_LENGTH = 4000;
 
 const COMPOUND_EXTENSIONS = ['nii.gz', 'iwi.cbor', 'seg.nrrd'];
 
-const parseBrowserInfo = (): string => {
-  if (typeof navigator === 'undefined') return 'unknown';
-
-  const { userAgent: ua } = navigator;
-
-  const patterns: [string, RegExp][] = [
-    ['Firefox', /Firefox\/([\d.]+)/],
-    ['Edge', /Edg\/([\d.]+)/],
-    ['Chrome', /Chrome\/([\d.]+)/],
-    ['Safari', /Version\/([\d.]+).*Safari/],
-  ];
-
-  const match = patterns
-    .map(([name, re]) => {
-      const m = ua.match(re);
-      return m ? `${name} ${m[1]}` : null;
-    })
-    .find(Boolean);
-
-  const browser = match ?? 'Unknown';
-
-  const os = ['Windows', 'Mac', 'Linux', 'Android', 'iPhone', 'iPad'].find(
-    (name) => ua.includes(name)
-  );
-
-  const osLabel =
-    os === 'Mac'
-      ? 'macos'
-      : os === 'iPhone' || os === 'iPad'
-        ? 'ios'
-        : (os?.toLowerCase() ?? 'unknown');
-
-  return `${browser} (${osLabel})`;
-};
+const getBrowserInfo = (): string =>
+  typeof navigator !== 'undefined' ? navigator.userAgent : 'unknown';
 
 const getSourceFormat = (name: string, isDicom: boolean): string => {
   if (isDicom) return 'DICOM';
@@ -107,22 +75,18 @@ export const generateBugReport = (error?: Error): string => {
   const lines = [
     '--- VolView Bug Report ---',
     `Build: volview ${versions.volview} (${sha}) | vtk.js: ${versions['vtk.js']}, itk-wasm: ${versions['itk-wasm']}`,
-    `Browser: ${parseBrowserInfo()}`,
+    `Browser: ${getBrowserInfo()}`,
     '',
     'Error:',
     formatError(error),
   ];
 
-  try {
-    const datasets = collectDatasetInfo();
-    const segmentGroupStore = useSegmentGroupStore();
+  const datasets = collectDatasetInfo();
+  const segmentGroupStore = useSegmentGroupStore();
 
-    lines.push('', `Datasets: ${datasets.length}`);
-    lines.push(...datasets);
-    lines.push(`Save format: ${segmentGroupStore.saveFormat}`);
-  } catch {
-    lines.push('', 'Datasets: unavailable');
-  }
+  lines.push('', `Datasets: ${datasets.length}`);
+  lines.push(...datasets);
+  lines.push(`Save format: ${segmentGroupStore.saveFormat}`);
 
   lines.push('--- End Report ---');
 

tests/specs/bug-report.e2e.ts

@@ -2,7 +2,7 @@ import { volViewPage } from '../pageobjects/volview.page';
 import { writeManifestToFile } from './utils';
 
 describe('Bug report generation', () => {
-  it('should attach bug report to error messages', async () => {
+  it('should show Copy Bug Report button on error', async () => {
     // Trigger an error by loading a malformed URL
     const manifest = { resources: [{ url: 'bad-url-to-trigger-error' }] };
     await writeManifestToFile(manifest, 'bugReportTest.json');
@@ -22,20 +22,5 @@ describe('Bug report generation', () => {
       },
       { timeout: 5000, timeoutMsg: 'Expected Copy Bug Report button' }
     );
-
-    // Verify bug report content via the store
-    const report = await browser.execute(() => {
-      // Access the Pinia store from the app instance
-      const app = document.querySelector('#app') as any;
-      const pinia = app?.__vue_app__?.config?.globalProperties?.$pinia;
-      if (!pinia) return '';
-      const store = pinia.state.value.message;
-      if (!store) return '';
-      const firstId = store.msgList[0];
-      return store.byID[firstId]?.bugReport ?? '';
-    });
-
-    expect(report).toContain('--- VolView Bug Report ---');
-    expect(report).toContain('Browser:');
   });
 });