@morscherlab/mint-sdk 1.0.63 → 1.1.0-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mint-sdk",
-  "version": "1.0.63",
+  "version": "1.1.0-beta.2",
   "description": "MINT Platform SDK — Vue 3 components, composables, and types for plugin development. MINT = Mass-spec INtegrated Toolkit.",
   "type": "module",
   "main": "./dist/index.js",
@@ -54,7 +54,9 @@
     "src"
   ],
   "scripts": {
-    "build": "vue-tsc --noEmit && vite build && node scripts/check-package-exports.mjs",
+    "build": "vue-tsc --noEmit && bun run build:library && bun run build:generated-ui && node scripts/check-package-exports.mjs",
+    "build:library": "vite build",
+    "build:generated-ui": "vite build --config vite.generated-ui.config.ts",
     "check:exports": "node scripts/check-package-exports.mjs",
     "dev": "vite build --watch",
     "typecheck": "vue-tsc --noEmit",
@@ -81,13 +83,15 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.6",
-    "axios": "1.13.6"
+    "axios": "1.13.6",
+    "plotly.js-dist-min": "^3.7.0"
   },
   "devDependencies": {
     "@histoire/plugin-vue": "1.0.0-beta.1",
     "@simplewebauthn/browser": "10.0.0",
     "@simplewebauthn/types": "10.0.0",
     "@types/node": "22.19.13",
+    "@types/plotly.js": "^3.0.10",
     "@vitejs/plugin-vue": "6.0.5",
     "@vue/test-utils": "2.4.6",
     "happy-dom": "15.11.7",

package/src/__tests__/components/GeneratedPathInput.test.ts

@@ -0,0 +1,132 @@
+import { flushPromises, mount } from '@vue/test-utils'
+import { createPinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import ArtifactSelectorModal from '../../components/ArtifactSelectorModal.vue'
+import FileUploader from '../../components/FileUploader.vue'
+import GeneratedPathInput from '../../components/GeneratedPathInput.vue'
+import type { AnalysisArtifactDetail } from '../../types/analysisArtifactTypes'
+
+describe('GeneratedPathInput', () => {
+  beforeEach(() => {
+    Object.assign(window, {
+      __MINT_PLATFORM__: {
+        isIntegrated: true,
+        platformApiUrl: '/api',
+        theme: 'system',
+        currentExperimentId: 42,
+      },
+    })
+  })
+
+  afterEach(() => {
+    delete (window as unknown as { __MINT_PLATFORM__?: unknown }).__MINT_PLATFORM__
+    vi.unstubAllGlobals()
+  })
+
+  it('should preserve selected directory paths for SDK staging', async () => {
+    const wrapper = mount(GeneratedPathInput, {
+      global: { plugins: [createPinia()], stubs: { Teleport: true } },
+    })
+    const files = [new File(['a'], 'a.txt'), new File(['b'], 'b.txt')]
+
+    await wrapper.findComponent(FileUploader).vm.$emit(
+      'upload',
+      files,
+      'dataset',
+      ['dataset/a.txt', 'dataset/sub/b.txt'],
+    )
+
+    expect(wrapper.emitted('update:modelValue')?.at(-1)?.[0]).toEqual({
+      kind: 'path',
+      files,
+      rootName: 'dataset',
+      relativePaths: ['dataset/a.txt', 'dataset/sub/b.txt'],
+    })
+  })
+
+  it('should emit one path selection per file when multiple paths are requested', async () => {
+    const wrapper = mount(GeneratedPathInput, {
+      props: { multiple: true },
+      global: { plugins: [createPinia()], stubs: { Teleport: true } },
+    })
+    const files = [new File(['a'], 'a.txt'), new File(['b'], 'b.txt')]
+
+    await wrapper.findComponent(FileUploader).vm.$emit(
+      'upload',
+      files,
+      undefined,
+      ['a.txt', 'b.txt'],
+    )
+
+    expect(wrapper.emitted('update:modelValue')?.at(-1)?.[0]).toEqual([
+      { kind: 'path', files: [files[0]], relativePaths: ['a.txt'] },
+      { kind: 'path', files: [files[1]], relativePaths: ['b.txt'] },
+    ])
+  })
+
+  it('should remove a file from the submitted value when the uploader removes it', async () => {
+    const wrapper = mount(GeneratedPathInput, {
+      global: { plugins: [createPinia()], stubs: { Teleport: true } },
+    })
+    const uploader = wrapper.findComponent(FileUploader)
+    const file = new File(['a'], 'a.txt')
+
+    const input = uploader.get('input[type="file"]')
+    Object.defineProperty(input.element, 'files', { value: [file] })
+    await input.trigger('change')
+    await wrapper.setProps({
+      modelValue: { kind: 'path', files: [file], relativePaths: ['a.txt'] },
+    })
+    await wrapper.get('button[aria-label="Remove a.txt"]').trigger('click')
+
+    expect(wrapper.emitted('update:modelValue')?.at(-1)?.[0]).toBeNull()
+  })
+
+  it('should download a selected platform file artifact for staging', async () => {
+    const fetcher = vi.fn().mockResolvedValue(new Response('artifact-data', {
+      headers: { 'Content-Type': 'text/csv' },
+    }))
+    vi.stubGlobal('fetch', fetcher)
+    const wrapper = mount(GeneratedPathInput, {
+      global: { plugins: [createPinia()], stubs: { Teleport: true } },
+    })
+    const detail = {
+      id: 7,
+      experiment_id: 42,
+      plugin_id: 'leaf',
+      artifact_key: 'matrix',
+      display_name: 'Matrix',
+      status: 'active',
+      result_keys: ['file'],
+      tree: [],
+      summary: null,
+      result: {
+        schema_version: 'mint.analysis_file.v1',
+        filename: 'matrix.csv',
+        file: {
+          key: 'analysis-artifacts/matrix/v1/matrix.csv',
+          plugin_id: 'leaf',
+          experiment_id: 42,
+        },
+      },
+    } satisfies AnalysisArtifactDetail
+
+    wrapper.findComponent(ArtifactSelectorModal).vm.$emit('selectDetail', detail)
+    await flushPromises()
+
+    const selection = wrapper.emitted('update:modelValue')?.at(-1)?.[0] as {
+      files: File[]
+      relativePaths: string[]
+    }
+    expect({
+      url: fetcher.mock.calls[0]?.[0],
+      filename: selection.files[0]?.name,
+      relativePaths: selection.relativePaths,
+    }).toEqual({
+      url: '/api/experiments/42/objects/analysis-artifacts/matrix/v1/matrix.csv?plugin_id=leaf&format=raw',
+      filename: 'matrix.csv',
+      relativePaths: ['matrix.csv'],
+    })
+  })
+})

package/src/__tests__/components/GeneratedPlotlyResult.test.ts

@@ -0,0 +1,117 @@
+import { flushPromises, mount, type VueWrapper } from '@vue/test-utils'
+import { nextTick } from 'vue'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import GeneratedPlotlyResult from '../../components/GeneratedPlotlyResult.vue'
+
+const plotly = vi.hoisted(() => ({
+  purge: vi.fn(),
+  react: vi.fn(),
+}))
+
+vi.mock('plotly.js-dist-min', () => ({ default: plotly }))
+
+async function mountAndRecover(
+  fallback?: { media_type: string; data: string },
+): Promise<VueWrapper> {
+  const wrapper = mount(GeneratedPlotlyResult, {
+    props: {
+      spec: { data: [] },
+      ...(fallback ? { fallback } : {}),
+    },
+  })
+  await flushPromises()
+
+  plotly.react.mockResolvedValue(undefined)
+  await wrapper.setProps({
+    spec: { data: [{ type: 'scatter', x: [1], y: [2] }] },
+  })
+  await flushPromises()
+
+  return wrapper
+}
+
+describe('GeneratedPlotlyResult', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    plotly.react.mockRejectedValue(new Error('<script>unsafe details</script>'))
+  })
+
+  it('should render a safe error when Plotly fails without a fallback', async () => {
+    const wrapper = mount(GeneratedPlotlyResult, {
+      props: { spec: { data: [] } },
+    })
+    await flushPromises()
+
+    expect(wrapper.get('[role="alert"]').text()).toBe('Unable to display this chart.')
+  })
+
+  it('should render the static image when Plotly fails with a fallback', async () => {
+    const wrapper = mount(GeneratedPlotlyResult, {
+      props: {
+        spec: { data: [] },
+        fallback: { media_type: 'image/png', data: 'cG5n' },
+      },
+    })
+    await flushPromises()
+
+    expect(wrapper.get('img').attributes('src')).toBe('data:image/png;base64,cG5n')
+  })
+
+  it('should not redraw an immutable result for nested spec mutations', async () => {
+    plotly.react.mockResolvedValue(undefined)
+    const wrapper = mount(GeneratedPlotlyResult, {
+      props: { spec: { data: [{ x: [1] }] } },
+    })
+    await flushPromises()
+
+    const spec = wrapper.props('spec') as { data: Array<{ x: number[] }> }
+    spec.data[0]!.x.push(2)
+    await nextTick()
+    await flushPromises()
+
+    expect(plotly.react).toHaveBeenCalledTimes(1)
+  })
+
+  it.each([
+    ['Heatmap', { type: 'heatmap', z: [[1, 2], [3, 4]] }],
+    ['Scatter3d', { type: 'scatter3d', x: [1], y: [2], z: [3] }],
+  ])('should pass a %s trace to the Plotly renderer', async (_name, trace) => {
+    plotly.react.mockResolvedValue(undefined)
+    mount(GeneratedPlotlyResult, {
+      props: { spec: { data: [trace] } },
+    })
+    await flushPromises()
+
+    expect(plotly.react).toHaveBeenCalledWith(
+      expect.any(HTMLElement),
+      [trace],
+      {},
+      { responsive: true, displaylogo: false },
+    )
+  })
+
+  it('should retry Plotly when a new immutable spec follows a render failure', async () => {
+    await mountAndRecover()
+
+    expect(plotly.react).toHaveBeenCalledTimes(2)
+  })
+
+  it('should remove the fallback after a new immutable spec renders successfully', async () => {
+    const wrapper = await mountAndRecover({ media_type: 'image/png', data: 'cG5n' })
+
+    expect(wrapper.find('img').exists()).toBe(false)
+  })
+
+  it('should remove the error after a new immutable spec renders successfully', async () => {
+    const wrapper = await mountAndRecover()
+
+    expect(wrapper.find('[role="alert"]').exists()).toBe(false)
+  })
+
+  it('should restore the interactive chart after a new immutable spec renders successfully', async () => {
+    const wrapper = await mountAndRecover()
+
+    expect(wrapper.get('.mint-generated-result__plotly').isVisible()).toBe(true)
+  })
+})

package/src/__tests__/components/GeneratedPluginView.test.ts

@@ -0,0 +1,230 @@
+import { flushPromises, mount } from '@vue/test-utils'
+import { createPinia } from 'pinia'
+import { computed, ref } from 'vue'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import GeneratedPluginView from '../../components/GeneratedPluginView.vue'
+import GeneratedResultRenderer from '../../components/GeneratedResultRenderer.vue'
+import JobsStatusTray from '../../components/JobsStatusTray.vue'
+import PluginWorkspaceView from '../../components/PluginWorkspaceView.vue'
+
+const generated = vi.hoisted(() => ({
+  initialize: vi.fn(),
+  submit: vi.fn(),
+  loadResult: vi.fn(),
+  resultForJob: vi.fn(),
+  options: undefined as unknown,
+  jobs: [] as Array<Record<string, unknown>>,
+}))
+
+vi.mock('../../composables/useGeneratedAnalysis', async () => {
+  const { computed, ref, shallowRef } = await import('vue')
+  return {
+    useGeneratedAnalysis: (options: unknown) => {
+      generated.options = options
+      const jobs = shallowRef(generated.jobs)
+      return ({
+      manifest: shallowRef({
+        schema_version: '1',
+        plugin: {
+          name: 'Demo', version: '1.0.0', description: 'Demo plugin', routes_prefix: '/demo',
+        },
+        ui: { title: 'Demo analysis', description: 'Backend-only workspace' },
+        jobs: [
+          {
+            id: 'run',
+            title: 'Run analysis',
+            description: 'Analyze one dataset',
+            cpu: 2,
+            input_schema: {
+              type: 'object',
+              properties: { threshold: { type: 'number', title: 'Threshold', default: 2.5 } },
+            },
+            output_schema: {},
+          },
+          {
+            id: 'sync',
+            title: 'Sync service',
+            description: 'Synchronize remote metadata',
+            cpu: 0,
+            lifecycle: 'service',
+            profile: { kind: 'service', timeoutSeconds: 60, maxConcurrency: 2 },
+            input_schema: { type: 'object', properties: {} },
+            output_schema: {},
+          },
+        ],
+      }),
+      session: shallowRef({ id: 'session-1' }),
+      jobs,
+      latestResult: computed(() => ({ kind: 'text', text: 'complete' })),
+      isLoading: ref(false),
+      isSubmitting: ref(false),
+      error: shallowRef(null),
+      initialize: generated.initialize,
+      submit: generated.submit,
+      loadResult: generated.loadResult,
+      resultForJob: generated.resultForJob,
+      refreshJobs: vi.fn(),
+      jobsAdapter: {},
+      })
+    },
+  }
+})
+
+vi.mock('../../composables/usePlatformContext', () => ({
+  usePlatformContext: vi.fn(() => ({
+    isIntegrated: computed(() => false),
+    context: ref({ isIntegrated: false, theme: 'system' }),
+    plugin: computed(() => undefined),
+    user: computed(() => undefined),
+    theme: computed(() => 'system'),
+    features: computed(() => undefined),
+    navigate: vi.fn(),
+    notify: vi.fn(),
+    sendToPlatform: vi.fn(),
+  })),
+}))
+
+vi.mock('../../composables/useTheme', () => ({
+  useTheme: vi.fn(() => ({ isDark: ref(false), theme: ref('light'), toggleTheme: vi.fn() })),
+}))
+
+describe('GeneratedPluginView', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    const baseJob = {
+      kind: 'analysis',
+      name: 'Run analysis',
+      status: 'completed',
+      progress: {
+        current_file: 0, total_files: 0, current_filename: null, percent: 100, message: '', stage: 'completed',
+      },
+      queue_position: 0,
+      warnings: [],
+      error: null,
+      output_path: null,
+      save_path: null,
+      session_id: 'session-1',
+      folders: [],
+      folder_path: null,
+      user_id: 'user-1',
+      owner_user_id: 'user-1',
+      experiment_id: null,
+      extraction_result_id: null,
+      metadata: { definition_id: 'run', has_result: true },
+      created_at: '',
+      started_at: '',
+      completed_at: '',
+      can_cancel: false,
+      can_delete: true,
+    }
+    generated.jobs = [
+      { ...baseJob, id: 'job-1', job_id: 'job-1' },
+      { ...baseJob, id: 'job-2', job_id: 'job-2', session_id: 'shared-session' },
+    ]
+    generated.initialize.mockResolvedValue(undefined)
+    generated.submit.mockResolvedValue(undefined)
+    generated.loadResult.mockResolvedValue({ kind: 'text', text: 'complete' })
+    generated.resultForJob.mockReturnValue({ kind: 'text', text: 'complete' })
+  })
+
+  it('composes the selected B workspace from SDK-owned layout, form, jobs, and results', async () => {
+    const wrapper = mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo' },
+      global: {
+        plugins: [createPinia()],
+        stubs: {
+          'router-link': { template: '<a><slot /></a>' },
+          Teleport: true,
+        },
+      },
+    })
+    await flushPromises()
+
+    expect({
+      workspace: wrapper.findComponent(PluginWorkspaceView).props(),
+      result: wrapper.findComponent(GeneratedResultRenderer).text(),
+      jobs: wrapper.findComponent(JobsStatusTray).exists(),
+      jobSource: wrapper.findComponent(JobsStatusTray).props('source'),
+      legacyJobs: wrapper.findComponent(JobsStatusTray).props('jobs'),
+      legacyAdapter: wrapper.findComponent(JobsStatusTray).props('adapter'),
+    }).toMatchObject({
+      workspace: {
+        title: 'Demo analysis',
+        subtitle: 'Backend-only workspace',
+        sidebarPosition: 'left',
+        showFormActions: true,
+        values: { threshold: 2.5 },
+      },
+      result: 'complete',
+      jobs: true,
+      jobSource: expect.any(Object),
+      legacyJobs: undefined,
+      legacyAdapter: undefined,
+    })
+  })
+
+  it('submits normalized form values through the current job definition', async () => {
+    const wrapper = mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo' },
+      global: { plugins: [createPinia()], stubs: { 'router-link': true, Teleport: true } },
+    })
+    await flushPromises()
+
+    wrapper.findComponent(PluginWorkspaceView).vm.$emit('form-submit', 'run', { threshold: 4 })
+    await flushPromises()
+
+    expect(generated.submit).toHaveBeenCalledWith('run', { threshold: 4 })
+  })
+
+  it('describes host service jobs without a misleading CPU reservation', async () => {
+    const wrapper = mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo' },
+      global: { plugins: [createPinia()], stubs: { 'router-link': true, Teleport: true } },
+    })
+    await flushPromises()
+
+    wrapper.findComponent(PluginWorkspaceView).vm.$emit('update:activeView', 'sync')
+    await flushPromises()
+
+    expect(wrapper.find('[aria-label="Job resource requirements"]').text()).toBe('Host service')
+  })
+
+  it('should pass the host transport to the generated analysis composable', async () => {
+    const transport = vi.fn()
+    mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo', transport },
+      global: { plugins: [createPinia()], stubs: { 'router-link': true, Teleport: true } },
+    })
+    await flushPromises()
+
+    expect(generated.options).toMatchObject({ baseUrl: '/api/demo', transport })
+  })
+
+  it('should lazily load the current job result by job id', async () => {
+    mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo' },
+      global: { plugins: [createPinia()], stubs: { 'router-link': true, Teleport: true } },
+    })
+    await flushPromises()
+
+    expect(generated.loadResult).toHaveBeenCalledWith(expect.objectContaining({ job_id: 'job-1' }))
+  })
+
+  it('should display the exact historical job selected from the jobs tray', async () => {
+    generated.resultForJob.mockImplementation(jobId => ({ kind: 'text', text: String(jobId) }))
+    const wrapper = mount(GeneratedPluginView, {
+      props: { baseUrl: '/api/demo' },
+      global: { plugins: [createPinia()], stubs: { 'router-link': true, Teleport: true } },
+    })
+    await flushPromises()
+
+    wrapper.findComponent(JobsStatusTray).vm.$emit('select', generated.jobs[1])
+    await flushPromises()
+
+    expect({
+      result: wrapper.findComponent(GeneratedResultRenderer).text(),
+      loadedJob: generated.loadResult.mock.calls.at(-1)?.[0]?.job_id,
+    }).toEqual({ result: 'job-2', loadedJob: 'job-2' })
+  })
+})

package/src/__tests__/components/GeneratedResultRenderer.test.ts

@@ -0,0 +1,93 @@
+import { mount } from '@vue/test-utils'
+import { describe, expect, it } from 'vitest'
+
+import ChartContainer from '../../components/ChartContainer.vue'
+import DataFrame from '../../components/DataFrame.vue'
+import GeneratedResultRenderer from '../../components/GeneratedResultRenderer.vue'
+
+describe('GeneratedResultRenderer', () => {
+  it('renders tabular results with the standard DataFrame component', () => {
+    const wrapper = mount(GeneratedResultRenderer, {
+      props: {
+        result: {
+          kind: 'table',
+          columns: ['sample', 'value'],
+          rows: [{ sample: 'A', value: 1.5 }],
+        },
+      },
+    })
+
+    expect(wrapper.findComponent(DataFrame).props()).toMatchObject({
+      data: [{ sample: 'A', value: 1.5 }],
+      columns: [
+        { key: 'sample', label: 'Sample', sortable: true },
+        { key: 'value', label: 'Value', sortable: true },
+      ],
+    })
+  })
+
+  it('renders Matplotlib images inside the standard chart container', () => {
+    const wrapper = mount(GeneratedResultRenderer, {
+      props: {
+        result: { kind: 'image', media_type: 'image/png', data: 'cG5n', alt: 'PCA' },
+      },
+    })
+
+    expect({
+      chart: wrapper.findComponent(ChartContainer).exists(),
+      source: wrapper.get('img').attributes('src'),
+      alt: wrapper.get('img').attributes('alt'),
+    }).toEqual({ chart: true, source: 'data:image/png;base64,cG5n', alt: 'PCA' })
+  })
+
+  it('never interprets JSON results as HTML', () => {
+    const wrapper = mount(GeneratedResultRenderer, {
+      props: {
+        result: { kind: 'json', value: { unsafe: '<script>window.bad = true</script>' } },
+      },
+    })
+
+    expect({ scripts: wrapper.findAll('script').length, text: wrapper.text() }).toEqual({
+      scripts: 0,
+      text: expect.stringContaining('<script>window.bad = true</script>'),
+    })
+  })
+
+  it('should preserve the artifact filename when downloading a result', () => {
+    const wrapper = mount(GeneratedResultRenderer, {
+      props: {
+        result: {
+          kind: 'artifact',
+          id: 'artifact-1',
+          name: 'analysis.csv',
+          media_type: 'text/csv',
+          size: 3,
+          data: 'YSxi',
+        },
+      },
+    })
+
+    expect(wrapper.get('a').attributes('download')).toBe('analysis.csv')
+  })
+
+  it('uses the host download route for a managed file result', () => {
+    const wrapper = mount(GeneratedResultRenderer, {
+      props: {
+        result: {
+          kind: 'artifact',
+          id: 'artifact-2',
+          name: 'large.msd',
+          media_type: 'application/octet-stream',
+          size: 512_000_000,
+          download_url: '/api/leaf/jobs/job-1/result/file/scoped-token',
+          managed: true,
+        },
+      },
+    })
+
+    expect(wrapper.get('a').attributes()).toMatchObject({
+      href: '/api/leaf/jobs/job-1/result/file/scoped-token',
+      download: 'large.msd',
+    })
+  })
+})

package/src/__tests__/components/InstrumentAlertLog.test.ts

@@ -0,0 +1,59 @@
+import { mount } from '@vue/test-utils'
+import { describe, expect, expectTypeOf, it } from 'vitest'
+import type { VNode } from 'vue'
+import InstrumentAlertLog from '../../components/InstrumentAlertLog.vue'
+import type { InstrumentAlert } from '../../types'
+
+type EventKeyIsOptional = {} extends Pick<InstrumentAlert, 'event_key'> ? true : false
+
+function alert(message: string): InstrumentAlert {
+  return {
+    event_key: 'orbitrap-01:acquisition-stopped:42',
+    instrument_id: 'orbitrap-01',
+    level: 'critical',
+    rule: 'acquisition-stopped',
+    message,
+    timestamp: '2026-07-22T08:30:00Z',
+  }
+}
+
+function findAlertVNodeKey(vnode: VNode): VNode['key'] {
+  const classes = vnode.props?.class
+  if (typeof classes === 'string' && classes.split(' ').includes('mint-instrument-alert')) {
+    return vnode.key
+  }
+  if (Array.isArray(vnode.children)) {
+    for (const child of vnode.children) {
+      if (typeof child !== 'object' || child === null) continue
+      const key = findAlertVNodeKey(child as VNode)
+      if (key !== null) return key
+    }
+  }
+  if (vnode.component?.subTree) return findAlertVNodeKey(vnode.component.subTree)
+  return null
+}
+
+describe('InstrumentAlertLog', () => {
+  it('should require a stable event_key in the public alert type', () => {
+    expectTypeOf<EventKeyIsOptional>().toEqualTypeOf<false>()
+  })
+
+  it('should retain the rendered alert when mutable content changes for the same event_key', async () => {
+    const wrapper = mount(InstrumentAlertLog, {
+      props: { alerts: [alert('Acquisition stopped')] },
+    })
+    const renderedAlert = wrapper.get('.mint-instrument-alert').element
+
+    await wrapper.setProps({ alerts: [alert('Acquisition remains stopped')] })
+
+    expect(wrapper.get('.mint-instrument-alert').element).toBe(renderedAlert)
+  })
+
+  it('should key each rendered alert by event_key', () => {
+    const wrapper = mount(InstrumentAlertLog, {
+      props: { alerts: [alert('Acquisition stopped')] },
+    })
+
+    expect(findAlertVNodeKey(wrapper.vm.$.subTree)).toBe('orbitrap-01:acquisition-stopped:42')
+  })
+})

package/src/__tests__/composables/formBuilderRegistry.test.ts

@@ -9,7 +9,7 @@ describe('formBuilderRegistry', () => {
         'text', 'email', 'password', 'tel', 'url', 'search',
         'number', 'textarea', 'select', 'multiselect',
         'checkbox', 'toggle', 'radio', 'slider', 'tags',
-        'date', 'time', 'datetime', 'file',
+        'date', 'time', 'datetime', 'file', 'path',
         'formula', 'sequence', 'molecule', 'concentration', 'unit',
       ]
 
@@ -59,6 +59,10 @@ describe('formBuilderRegistry', () => {
       expect(entry.vModel).toBe(false)
     })
 
+    it('should bind generated path inputs with v-model', () => {
+      expect(getFieldRegistryEntry('path').vModel).toBe(true)
+    })
+
     it('should have vModel true for all non-file types', () => {
       const vModelTypes: FormFieldType[] = [
         'text', 'email', 'password', 'tel', 'url', 'search',