From f411cfcc60c5a901467e8b08edb77af20a29d1d1 Mon Sep 17 00:00:00 2001
From: Paul Elliott <paul@vizworkshop.com>
Date: Mon, 13 Apr 2026 14:29:06 -0400
Subject: [PATCH 1/3] feat(segmentGroups): use segment group name as filname

When zipping up session.volview.zip files.
---
 src/components/SaveSegmentGroupDialog.vue     | 21 ++++--
 src/components/SegmentGroupControls.vue       |  1 +
 .../__tests__/useKeyboardShortcuts.spec.ts    | 25 +++++++
 src/composables/useKeyboardShortcuts.ts       | 17 +++++
 src/io/__tests__/fileName.spec.ts             | 32 +++++++++
 src/io/fileName.ts                            | 37 ++++++++++
 .../__tests__/segmentGroupArchivePath.spec.ts | 25 +++++++
 src/io/state-file/segmentGroupArchivePath.ts  | 33 +++++++++
 src/store/segmentGroups.ts                    |  8 ++-
 tests/pageobjects/volview.page.ts             | 65 +++++++++++++++++-
 tests/specs/segment-group-download.e2e.ts     | 67 +++++++++++++++++++
 tests/specs/session-state-lifecycle.e2e.ts    | 41 ++++++++++--
 12 files changed, 357 insertions(+), 15 deletions(-)
 create mode 100644 src/composables/__tests__/useKeyboardShortcuts.spec.ts
 create mode 100644 src/io/__tests__/fileName.spec.ts
 create mode 100644 src/io/fileName.ts
 create mode 100644 src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
 create mode 100644 src/io/state-file/segmentGroupArchivePath.ts
 create mode 100644 tests/specs/segment-group-download.e2e.ts

diff --git a/src/components/SaveSegmentGroupDialog.vue b/src/components/SaveSegmentGroupDialog.vue
index fae9a85da..6dc198d4e 100644
--- a/src/components/SaveSegmentGroupDialog.vue
+++ b/src/components/SaveSegmentGroupDialog.vue
@@ -7,7 +7,7 @@
       <v-form v-model="valid" @submit.prevent="saveSegmentGroup">
         <v-text-field
           v-model="fileName"
-          hint="Filename that will appear in downloads."
+          hint="Filename used for downloads. Invalid filename characters are replaced automatically."
           label="Filename"
           :rules="[validFileName]"
           required
@@ -37,12 +37,13 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { onKeyDown } from '@vueuse/core';
 import { saveAs } from 'file-saver';
 import { useSegmentGroupStore } from '@/src/store/segmentGroups';
 import { writeSegmentation } from '@/src/io/readWriteImage';
 import { useErrorMessage } from '@/src/composables/useErrorMessage';
+import { sanitizeSegmentGroupFileStem } from '@/src/io/state-file/segmentGroupArchivePath';
 
 const EXTENSIONS = [
   'seg.nrrd',
@@ -63,12 +64,18 @@ const props = defineProps<{
 
 const emit = defineEmits(['done']);
 
-const fileName = ref('');
+const fileNameValue = ref('');
 const valid = ref(true);
 const saving = ref(false);
 const fileFormat = ref(EXTENSIONS[0]);
 
 const segmentGroupStore = useSegmentGroupStore();
+const fileName = computed({
+  get: () => fileNameValue.value,
+  set: (value: string) => {
+    fileNameValue.value = sanitizeSegmentGroupFileStem(value, '');
+  },
+});
 
 async function saveSegmentGroup() {
   if (fileName.value.trim().length === 0) {
@@ -77,12 +84,14 @@ async function saveSegmentGroup() {
 
   saving.value = true;
   await useErrorMessage('Failed to save segment group', async () => {
+    const sanitizedFileName = sanitizeSegmentGroupFileStem(fileName.value);
+    fileNameValue.value = sanitizedFileName;
     const serialized = await writeSegmentation(
       fileFormat.value,
       segmentGroupStore.dataIndex[props.id],
       segmentGroupStore.metadataByID[props.id]
     );
-    saveAs(new Blob([serialized]), `${fileName.value}.${fileFormat.value}`);
+    saveAs(new Blob([serialized]), `${sanitizedFileName}.${fileFormat.value}`);
   });
   saving.value = false;
   emit('done');
@@ -90,7 +99,9 @@ async function saveSegmentGroup() {
 
 onMounted(() => {
   // trigger form validation check so can immediately save with default value
-  fileName.value = segmentGroupStore.metadataByID[props.id].name;
+  fileNameValue.value = sanitizeSegmentGroupFileStem(
+    segmentGroupStore.metadataByID[props.id].name
+  );
 });
 
 onKeyDown('Enter', () => {
diff --git a/src/components/SegmentGroupControls.vue b/src/components/SegmentGroupControls.vue
index b057c4ea5..35546f0c8 100644
--- a/src/components/SegmentGroupControls.vue
+++ b/src/components/SegmentGroupControls.vue
@@ -335,6 +335,7 @@ function deleteSelected() {
             </v-tooltip>
           </v-btn>
           <v-btn
+            data-testid="segment-group-save-button"
             icon="mdi-content-save"
             size="small"
             variant="text"
diff --git a/src/composables/__tests__/useKeyboardShortcuts.spec.ts b/src/composables/__tests__/useKeyboardShortcuts.spec.ts
new file mode 100644
index 000000000..f8607e455
--- /dev/null
+++ b/src/composables/__tests__/useKeyboardShortcuts.spec.ts
@@ -0,0 +1,25 @@
+import { describe, expect, it } from 'vitest';
+import { shouldIgnoreKeyboardShortcuts } from '../useKeyboardShortcuts';
+
+describe('shouldIgnoreKeyboardShortcuts', () => {
+  it('ignores shortcuts while an input is focused', () => {
+    const input = document.createElement('input');
+    expect(shouldIgnoreKeyboardShortcuts(input)).toBe(true);
+  });
+
+  it('ignores shortcuts while a textarea is focused', () => {
+    const textarea = document.createElement('textarea');
+    expect(shouldIgnoreKeyboardShortcuts(textarea)).toBe(true);
+  });
+
+  it('ignores shortcuts while a contenteditable element is focused', () => {
+    const editable = document.createElement('div');
+    editable.contentEditable = 'true';
+    expect(shouldIgnoreKeyboardShortcuts(editable)).toBe(true);
+  });
+
+  it('does not ignore shortcuts for non-editable controls', () => {
+    const button = document.createElement('button');
+    expect(shouldIgnoreKeyboardShortcuts(button)).toBe(false);
+  });
+});
diff --git a/src/composables/useKeyboardShortcuts.ts b/src/composables/useKeyboardShortcuts.ts
index 6126099f5..04d653369 100644
--- a/src/composables/useKeyboardShortcuts.ts
+++ b/src/composables/useKeyboardShortcuts.ts
@@ -7,6 +7,19 @@ import { ACTION_TO_FUNC } from './actions';
 
 export const actionToKey = ref(ACTION_TO_KEY);
 
+export function shouldIgnoreKeyboardShortcuts(
+  activeElement: Element | null = document.activeElement
+) {
+  if (!(activeElement instanceof HTMLElement)) {
+    return false;
+  }
+
+  return (
+    activeElement.isContentEditable ||
+    activeElement.closest('input, textarea, select, [role="textbox"]') !== null
+  );
+}
+
 export function useKeyboardShortcuts() {
   const keys = useMagicKeys();
   let unwatchFuncs = [] as Array<ReturnType<typeof whenever>>;
@@ -21,6 +34,10 @@ export function useKeyboardShortcuts() {
         const lastKey = individualKeys[individualKeys.length - 1];
 
         return whenever(keys[key], () => {
+          if (shouldIgnoreKeyboardShortcuts()) {
+            return;
+          }
+
           const shiftPressed = keys.current.has('shift');
           const lastPressedKey = Array.from(keys.current).pop();
           const currentKeyWithCase = shiftPressed
diff --git a/src/io/__tests__/fileName.spec.ts b/src/io/__tests__/fileName.spec.ts
new file mode 100644
index 000000000..870317026
--- /dev/null
+++ b/src/io/__tests__/fileName.spec.ts
@@ -0,0 +1,32 @@
+import { DEFAULT_FILE_STEM, sanitizeFileStem } from '@/src/io/fileName';
+import { describe, expect, it } from 'vitest';
+
+describe('io/fileName', () => {
+  describe('sanitizeFileStem', () => {
+    it('replaces invalid filename characters with readable spacing', () => {
+      expect(sanitizeFileStem('Liver: left/right*?')).to.equal(
+        'Liver left right'
+      );
+    });
+
+    it('collapses repeated whitespace and trims trailing dots and spaces', () => {
+      expect(sanitizeFileStem('  Liver    left.   ')).to.equal('Liver left');
+    });
+
+    it('handles reserved Windows filenames', () => {
+      expect(sanitizeFileStem('CON')).to.equal('CON_');
+    });
+
+    it('falls back when the sanitized stem would be empty', () => {
+      expect(sanitizeFileStem('  ..../\\\\****   ')).to.equal(
+        DEFAULT_FILE_STEM
+      );
+    });
+
+    it('preserves already-valid names', () => {
+      expect(sanitizeFileStem('Prostate Segmentation')).to.equal(
+        'Prostate Segmentation'
+      );
+    });
+  });
+});
diff --git a/src/io/fileName.ts b/src/io/fileName.ts
new file mode 100644
index 000000000..f9a145f35
--- /dev/null
+++ b/src/io/fileName.ts
@@ -0,0 +1,37 @@
+const TRAILING_DOTS_AND_SPACES = /[. ]+$/g;
+const REPEATED_WHITESPACE = /\s+/g;
+const WINDOWS_RESERVED_FILE_NAME = /^(con|prn|aux|nul|com[1-9]|lpt[1-9])$/i;
+const INVALID_FILE_STEM_CHARS = new Set([
+  '<',
+  '>',
+  ':',
+  '"',
+  '/',
+  '\\',
+  '|',
+  '?',
+  '*',
+]);
+
+export const DEFAULT_FILE_STEM = 'File';
+
+export function sanitizeFileStem(name: string, fallback = DEFAULT_FILE_STEM) {
+  let sanitized = name
+    .split('')
+    .map((char) => {
+      const isControlCharacter = char.charCodeAt(0) < 32;
+      return isControlCharacter || INVALID_FILE_STEM_CHARS.has(char)
+        ? ' '
+        : char;
+    })
+    .join('')
+    .replace(REPEATED_WHITESPACE, ' ')
+    .trim()
+    .replace(TRAILING_DOTS_AND_SPACES, '');
+
+  if (WINDOWS_RESERVED_FILE_NAME.test(sanitized)) {
+    sanitized = `${sanitized}_`;
+  }
+
+  return sanitized || fallback;
+}
diff --git a/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts b/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
new file mode 100644
index 000000000..d620bc3e9
--- /dev/null
+++ b/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
@@ -0,0 +1,25 @@
+import { makeSegmentGroupArchivePath } from '@/src/io/state-file/segmentGroupArchivePath';
+import { describe, expect, it } from 'vitest';
+
+describe('io/state-file/segmentGroupArchivePath', () => {
+  describe('makeSegmentGroupArchivePath', () => {
+    it('uses a sanitized segment group stem in the archive path', () => {
+      const usedPaths = new Set<string>();
+
+      expect(
+        makeSegmentGroupArchivePath('Liver: left/right*?', 'vti', usedPaths)
+      ).to.equal('labels/Liver left right.vti');
+    });
+
+    it('deduplicates colliding sanitized names case-insensitively', () => {
+      const usedPaths = new Set<string>();
+
+      expect(
+        makeSegmentGroupArchivePath('Liver/Left', 'vti', usedPaths)
+      ).to.equal('labels/Liver Left.vti');
+      expect(
+        makeSegmentGroupArchivePath('liver:left', 'vti', usedPaths)
+      ).to.equal('labels/liver left (2).vti');
+    });
+  });
+});
diff --git a/src/io/state-file/segmentGroupArchivePath.ts b/src/io/state-file/segmentGroupArchivePath.ts
new file mode 100644
index 000000000..f9dc492e2
--- /dev/null
+++ b/src/io/state-file/segmentGroupArchivePath.ts
@@ -0,0 +1,33 @@
+import { normalize } from '@/src/utils/path';
+import { sanitizeFileStem } from '@/src/io/fileName';
+
+export const DEFAULT_SEGMENT_GROUP_ARCHIVE_STEM = 'Segment Group';
+
+export function sanitizeSegmentGroupFileStem(
+  name: string,
+  fallback = DEFAULT_SEGMENT_GROUP_ARCHIVE_STEM
+) {
+  return sanitizeFileStem(name, fallback);
+}
+
+function makeArchivePathKey(path: string) {
+  return normalize(path).toLowerCase();
+}
+
+export function makeSegmentGroupArchivePath(
+  name: string,
+  extension: string,
+  usedPaths: Set<string>
+) {
+  const stem = sanitizeSegmentGroupFileStem(name);
+
+  let index = 1;
+  let path = normalize(`labels/${stem}.${extension}`);
+  while (usedPaths.has(makeArchivePathKey(path))) {
+    index += 1;
+    path = normalize(`labels/${stem} (${index}).${extension}`);
+  }
+
+  usedPaths.add(makeArchivePathKey(path));
+  return path;
+}
diff --git a/src/store/segmentGroups.ts b/src/store/segmentGroups.ts
index 8d605f433..14ba4dc3d 100644
--- a/src/store/segmentGroups.ts
+++ b/src/store/segmentGroups.ts
@@ -26,6 +26,7 @@ import {
   SegmentGroupMetadata,
   SegmentGroup,
 } from '../io/state-file/schema';
+import { makeSegmentGroupArchivePath } from '../io/state-file/segmentGroupArchivePath';
 import { FileEntry } from '../io/types';
 import { ensureSameSpace } from '../io/resample/resample';
 import { untilLoaded } from '../composables/untilLoaded';
@@ -458,6 +459,7 @@ export const useSegmentGroupStore = defineStore('segmentGroup', () => {
    */
   async function serialize(state: StateFile) {
     const { zip } = state;
+    const usedArchivePaths = new Set<string>();
 
     // orderByParent is implicitly preserved based on
     // the order of serialized entries.
@@ -469,7 +471,11 @@ export const useSegmentGroupStore = defineStore('segmentGroup', () => {
         const metadata = metadataByID[id];
         return {
           id,
-          path: `labels/${id}.${saveFormat.value}`,
+          path: makeSegmentGroupArchivePath(
+            metadata.name,
+            saveFormat.value,
+            usedArchivePaths
+          ),
           metadata: {
             ...metadata,
             parentImage: metadata.parentImage,
diff --git a/tests/pageobjects/volview.page.ts b/tests/pageobjects/volview.page.ts
index 30a124d89..e8b0e9704 100644
--- a/tests/pageobjects/volview.page.ts
+++ b/tests/pageobjects/volview.page.ts
@@ -14,12 +14,14 @@ export const setValueVueInput = async (
   input: ChainablePromiseElement,
   value: string
 ) => {
-  // input.setValue does not clear existing input, so click and backspace
+  // input.setValue does not clear existing input, so select all and replace.
   await input.click();
   const oldValue = await input.getValue();
   if (oldValue) {
-    const backspaces = new Array(oldValue.length).fill(Key.Backspace);
-    await browser.keys([Key.ArrowRight, ...backspaces]);
+    const selectAllModifier =
+      process.platform === 'darwin' ? 'Meta' : 'Control';
+    await browser.keys([selectAllModifier, 'a']);
+    await browser.keys(Key.Backspace);
   }
   await input.setValue(value);
 };
@@ -149,6 +151,22 @@ class VolViewPage extends Page {
     return $('button span i[class~=mdi-content-save-all]');
   }
 
+  get annotationsModuleTab() {
+    return $('button[data-testid="module-tab-Annotations"]');
+  }
+
+  get newSegmentGroupButton() {
+    return $('button*=New Group');
+  }
+
+  get activeDialog() {
+    return $('div[role="dialog"]');
+  }
+
+  get activeDialogInput() {
+    return this.activeDialog.$('input[placeholder="Unnamed Segment Group"]');
+  }
+
   get saveSessionFilenameInput() {
     return $('#session-state-filename');
   }
@@ -157,6 +175,33 @@ class VolViewPage extends Page {
     return $('span[data-testid="save-session-confirm-button"]');
   }
 
+  get segmentGroupsTab() {
+    return $('button.v-tab*=Segment Groups');
+  }
+
+  get segmentGroupSaveButtons() {
+    return $$('button[data-testid="segment-group-save-button"]');
+  }
+
+  get saveSegmentGroupFilenameInput() {
+    return this.activeDialog.$('#filename');
+  }
+
+  get saveSegmentGroupConfirmButton() {
+    return this.activeDialog.$('button=Save');
+  }
+
+  async clickFirstSegmentGroupSaveButton() {
+    await browser.waitUntil(async () => {
+      const buttons = await this.segmentGroupSaveButtons;
+      return (await buttons.length) >= 1;
+    });
+    const buttons = await this.segmentGroupSaveButtons;
+    await buttons[0].scrollIntoView();
+    await buttons[0].waitForClickable();
+    await buttons[0].click();
+  }
+
   async saveSession() {
     const save = this.saveButton;
     await save.click();
@@ -177,6 +222,20 @@ class VolViewPage extends Page {
     return fileName;
   }
 
+  async createSegmentGroup(name: string) {
+    const annotationsTab = await this.annotationsModuleTab;
+    await annotationsTab.click();
+
+    const newGroup = await this.newSegmentGroupButton;
+    await newGroup.waitForClickable();
+    await newGroup.click();
+
+    const input = await this.activeDialogInput;
+    await input.waitForDisplayed();
+    await setValueVueInput(input, name);
+    await browser.keys([Key.Enter]);
+  }
+
   get editLabelButtons() {
     return $$('button[data-testid="edit-label-button"]');
   }
diff --git a/tests/specs/segment-group-download.e2e.ts b/tests/specs/segment-group-download.e2e.ts
new file mode 100644
index 000000000..0a35456bc
--- /dev/null
+++ b/tests/specs/segment-group-download.e2e.ts
@@ -0,0 +1,67 @@
+import * as path from 'path';
+import * as fs from 'fs';
+import { cleanuptotal } from 'wdio-cleanuptotal-service';
+import { waitForFileExists } from './utils';
+import { volViewPage } from '../pageobjects/volview.page';
+import { TEMP_DIR } from '../../wdio.shared.conf';
+
+const SAVE_TIMEOUT = 40000;
+
+const loadSampleWithSegmentGroup = async (name: string) => {
+  await volViewPage.open();
+  await volViewPage.downloadProstateSample();
+  await volViewPage.waitForViews();
+  await volViewPage.createSegmentGroup(name);
+};
+
+const prepareDownloadedFilePath = (fileName: string) => {
+  const downloadedPath = path.join(TEMP_DIR, fileName);
+  if (fs.existsSync(downloadedPath)) {
+    fs.unlinkSync(downloadedPath);
+  }
+  cleanuptotal.addCleanup(async () => {
+    if (fs.existsSync(downloadedPath)) {
+      fs.unlinkSync(downloadedPath);
+    }
+  });
+  return downloadedPath;
+};
+
+const expectDirectSegmentGroupDownload = async (
+  segmentGroupName: string,
+  expectedStem: string
+) => {
+  await loadSampleWithSegmentGroup(segmentGroupName);
+
+  await volViewPage.clickFirstSegmentGroupSaveButton();
+
+  const input = await volViewPage.saveSegmentGroupFilenameInput;
+  await input.waitForDisplayed();
+  expect(await input.getValue()).toEqual(expectedStem);
+
+  const downloadedPath = prepareDownloadedFilePath(`${expectedStem}.seg.nrrd`);
+  const confirm = await volViewPage.saveSegmentGroupConfirmButton;
+  await confirm.click();
+
+  await waitForFileExists(downloadedPath, SAVE_TIMEOUT);
+};
+
+describe('Segment group download', () => {
+  it('sanitizes invalid characters for direct segment group downloads', async () => {
+    await expectDirectSegmentGroupDownload(
+      'Liver: left/right*?',
+      'Liver left right'
+    );
+  });
+
+  it('sanitizes reserved Windows names for direct segment group downloads', async () => {
+    await expectDirectSegmentGroupDownload('CON', 'CON_');
+  });
+
+  it('preserves valid segment group names for direct segment group downloads', async () => {
+    await expectDirectSegmentGroupDownload(
+      'Prostate Segmentation',
+      'Prostate Segmentation'
+    );
+  });
+});
diff --git a/tests/specs/session-state-lifecycle.e2e.ts b/tests/specs/session-state-lifecycle.e2e.ts
index 38424ed76..5d1e29a51 100644
--- a/tests/specs/session-state-lifecycle.e2e.ts
+++ b/tests/specs/session-state-lifecycle.e2e.ts
@@ -1,8 +1,8 @@
 import * as path from 'path';
 import * as fs from 'fs';
 import JSZip from 'jszip';
-import { MINIMAL_501_SESSION } from './configTestUtils';
-import { downloadFile, waitForFileExists } from './utils';
+import { MINIMAL_501_SESSION, PROSTATEX_DATASET } from './configTestUtils';
+import { downloadFile, openUrls, waitForFileExists } from './utils';
 import { setValueVueInput, volViewPage } from '../pageobjects/volview.page';
 import { TEMP_DIR } from '../../wdio.shared.conf';
 
@@ -15,25 +15,31 @@ const saveSession = async () => {
   return sessionFileName;
 };
 
-const parseManifest = async (sessionFileName: string) => {
+const parseSession = async (sessionFileName: string) => {
   const session = fs.readFileSync(path.join(TEMP_DIR, sessionFileName));
   const zip = await JSZip.loadAsync(session);
   const manifestFile = await zip.files['manifest.json'].async('string');
-  return JSON.parse(manifestFile);
+  return {
+    zip,
+    manifest: JSON.parse(manifestFile),
+  };
 };
 
 const saveAndParseManifest = async () => {
   const session = await saveSession();
+  let zip: JSZip | undefined;
   let manifest: Record<string, unknown> = {};
   await browser.waitUntil(async () => {
     try {
-      manifest = await parseManifest(session);
+      const parsed = await parseSession(session);
+      zip = parsed.zip;
+      manifest = parsed.manifest;
       return manifest.version !== undefined;
     } catch {
       return false;
     }
   });
-  return { session, manifest };
+  return { session, zip, manifest };
 };
 
 const loadSession = async () => {
@@ -122,4 +128,27 @@ describe('Session state lifecycle', () => {
     };
     expect(tools.rectangles.tools[0].strokeWidth).toEqual(editedStrokeWidth);
   });
+
+  it('sanitizes segment group names when saving labelmaps into the session zip', async () => {
+    await openUrls([PROSTATEX_DATASET]);
+
+    const segmentGroupName = 'Liver: left/right*?';
+    const sanitizedFilePath = 'labels/Liver left right.vti';
+
+    await volViewPage.createSegmentGroup(segmentGroupName);
+
+    const { manifest, zip } = await saveAndParseManifest();
+    if (!zip) {
+      throw new Error('Expected saved session zip to be available');
+    }
+    const labelMaps = manifest.labelMaps as Array<{
+      path: string;
+      metadata: { name: string };
+    }>;
+
+    expect(labelMaps.length).toEqual(1);
+    expect(labelMaps[0].metadata.name).toEqual(segmentGroupName);
+    expect(labelMaps[0].path).toEqual(sanitizedFilePath);
+    expect(Object.keys(zip.files)).toContain(sanitizedFilePath);
+  });
 });

From d9c563a92c40e3cc4e269b57a78d6ccd067c09cb Mon Sep 17 00:00:00 2001
From: Paul Elliott <paul@vizworkshop.com>
Date: Mon, 13 Apr 2026 17:22:13 -0400
Subject: [PATCH 2/3] refactor(segmentGroups): store archives under
 segmentations

---
 src/components/SaveSegmentGroupDialog.vue              |  2 +-
 .../__tests__/segmentGroupArchivePath.spec.ts          |  6 +++---
 src/io/state-file/segmentGroupArchivePath.ts           |  7 +++++--
 tests/pageobjects/volview.page.ts                      |  7 +++++--
 tests/specs/session-large-uri-base.e2e.ts              |  4 ++--
 tests/specs/session-state-lifecycle.e2e.ts             | 10 +++++-----
 6 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/src/components/SaveSegmentGroupDialog.vue b/src/components/SaveSegmentGroupDialog.vue
index 6dc198d4e..654db9f60 100644
--- a/src/components/SaveSegmentGroupDialog.vue
+++ b/src/components/SaveSegmentGroupDialog.vue
@@ -7,7 +7,7 @@
       <v-form v-model="valid" @submit.prevent="saveSegmentGroup">
         <v-text-field
           v-model="fileName"
-          hint="Filename used for downloads. Invalid filename characters are replaced automatically."
+          hint="Filename used for downloads."
           label="Filename"
           :rules="[validFileName]"
           required
diff --git a/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts b/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
index d620bc3e9..ab31ed0ec 100644
--- a/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
+++ b/src/io/state-file/__tests__/segmentGroupArchivePath.spec.ts
@@ -8,7 +8,7 @@ describe('io/state-file/segmentGroupArchivePath', () => {
 
       expect(
         makeSegmentGroupArchivePath('Liver: left/right*?', 'vti', usedPaths)
-      ).to.equal('labels/Liver left right.vti');
+      ).to.equal('segmentations/Liver left right.vti');
     });
 
     it('deduplicates colliding sanitized names case-insensitively', () => {
@@ -16,10 +16,10 @@ describe('io/state-file/segmentGroupArchivePath', () => {
 
       expect(
         makeSegmentGroupArchivePath('Liver/Left', 'vti', usedPaths)
-      ).to.equal('labels/Liver Left.vti');
+      ).to.equal('segmentations/Liver Left.vti');
       expect(
         makeSegmentGroupArchivePath('liver:left', 'vti', usedPaths)
-      ).to.equal('labels/liver left (2).vti');
+      ).to.equal('segmentations/liver left (2).vti');
     });
   });
 });
diff --git a/src/io/state-file/segmentGroupArchivePath.ts b/src/io/state-file/segmentGroupArchivePath.ts
index f9dc492e2..a907f9d2a 100644
--- a/src/io/state-file/segmentGroupArchivePath.ts
+++ b/src/io/state-file/segmentGroupArchivePath.ts
@@ -2,6 +2,7 @@ import { normalize } from '@/src/utils/path';
 import { sanitizeFileStem } from '@/src/io/fileName';
 
 export const DEFAULT_SEGMENT_GROUP_ARCHIVE_STEM = 'Segment Group';
+const SEGMENT_GROUP_ARCHIVE_DIR = 'segmentations';
 
 export function sanitizeSegmentGroupFileStem(
   name: string,
@@ -22,10 +23,12 @@ export function makeSegmentGroupArchivePath(
   const stem = sanitizeSegmentGroupFileStem(name);
 
   let index = 1;
-  let path = normalize(`labels/${stem}.${extension}`);
+  let path = normalize(`${SEGMENT_GROUP_ARCHIVE_DIR}/${stem}.${extension}`);
   while (usedPaths.has(makeArchivePathKey(path))) {
     index += 1;
-    path = normalize(`labels/${stem} (${index}).${extension}`);
+    path = normalize(
+      `${SEGMENT_GROUP_ARCHIVE_DIR}/${stem} (${index}).${extension}`
+    );
   }
 
   usedPaths.add(makeArchivePathKey(path));
diff --git a/tests/pageobjects/volview.page.ts b/tests/pageobjects/volview.page.ts
index e8b0e9704..076d49c98 100644
--- a/tests/pageobjects/volview.page.ts
+++ b/tests/pageobjects/volview.page.ts
@@ -7,7 +7,7 @@ import Page from './page';
 
 let lastId = 0;
 const getId = () => {
-  return lastId++;
+  return `${process.pid}-${Date.now()}-${lastId++}`;
 };
 
 export const setValueVueInput = async (
@@ -216,7 +216,10 @@ class VolViewPage extends Page {
     await confirm.click();
 
     cleanuptotal.addCleanup(async () => {
-      fs.unlinkSync(path.join(TEMP_DIR, fileName));
+      const filePath = path.join(TEMP_DIR, fileName);
+      if (fs.existsSync(filePath)) {
+        fs.unlinkSync(filePath);
+      }
     });
 
     return fileName;
diff --git a/tests/specs/session-large-uri-base.e2e.ts b/tests/specs/session-large-uri-base.e2e.ts
index 65ea022fa..42c5a84df 100644
--- a/tests/specs/session-large-uri-base.e2e.ts
+++ b/tests/specs/session-large-uri-base.e2e.ts
@@ -78,7 +78,7 @@ const createSessionZip = async (
     segmentGroups: [
       {
         id: 'seg-1',
-        path: 'labels/seg-1.nii.gz',
+        path: 'segmentations/seg-1.nii.gz',
         metadata: {
           name: 'Annotation',
           parentImage: '0',
@@ -100,7 +100,7 @@ const createSessionZip = async (
 
   const zip = new JSZip();
   zip.file('manifest.json', JSON.stringify(manifest, null, 2));
-  zip.file('labels/seg-1.nii.gz', labelmapNiftiGz);
+  zip.file('segmentations/seg-1.nii.gz', labelmapNiftiGz);
   return zip.generateAsync({ type: 'nodebuffer', compression: 'STORE' });
 };
 
diff --git a/tests/specs/session-state-lifecycle.e2e.ts b/tests/specs/session-state-lifecycle.e2e.ts
index 5d1e29a51..605f1cb7d 100644
--- a/tests/specs/session-state-lifecycle.e2e.ts
+++ b/tests/specs/session-state-lifecycle.e2e.ts
@@ -133,7 +133,7 @@ describe('Session state lifecycle', () => {
     await openUrls([PROSTATEX_DATASET]);
 
     const segmentGroupName = 'Liver: left/right*?';
-    const sanitizedFilePath = 'labels/Liver left right.vti';
+    const sanitizedFilePath = 'segmentations/Liver left right.vti';
 
     await volViewPage.createSegmentGroup(segmentGroupName);
 
@@ -141,14 +141,14 @@ describe('Session state lifecycle', () => {
     if (!zip) {
       throw new Error('Expected saved session zip to be available');
     }
-    const labelMaps = manifest.labelMaps as Array<{
+    const segmentGroups = manifest.segmentGroups as Array<{
       path: string;
       metadata: { name: string };
     }>;
 
-    expect(labelMaps.length).toEqual(1);
-    expect(labelMaps[0].metadata.name).toEqual(segmentGroupName);
-    expect(labelMaps[0].path).toEqual(sanitizedFilePath);
+    expect(segmentGroups.length).toEqual(1);
+    expect(segmentGroups[0].metadata.name).toEqual(segmentGroupName);
+    expect(segmentGroups[0].path).toEqual(sanitizedFilePath);
     expect(Object.keys(zip.files)).toContain(sanitizedFilePath);
   });
 });

From badead64a6b36cd8ca9e23634f8fbb9887d50f67 Mon Sep 17 00:00:00 2001
From: Paul Elliott <paul@vizworkshop.com>
Date: Thu, 16 Apr 2026 11:52:08 -0400
Subject: [PATCH 3/3] fix: improve itk-wasm pipeline error messages shown to
 users

itk-wasm WASM modules throw raw numeric pointers when they crash,
and stderr output only goes to console.error, not the thrown error.
This made load failures show meaningless numbers or empty messages.

- Wrap readDicomTags errors in handleDicomFile and handleDicomStream
  with human-readable messages, preserving originals as cause
- Check runTask returnValue/stderr for non-crash pipeline failures
- Add getErrorDetail utility for extracting meaningful error messages
---
 src/io/dicom.ts                               | 14 +++++++++++++-
 src/io/import/processors/handleDicomFile.ts   | 15 +++++++++++++--
 src/io/import/processors/handleDicomStream.ts |  8 +++++++-
 src/utils/index.ts                            |  4 ++++
 4 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/src/io/dicom.ts b/src/io/dicom.ts
index 53bcccf65..2f9b1b441 100644
--- a/src/io/dicom.ts
+++ b/src/io/dicom.ts
@@ -47,11 +47,23 @@ async function runTask(
   inputs: any[],
   outputs: any[]
 ) {
-  return runPipeline(module, args, outputs, inputs, {
+  const result = await runPipeline(module, args, outputs, inputs, {
     webWorker: getWorker(),
     pipelineBaseUrl: itkConfig.pipelinesUrl,
     pipelineWorkerUrl: itkConfig.pipelineWorkerUrl,
+  }).catch((error) => {
+    throw new Error(
+      `itk-wasm pipeline "${module}" crashed (check browser console for details)`,
+      { cause: error }
+    );
   });
+  if (result.returnValue !== 0) {
+    const detail = result.stderr?.trim() || 'unknown error';
+    throw new Error(
+      `itk-wasm pipeline "${module}" exited with code ${result.returnValue}: ${detail}`
+    );
+  }
+  return result;
 }
 
 /**
diff --git a/src/io/import/processors/handleDicomFile.ts b/src/io/import/processors/handleDicomFile.ts
index 818da9e34..a1e74beb1 100644
--- a/src/io/import/processors/handleDicomFile.ts
+++ b/src/io/import/processors/handleDicomFile.ts
@@ -6,6 +6,7 @@ import { ReadDicomTagsFunction } from '@/src/core/streaming/dicom/dicomMetaLoade
 import { ImportHandler, asIntermediateResult } from '@/src/io/import/common';
 import { getWorker } from '@/src/io/itk/worker';
 import { FILE_EXT_TO_MIME } from '@/src/io/mimeTypes';
+import { getErrorDetail } from '@/src/utils';
 import { readDicomTags } from '@itk-wasm/dicom';
 
 /**
@@ -22,8 +23,18 @@ const handleDicomFile: ImportHandler = async (dataSource) => {
   }
 
   const readTags: ReadDicomTagsFunction = async (file) => {
-    const result = await readDicomTags(file, { webWorker: getWorker() });
-    return result.tags;
+    try {
+      const result = await readDicomTags(file, { webWorker: getWorker() });
+      return result.tags;
+    } catch (error) {
+      const detail = getErrorDetail(
+        error,
+        'the file could not be parsed as valid DICOM (check browser console for details)'
+      );
+      throw new Error(`Failed to read DICOM tags: ${detail}`, {
+        cause: error,
+      });
+    }
   };
 
   const metaLoader = new DicomFileMetaLoader(dataSource.file, readTags);
diff --git a/src/io/import/processors/handleDicomStream.ts b/src/io/import/processors/handleDicomStream.ts
index 8c8787c5b..f6c3ace80 100644
--- a/src/io/import/processors/handleDicomStream.ts
+++ b/src/io/import/processors/handleDicomStream.ts
@@ -14,6 +14,7 @@ import {
 } from '@/src/io/import/common';
 import { getWorker } from '@/src/io/itk/worker';
 import { FILE_EXT_TO_MIME } from '@/src/io/mimeTypes';
+import { getErrorDetail } from '@/src/utils';
 import { readDicomTags } from '@itk-wasm/dicom';
 import { Tags } from '@/src/core/dicomTags';
 import { useMessageStore } from '@/src/store/messages';
@@ -34,8 +35,13 @@ const handleDicomStream: ImportHandler = async (dataSource) => {
       const result = await readDicomTags(file, { webWorker: getWorker() });
       return result.tags;
     } catch (error) {
+      const detail = getErrorDetail(
+        error,
+        'the file could not be parsed as valid DICOM (check browser console for details)'
+      );
       throw new Error(
-        `Failed to read DICOM tags from ${dataSource.uri}: ${error}`
+        `Failed to read DICOM tags from ${dataSource.uri}: ${detail}`,
+        { cause: error }
       );
     }
   };
diff --git a/src/utils/index.ts b/src/utils/index.ts
index ffbb94ad8..eb1140850 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -215,6 +215,10 @@ export function ensureError(e: unknown) {
   return e instanceof Error ? e : new Error(JSON.stringify(e));
 }
 
+export function getErrorDetail(error: unknown, fallback: string): string {
+  return error instanceof Error && error.message ? error.message : fallback;
+}
+
 // remove undefined properties
 export function cleanUndefined(obj: Object) {
   return Object.entries(obj).reduce(