fix(views): keep active view selected after data binding

Tools and rendering panels resolve currentImageID through activeView and viewByID.

Select the first startup view directly, then enforce a visible active view when data binds.

Session restore reuses that binding path when manifest data IDs are rebound.

Added store coverage for startup, normal data load, and session rebinding.

Relaxed the ultrasound spacing e2e assertion around the physical-spacing range.

Verified with focused Vitest, lint, and full Chrome e2e.

Author: PaulHax

src/store/__tests__/views.spec.ts

@@ -0,0 +1,58 @@
+import { describe, it, beforeEach, expect } from 'vitest';
+import { setActivePinia, createPinia } from 'pinia';
+import { useViewStore } from '@/src/store/views';
+import type { Manifest } from '@/src/io/state-file/schema';
+
+describe('View store', () => {
+  beforeEach(() => {
+    setActivePinia(createPinia());
+  });
+
+  it('selects the first initial visible view', () => {
+    const store = useViewStore();
+
+    expect(store.activeView).toBe(store.visibleViews[0].id);
+  });
+
+  it('selects a visible view when data is attached to the default layout', () => {
+    const store = useViewStore();
+
+    store.setActiveView(null);
+    store.setDataForAllViews('image-1');
+
+    expect(store.activeView).toBe(store.visibleViews[0].id);
+  });
+
+  it('selects a visible view when session data IDs are rebound', () => {
+    const store = useViewStore();
+    const manifest: Manifest = {
+      version: '6.1.0',
+      dataSources: [],
+      activeView: null,
+      layout: {
+        direction: 'column',
+        items: [{ type: 'slot', slotIndex: 0 }],
+      },
+      layoutSlots: ['view-1'],
+      viewByID: {
+        'view-1': {
+          id: 'view-1',
+          type: '2D',
+          dataID: 'state-image',
+          name: 'Axial',
+          options: {
+            orientation: 'Axial',
+          },
+        },
+      },
+    };
+
+    store.deserializeLayout(manifest);
+    expect(store.activeView).toBeNull();
+
+    store.bindViewsToData('state-image', 'loaded-image', manifest);
+
+    expect(store.activeView).toBe('view-1');
+    expect(store.viewByID['view-1'].dataID).toBe('loaded-image');
+  });
+});

src/store/views.ts

@@ -147,13 +147,14 @@ export const useViewStore = defineStore('view', () => {
   }
 
   function ensureActiveViewIsVisible() {
-    if (!visibleViews.value.length) {
+    const views = visibleViews.value;
+    if (!views.length) {
       setActiveView(null);
       return;
     }
 
-    if (!visibleViews.value.find((view) => view.id === activeView.value)) {
-      setActiveView(visibleViews.value[0].id);
+    if (!views.find((view) => view.id === activeView.value)) {
+      setActiveView(views[0].id);
     }
   }
 
@@ -263,6 +264,8 @@ export const useViewStore = defineStore('view', () => {
     if (!(viewID in viewByID)) return;
     viewByID[viewID].dataID = dataID;
     ViewDataChangeEvent.trigger(viewID, dataID);
+    // Global tools resolve their image through activeView.
+    ensureActiveViewIsVisible();
   }
 
   function setDataForActiveView(dataID: Maybe<string>) {
@@ -342,16 +345,19 @@ export const useViewStore = defineStore('view', () => {
 
     Object.entries(manifest.viewByID).forEach(([id, view]) => {
       if (view.dataID === stateID && viewByID[id]) {
-        viewByID[id].dataID = storeID;
-        ViewDataChangeEvent.trigger(id, storeID);
+        setDataForView(id, storeID);
       }
     });
   }
 
   // initialization
 
   firstLayout.views.forEach((viewInit) => {
-    layoutSlots.value.push(addView(viewInit));
+    const viewId = addView(viewInit);
+    layoutSlots.value.push(viewId);
+    if (!activeView.value) {
+      setActiveView(viewId);
+    }
   });
 
   watch(disabledViewTypes, () => {

tests/specs/ultrasound-spacing.e2e.ts

@@ -2,19 +2,12 @@ import { US_MULTIFRAME_DICOM } from './configTestUtils';
 import { openUrls } from './utils';
 import { volViewPage } from '../pageobjects/volview.page';
 
-// Vertical ruler in canvas pixels. The reported length in mm depends on
-// canvas size, image-fit zoom, and the applied spacing. With the fix the
-// VTK spacing comes from SequenceOfUltrasoundRegions (~0.5105 mm/image-px);
-// without the fix it falls back to 1 mm/image-px and the ruler reports
-// roughly 1.96× the with-fix value.
+// The exact ruler length depends on platform-specific viewport geometry, but
+// the unspaced fallback is roughly twice as large because the DICOM fixture's
+// PhysicalDeltaX/Y is 0.5104970559 mm/pixel.
 const CLICK_DY = 100;
-
-// At the shared viewport (1200×800), with the fix active the ruler reports
-// about 49 mm. Without the fix the same ruler reports about 97 mm. A wide
-// tolerance lets the assertion absorb minor canvas-size jitter between
-// runners while still excluding the 1 mm fallback.
-const EXPECTED_LENGTH_MM = 49;
-const LENGTH_TOLERANCE_MM = 8;
+const MIN_SPACED_LENGTH_MM = 30;
+const MAX_SPACED_LENGTH_MM = 80;
 
 describe('Ultrasound image spacing', () => {
   it('ruler length reflects physical spacing from SequenceOfUltrasoundRegions', async () => {
@@ -27,15 +20,12 @@ describe('Ultrasound image spacing', () => {
 
     // element.click({ x, y }) offsets are measured from the element's center,
     // so x:0 / y:0 is the canvas center.
-    const views = await volViewPage.views;
-    const canvas = views[0];
+    const canvas = await $('div[data-testid="vtk-view vtk-two-view"] canvas');
 
     await canvas.click({ x: 0, y: -CLICK_DY / 2 });
     await canvas.click({ x: 0, y: CLICK_DY / 2 });
 
-    const annotationsTab = await $(
-      'button[data-testid="module-tab-Annotations"]'
-    );
+    const annotationsTab = await volViewPage.annotationsModuleTab;
     await annotationsTab.click();
 
     const measurementsTab = await $('button.v-tab*=Measurements');
@@ -64,7 +54,7 @@ describe('Ultrasound image spacing', () => {
 
     console.log(`[ultrasound-spacing] measured ruler length: ${lengthMm} mm`);
 
-    expect(lengthMm).toBeGreaterThan(EXPECTED_LENGTH_MM - LENGTH_TOLERANCE_MM);
-    expect(lengthMm).toBeLessThan(EXPECTED_LENGTH_MM + LENGTH_TOLERANCE_MM);
+    expect(lengthMm).toBeGreaterThan(MIN_SPACED_LENGTH_MM);
+    expect(lengthMm).toBeLessThan(MAX_SPACED_LENGTH_MM);
   });
 });