@morscherlab/mint-sdk 1.4.0-beta.9 → 1.4.1

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

@@ -728,10 +728,17 @@ describe('SettingsModal', () => {
       expect(useSettingsStore(pinia).theme).toBe('dark')
     })
 
-    it('should render a swatch strip for each palette when appearance is shown', () => {
+    it('should preview each palette with its own tokens when appearance is shown', () => {
       const wrapper = mountSettingsModal({ showAppearance: true })
 
-      expect(wrapper.findAll('.mint-settings-modal__palette')).toHaveLength(Object.keys(colorPalettes).length)
+      const strips = wrapper.findAll('.mint-settings-modal__swatches')
+      expect(strips.map((strip) => strip.attributes('data-palette'))).toEqual(Object.keys(colorPalettes))
+      expect(strips[0].findAll('.mint-settings-modal__swatch').map((swatch) => swatch.attributes('style'))).toEqual([
+        'background-color: var(--color-primary);',
+        'background-color: var(--color-primary-hover);',
+        'background-color: var(--color-primary-soft);',
+        'background-color: var(--color-primary-border);',
+      ])
     })
 
     it('should resize the density preview when the density changes', async () => {

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

@@ -1,12 +1,21 @@
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
 import { describe, expect, it } from 'vitest'
 
 import {
   detectDelimiter,
   parseDelimitedText,
+  readTableFileAsCsv,
   useFileImport,
   validateImportFile,
 } from '../../composables/useFileImport'
 
+const SAMPLES_CSV = [
+  'Sample Name,Treatment,Inj Vol,Date',
+  'S1,Vehicle,5,2026-10-01',
+  'S2,"Drug ""A"", 10 uM",2.5,2026-10-02',
+].join('\n')
+
 describe('file import helpers', () => {
   it('parses quoted CSV fields', () => {
     const parsed = parseDelimitedText('name,notes\nSample A,"hello, world"\n')
@@ -41,4 +50,31 @@ describe('file import helpers', () => {
     expect(result.rows).toEqual([{ name: 'A' }])
     expect(importer.loading.value).toBe(false)
   })
+
+  it.each([
+    ['samples.csv', SAMPLES_CSV],
+    ['samples.tsv', 'Sample Name\tTreatment\tInj Vol\tDate\nS1\tVehicle\t5\t2026-10-01\nS2\t"Drug ""A"", 10 uM"\t2.5\t2026-10-02'],
+    ['samples.xlsx', readFileSync(resolve(__dirname, '../fixtures/table-import/samples.xlsx'))],
+  ])('should read the first table as CSV text when the upload is %s', async (name, content) => {
+    const file = new File([content], name)
+
+    expect(await readTableFileAsCsv(file)).toBe(SAMPLES_CSV)
+  })
+
+  it('should keep a quote inside a field as text when the quote does not open the field', () => {
+    expect(parseDelimitedText('S1\t5" vial\nS2\tok', { hasHeaderRow: false }).rawRows)
+      .toEqual([['S1', '5" vial'], ['S2', 'ok']])
+  })
+
+  it('should keep the stored cell text when the upload is .xlsx', async () => {
+    const file = new File([readFileSync(resolve(__dirname, '../fixtures/table-import/cells.xlsx'))], 'cells.xlsx')
+
+    expect(await readTableFileAsCsv(file)).toBe('2026-10-01T13:45:00,08:30:00,TRUE\n  S1  ,9007199254740993,0.1')
+  })
+
+  it('should reject a file that is not a workbook when the name ends in .xlsx', async () => {
+    const file = new File(['Sample Name\nS1\n'], 'renamed.xlsx')
+
+    await expect(readTableFileAsCsv(file)).rejects.toThrow('not a valid .xlsx workbook')
+  })
 })

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

@@ -0,0 +1,68 @@
+import { mount } from '@vue/test-utils'
+import { defineComponent, nextTick, ref } from 'vue'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { computePosition } from '@floating-ui/dom'
+import { useFloatingPanel } from '../../composables/useFloatingPanel'
+
+const cleanup = vi.fn()
+vi.mock('@floating-ui/dom', async (importOriginal) => ({
+  ...(await importOriginal<typeof import('@floating-ui/dom')>()),
+  autoUpdate: vi.fn((_reference: unknown, _floating: unknown, update: () => void) => {
+    update()
+    return cleanup
+  }),
+  computePosition: vi.fn(async () => ({ x: 10, y: 20, placement: 'bottom-start', strategy: 'fixed', middlewareData: {} })),
+}))
+
+/** A trigger and the panel placed next to it. */
+const Panel = defineComponent({
+  setup() {
+    const trigger = ref<HTMLElement | null>(null)
+    const panel = ref<HTMLElement | null>(null)
+    const isOpen = ref(true)
+    const { style } = useFloatingPanel(trigger, panel, isOpen)
+    return { trigger, panel, isOpen, style }
+  },
+  template: '<div><button ref="trigger">Open</button><div v-if="isOpen" ref="panel" class="panel" :style="style" /></div>',
+})
+
+async function settle() {
+  for (let i = 0; i < 3; i++) await nextTick()
+}
+
+describe('useFloatingPanel', () => {
+  afterEach(() => {
+    cleanup.mockClear()
+    document.body.innerHTML = ''
+  })
+
+  it.each([
+    ['closes', (wrapper: ReturnType<typeof mount>) => { (wrapper.vm as unknown as { isOpen: boolean }).isOpen = false }],
+    ['unmounts', (wrapper: ReturnType<typeof mount>) => wrapper.unmount()],
+  ])('should stop autoUpdate when the panel %s', async (_, end) => {
+    const wrapper = mount(Panel, { attachTo: document.body })
+    await settle()
+    expect(cleanup).not.toHaveBeenCalled()
+
+    end(wrapper)
+    await settle()
+
+    expect(cleanup).toHaveBeenCalledTimes(1)
+  })
+
+  it.each([
+    [false, ''],
+    [true, 'hidden'],
+  ])('should set the panel visibility to %j when referenceHidden is %s', async (referenceHidden, visibility) => {
+    vi.mocked(computePosition).mockResolvedValueOnce({
+      x: 10, y: 20, placement: 'bottom-start', strategy: 'fixed', middlewareData: { hide: { referenceHidden } },
+    })
+    mount(Panel, { attachTo: document.body })
+    await settle()
+
+    const panel = document.querySelector<HTMLElement>('.panel')!
+    expect(panel.style.position).toBe('fixed')
+    expect(panel.style.top).toBe('20px')
+    expect(panel.style.visibility).toBe(visibility)
+  })
+})

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

@@ -1,13 +1,13 @@
-import { mount } from '@vue/test-utils'
+import { flushPromises, mount } from '@vue/test-utils'
 import { defineComponent, nextTick, shallowRef } from 'vue'
-import { describe, expect, it, vi } from 'vitest'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import {
   combinePluginJobSources,
   useJobCenter,
   type UseJobCenterOptions,
 } from '../../composables/useJobCenter'
-import type { JobStateInput, JobStatus } from '../../types/jobs'
+import type { JobStateInput, JobStatus, TopBarJob } from '../../types/jobs'
 
 function job(status: JobStatus, id: string = status): JobStateInput {
   return {
@@ -281,3 +281,262 @@ describe('useJobCenter', () => {
     expect(tray.deletableJobs.value).toEqual([])
   })
 })
+
+describe('useJobCenter top-bar chip', () => {
+  const platformWindow = window as unknown as { __MINT_PLATFORM__?: unknown }
+  function integrateAs(userId: number, pluginId = 'peak-qc') {
+    platformWindow.__MINT_PLATFORM__ = { user: { id: userId }, plugin: { id: pluginId } }
+  }
+  const owned = (status: JobStatus, id: string, owner: string | null, user = owner): JobStateInput => ({
+    ...job(status, id), owner_user_id: owner, user_id: user,
+  })
+
+  beforeEach(() => localStorage.clear())
+  afterEach(() => {
+    delete platformWindow.__MINT_PLATFORM__
+    vi.useRealTimers()
+  })
+
+  it.each<[string, JobStateInput[], TopBarJob | null]>([
+    ['an awaiting-input job first', [job('running', 'r'), job('awaiting_input', 'a')],
+      { status: 'awaiting_input', label: 'a waiting for input', percent: null }],
+    ['the first active job', [job('queued', 'q'), job('running', 'r')],
+      { status: 'queued', label: 'q queued', percent: null }],
+    ['the progress message and percent of a running job',
+      [{ ...job('running', 'r'), progress: { ...job('running', 'r').progress, message: 'Integrating' } }],
+      { status: 'running', label: 'Integrating', percent: 42 }],
+    ['nothing without active, held or failed jobs', [job('completed', 'c'), job('cancelled', 'x')], null],
+  ])('should show %s when the viewer runs jobs', (_case, jobs, expected) => {
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    expect(tray.topBarJob.value).toEqual(expected)
+  })
+
+  it('should show only the viewer own jobs when the page is integrated', () => {
+    integrateAs(1)
+    const { tray } = mountComposable({
+      source: { jobs: [owned('running', 'theirs', '2'), owned('queued', 'mine', null, '1')] },
+      loadOnMount: false,
+    })
+    expect(tray.topBarJob.value).toMatchObject({ status: 'queued', label: 'mine queued' })
+  })
+
+  it.each([
+    ['auth is off', false, 'running'],
+    ['auth is required', true, undefined],
+  ])('should treat jobs of an integrated page without a signed-in user as own only when %s', (_case, authRequired, status) => {
+    platformWindow.__MINT_PLATFORM__ = { user: null, plugin: { id: 'peak-qc' }, authRequired }
+    const { tray } = mountComposable({ source: { jobs: [owned('running', 'theirs', '2')] }, loadOnMount: false })
+    expect(tray.topBarJob.value?.status).toBe(status)
+  })
+
+  it('should hold a completed job when several jobs leave the active list in one update', async () => {
+    const jobs = shallowRef([job('running', 'a'), job('running', 'b')])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+
+    jobs.value = [job('failed', 'a'), job('completed', 'b')]
+    await nextTick()
+
+    expect(tray.topBarJob.value).toEqual({ status: 'completed', label: 'b completed' })
+  })
+
+  it('should close the open tray instead of selecting the held job when the chip is clicked', async () => {
+    const jobs = shallowRef([job('running', 'r')])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    const onSelect = vi.fn()
+    jobs.value = [job('completed', 'r')]
+    await nextTick()
+    tray.open()
+
+    tray.handleTopBarClick(onSelect)
+
+    expect([tray.isOpen.value, onSelect.mock.calls.length]).toEqual([false, 0])
+  })
+
+  it('should drop the held job when it leaves the job list', async () => {
+    const jobs = shallowRef([job('running', 'r')])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    const onSelect = vi.fn()
+    jobs.value = [job('completed', 'r')]
+    await nextTick()
+    jobs.value = []
+    await nextTick()
+
+    tray.handleTopBarClick(onSelect)
+
+    expect([tray.topBarJob.value, onSelect.mock.calls.length, tray.isOpen.value]).toEqual([null, 0, true])
+  })
+
+  it('should mark a failure seen when the job fails while the tray is open', async () => {
+    localStorage.setItem('mint.jobs.standalone.seen-failed', '[]')
+    const jobs = shallowRef([job('running', 'r')])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    tray.open()
+    await nextTick()
+
+    jobs.value = [job('failed', 'r')]
+    await nextTick()
+    tray.close()
+    await nextTick()
+
+    expect(tray.topBarJob.value).toBeNull()
+  })
+
+  it.each([
+    ['an empty list', [] as JobStateInput[], { status: 'failed', label: '1 failed' }],
+    ['an old failure', [job('failed', 'old')], { status: 'failed', label: '1 failed' }],
+  ])('should take the baseline when the initial load returns %s', async (_case, loaded, later) => {
+    const jobs = shallowRef<JobStateInput[]>([])
+    const { tray } = mountComposable({ source: { jobs, refresh: async () => { jobs.value = loaded } } })
+    await flushPromises()
+    const baseline = tray.topBarJob.value
+
+    jobs.value = [...loaded, job('failed', 'new')]
+    await nextTick()
+
+    expect([baseline, tray.topBarJob.value]).toEqual([null, later])
+  })
+
+  it('should not hold a job when the source is replaced by one where it already completed', async () => {
+    const source = shallowRef({ jobs: [job('running', 'x')] })
+    const { tray } = mountComposable({ source, loadOnMount: false })
+
+    source.value = { jobs: [job('completed', 'x')] }
+    await nextTick()
+
+    expect(tray.topBarJob.value).toBeNull()
+  })
+
+  it('should alert only failures after the first job list when nothing was stored', async () => {
+    const jobs = shallowRef<JobStateInput[]>([])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+
+    jobs.value = [job('failed', 'old')]
+    await nextTick()
+    const baseline = tray.topBarJob.value
+    jobs.value = [job('failed', 'old'), job('failed', 'new')]
+    await nextTick()
+
+    expect({
+      baseline,
+      later: tray.topBarJob.value,
+      stored: JSON.parse(localStorage.getItem('mint.jobs.standalone.seen-failed') ?? 'null'),
+    }).toEqual({ baseline: null, later: { status: 'failed', label: '1 failed' }, stored: ['old'] })
+  })
+
+  it.each<[string, TopBarJob | null, TopBarJob]>([
+    ['use the override', { status: 'completed', label: 'Saved to the experiment' },
+      { status: 'completed', label: 'Saved to the experiment' }],
+    ['keep the default', null, { status: 'completed', label: 'r completed' }],
+  ])('should %s for the held job when the topBarJob option returns that value', async (_case, override, expected) => {
+    const jobs = shallowRef([job('running', 'r')])
+    const topBarJob = vi.fn((shown: { status: JobStatus }) => (shown.status === 'completed' ? override : null))
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false, topBarJob })
+
+    jobs.value = [job('completed', 'r')]
+    await nextTick()
+
+    expect(tray.topBarJob.value).toEqual(expected)
+  })
+
+  it('should hold a just-completed job for 6 s and select it on click when nothing else runs', async () => {
+    vi.useFakeTimers()
+    const jobs = shallowRef([job('running', 'r')])
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    const onSelect = vi.fn()
+
+    jobs.value = [{ ...job('completed', 'r') }]
+    await nextTick()
+    const held = tray.topBarJob.value
+    tray.handleTopBarClick(onSelect)
+    vi.advanceTimersByTime(5999)
+    const stillHeld = tray.topBarJob.value
+    vi.advanceTimersByTime(1)
+    tray.handleTopBarClick(onSelect)
+
+    expect({
+      held,
+      stillHeld: stillHeld?.status,
+      after: tray.topBarJob.value,
+      selected: onSelect.mock.calls.map(([selected]) => selected.job_id),
+      open: tray.isOpen.value,
+    }).toEqual({
+      held: { status: 'completed', label: 'r completed' },
+      stillHeld: 'completed',
+      after: null,
+      selected: ['r'],
+      open: true,
+    })
+  })
+
+  it.each([
+    ['standalone', () => undefined, 'mint.jobs.standalone.seen-failed'],
+    ['integrated', () => integrateAs(1), 'mint.jobs.peak-qc.seen-failed'],
+  ])('should count unseen failures until the tray opens when %s', async (_mode, setup, key) => {
+    setup()
+    localStorage.setItem(key, '[]')
+    const jobs = [owned('failed', 'f1', '1'), owned('failed', 'f2', '1'), owned('failed', 'other', '2')]
+    const { tray } = mountComposable({ source: { jobs }, loadOnMount: false })
+    const before = tray.topBarJob.value
+
+    tray.open()
+    await nextTick()
+    const reopened = mountComposable({ source: { jobs }, loadOnMount: false }).tray
+
+    expect({
+      before,
+      after: tray.topBarJob.value,
+      reopened: reopened.topBarJob.value,
+      stored: JSON.parse(localStorage.getItem(key) ?? 'null'),
+    }).toEqual({
+      before: { status: 'failed', label: _mode === 'standalone' ? '3 failed' : '2 failed' },
+      after: null,
+      reopened: null,
+      stored: _mode === 'standalone' ? ['f1', 'f2', 'other'] : ['f1', 'f2'],
+    })
+  })
+
+  it.each<[string, TopBarJob | null, TopBarJob]>([
+    ['replace the default mapping', { status: 'running', label: 'Decoding in the browser', percent: 10 },
+      { status: 'running', label: 'Decoding in the browser', percent: 10 }],
+    ['keep the default mapping', null, { status: 'awaiting_input', label: 'a waiting for input', percent: null }],
+  ])('should %s when the topBarJob option returns that value', (_case, override, expected) => {
+    const { tray } = mountComposable({
+      source: { jobs: [job('awaiting_input', 'a')] },
+      loadOnMount: false,
+      topBarJob: () => override,
+    })
+    expect(tray.topBarJob.value).toEqual(expected)
+  })
+
+  it('should count only completed jobs when the list holds finished and active jobs', () => {
+    const { tray } = mountComposable({
+      source: { jobs: [job('completed', 'c1'), job('completed', 'c2'), job('failed', 'f'), job('running', 'r')] },
+      loadOnMount: false,
+    })
+    expect(tray.completedCount.value).toBe(2)
+  })
+})
+
+describe('useJobCenter row view', () => {
+  const awaiting = job('awaiting_input', 'a')
+  const running = job('running', 'r')
+
+  it.each<[string, JobStateInput, UseJobCenterOptions['rowJob'], ReturnType<ReturnType<typeof useJobCenter>['rowView']>]>([
+    ['absent', running, undefined, { status: 'running', percent: 42, message: 'running' }],
+    ['null', awaiting, () => null,
+      { status: 'awaiting_input', percent: null, message: 'Waiting for external input' }],
+    ['a status and percent', awaiting, () => ({ status: 'running', percent: 40 }),
+      { status: 'running', percent: 40, message: 'Waiting for external input' }],
+    ['a message only', running, () => ({ message: 'Decoding 3/8' }),
+      { status: 'running', percent: 42, message: 'Decoding 3/8' }],
+    ['undefined and null fields', running, () => ({ status: null, percent: undefined, message: null }),
+      { status: 'running', percent: 42, message: 'running' }],
+    ['a status only', running, () => ({ status: 'awaiting_input' }),
+      { status: 'awaiting_input', percent: 42, message: 'running' }],
+    ['a null percent', running, () => ({ percent: null }),
+      { status: 'running', percent: null, message: 'running' }],
+  ])('should resolve the row view from the job when the row override is %s', (_case, input, rowJob, expected) => {
+    const { tray } = mountComposable({ source: { jobs: [input] }, loadOnMount: false, rowJob })
+    expect(tray.rowView(tray.jobs.value[0]!)).toEqual(expected)
+  })
+})