react-msaview 6.4.2 → 7.0.0

package/src/neighborJoining.test.ts

@@ -1,164 +0,0 @@
-import { parseNewick } from 'msa-parsers'
-import { describe, expect, test } from 'vitest'
-
-import { calculateNeighborJoiningTree } from './neighborJoining.ts'
-
-import type { NewickNode } from '@gmod/newick'
-
-describe('calculateNeighborJoiningTree', () => {
-  test('generates valid Newick tree for 2 sequences', () => {
-    const rows: [string, string][] = [
-      ['seq1', 'MKAA'],
-      ['seq2', 'MKAA'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    expect(tree).toContain('seq1')
-    expect(tree).toContain('seq2')
-  })
-
-  test('generates valid Newick tree for 3 sequences', () => {
-    const rows: [string, string][] = [
-      ['human', 'MKAAYLSMFG'],
-      ['mouse', 'MKAAYLSMFG'],
-      ['chicken', 'MKAAFLSMFG'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    expect(tree).toContain('human')
-    expect(tree).toContain('mouse')
-    expect(tree).toContain('chicken')
-    expect(tree).toContain('(')
-    expect(tree).toContain(')')
-  })
-
-  test('generates valid Newick tree for 4 sequences', () => {
-    const rows: [string, string][] = [
-      ['A', 'MKAAYLSMFGKED'],
-      ['B', 'MKAAYLSMFGKED'],
-      ['C', 'MKAAFLSMFGKEE'],
-      ['D', 'MKAAFLSMFGKEE'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    expect(tree).toContain('A')
-    expect(tree).toContain('B')
-    expect(tree).toContain('C')
-    expect(tree).toContain('D')
-  })
-
-  test('includes branch lengths in tree', () => {
-    const rows: [string, string][] = [
-      ['seq1', 'MKAAYLSMFG'],
-      ['seq2', 'MKAAFLSMFG'],
-      ['seq3', 'MKBBFLSMFG'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    // Branch lengths are formatted as :0.123456
-    expect(tree).toMatch(/:\d+\.\d+/)
-  })
-
-  test('throws error for less than 2 sequences', () => {
-    const rows: [string, string][] = [['seq1', 'MKAA']]
-    expect(() => calculateNeighborJoiningTree(rows)).toThrow(
-      'Need at least 2 sequences',
-    )
-  })
-
-  test('handles sequences with gaps', () => {
-    const rows: [string, string][] = [
-      ['seq1', 'MK-AYLSMFG'],
-      ['seq2', 'MKAAYLSMFG'],
-      ['seq3', 'MKA-YLSMFG'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    expect(tree).toContain('seq1')
-    expect(tree).toContain('seq2')
-    expect(tree).toContain('seq3')
-  })
-
-  test('treats a dot gap the same as a dash gap', () => {
-    // stockholm and a3m pad with '.', so the two spellings have to score alike
-    const withDashes: [string, string][] = [
-      ['seq1', 'MK-AYLSMFG'],
-      ['seq2', 'MKAAYLSMFG'],
-      ['seq3', 'MKA-YLSMFG'],
-    ]
-    const withDots = withDashes.map(
-      ([name, seq]) => [name, seq.replaceAll('-', '.')] as [string, string],
-    )
-    expect(calculateNeighborJoiningTree(withDots)).toBe(
-      calculateNeighborJoiningTree(withDashes),
-    )
-  })
-
-  test('names with special characters round-trip through Newick parsing', () => {
-    const rows: [string, string][] = [
-      ['EU105457.1|chr09:67680268..67675529_LTR/Copia', 'MKAA'],
-      ['seq(2)', 'MKAA'],
-    ]
-    const newick = calculateNeighborJoiningTree(rows)
-    const tree = parseNewick(newick)
-
-    function getLeafNames(node: NewickNode): (string | undefined)[] {
-      return node.children?.length
-        ? node.children.flatMap(c => getLeafNames(c))
-        : [node.name]
-    }
-    const names = getLeafNames(tree)
-    expect(names).toContain('EU105457.1|chr09:67680268..67675529_LTR/Copia')
-    expect(names).toContain('seq(2)')
-  })
-
-  test('identical sequences have zero distance', () => {
-    const rows: [string, string][] = [
-      ['seq1', 'MKAAYLSMFG'],
-      ['seq2', 'MKAAYLSMFG'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    // Identical sequences should have equal branch lengths
-    const match = tree.match(/:(\d+\.\d+)/g)
-    expect(match).not.toBeNull()
-    if (match) {
-      const lengths = match.map(m => parseFloat(m.slice(1)))
-      // Branch lengths should be small or zero for identical sequences
-      for (const len of lengths) {
-        expect(len).toBeGreaterThanOrEqual(0)
-      }
-    }
-  })
-
-  test('more divergent sequences have larger distances', () => {
-    const rows: [string, string][] = [
-      ['similar1', 'MKAAYLSMFGKED'],
-      ['similar2', 'MKAAYLSMFGKED'],
-      ['different', 'WWWWWWWWWWWWW'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    // The tree should be valid even with very different sequences
-    expect(tree).toContain('similar1')
-    expect(tree).toContain('similar2')
-    expect(tree).toContain('different')
-  })
-
-  test('handles ragged rows, treating a short row as gapped past its end', () => {
-    const rows: [string, string][] = [
-      ['full', 'MKAAYLSMFGKED'],
-      ['short', 'MKAAYL'],
-      ['other', 'WWWWWWWWWWWWW'],
-    ]
-    const tree = calculateNeighborJoiningTree(rows)
-
-    expect(tree).toMatch(/;$/)
-    expect(tree).toContain('short')
-  })
-})

package/src/parseAsn1.test.ts

@@ -1,36 +0,0 @@
-import { readFileSync } from 'node:fs'
-
-import { expect, test } from 'vitest'
-
-import { flatToTree } from './flatToTree.ts'
-import MSAModelF from './model.ts'
-import { parseAsn1 } from './parseAsn1.ts'
-
-const r = readFileSync(
-  new URL('../test/data/tree.asn', import.meta.url),
-  'utf8',
-)
-
-test('real data file', () => {
-  expect(parseAsn1(r)).toMatchSnapshot()
-})
-
-test('throws a clear error on input missing required sections', () => {
-  expect(() => parseAsn1('BioTreeContainer ::= { something {} }')).toThrow(
-    /missing/,
-  )
-})
-
-test('the tree keeps the labels and branch lengths the file carries', () => {
-  // the parsed features have to survive into the tree the viewer draws, or a
-  // BLAST tree renders as a lengthless list of node ids
-  const model = MSAModelF().create({ type: 'MsaView', data: { tree: r } })
-  model.setWidth(1000)
-
-  expect(model.numRows).toBe(101)
-  expect(model.rowNames[0]).toBe(
-    'sodium/glucose cotransporter 4 [Gouania willdenowi]',
-  )
-  expect(model.allBranchesLength0).toBe(false)
-  expect(flatToTree(parseAsn1(r)).length).toBeUndefined()
-})

package/src/propertyConservation.test.ts

@@ -1,36 +0,0 @@
-import { describe, expect, test } from 'vitest'
-
-import { columnCountsFromColumns } from './columnCounts.ts'
-import { calculatePropertyConservation } from './propertyConservation.ts'
-
-function propertyConservation(columns: string[]) {
-  return calculatePropertyConservation(columnCountsFromColumns(columns))
-}
-
-describe('property conservation', () => {
-  test('an invariant column scores 1', () => {
-    expect(propertyConservation(['LLLL'])[0]).toBe(1)
-  })
-
-  test('a column varying only within one property class stays fully conserved', () => {
-    // L/I/V/M are all hydrophobic: identity varies but the property does not
-    expect(propertyConservation(['LIVM'])[0]).toBe(1)
-  })
-
-  test('mixing opposite-charge classes lowers the score', () => {
-    // K/R (positive) vs D/E (negative): two equally-sized classes
-    const score = propertyConservation(['KRDE'])[0]!
-    expect(score).toBeGreaterThan(0)
-    expect(score).toBeLessThan(1)
-  })
-
-  test('gaps reduce the score proportionally', () => {
-    const full = propertyConservation(['LLLL'])[0]!
-    const halfGapped = propertyConservation(['LL--'])[0]!
-    expect(halfGapped).toBeCloseTo(full * 0.5)
-  })
-
-  test('an all-gap column scores 0', () => {
-    expect(propertyConservation(['----'])[0]).toBe(0)
-  })
-})

package/src/renderColumnTracksSvg.test.tsx

@@ -1,108 +0,0 @@
-// @vitest-environment jsdom
-import { createJBrowseTheme } from '@jbrowse/core/ui/theme'
-import { enableStaticRendering } from 'mobx-react'
-import { beforeAll, expect, test } from 'vitest'
-
-import { installHeadlessRenderEnv } from './headlessRenderEnv.ts'
-import MSAModelF from './model.ts'
-import { renderToSvg } from './renderToSvg.tsx'
-
-import type { ColumnTrackSpec } from './types.ts'
-
-beforeAll(() => {
-  enableStaticRendering(true)
-  installHeadlessRenderEnv()
-})
-
-const msa = '>s1\nACGT\n>s2\nACGT\n'
-const colWidth = 20
-const barColor = '#123456'
-
-function makeModel(columnTracks: ColumnTrackSpec[]) {
-  const model = MSAModelF().create({
-    type: 'MsaView',
-    msaFormat: 'fasta',
-    height: 400,
-    colWidth,
-    data: { msa },
-    columnTracks,
-  })
-  model.setWidth(1000)
-  model.toggleTrack('conservation')
-  return model
-}
-
-async function exportSvg(model: ReturnType<typeof makeModel>) {
-  return renderToSvg(model, {
-    theme: createJBrowseTheme(),
-    exportType: 'entire',
-    includeTracks: true,
-  })
-}
-
-function rectsFilled(svg: string, fill: string) {
-  return [...svg.matchAll(/<rect ([^>]*)\/?>/g)]
-    .map(m => m[1]!)
-    .filter(attrs => attrs.includes(`fill="${fill}"`))
-    .map(attrs => ({
-      x: Number(/x="([\d.-]+)"/.exec(attrs)?.[1]),
-      width: Number(/width="([\d.-]+)"/.exec(attrs)?.[1]),
-      height: Number(/height="([\d.-]+)"/.exec(attrs)?.[1]),
-    }))
-}
-
-test('a bar track from values exports one bar per column in its color', async () => {
-  const model = makeModel([
-    {
-      id: 'dnds',
-      name: 'dN/dS',
-      kind: 'bar',
-      values: [1, 0.5, 0, 0.25],
-      color: barColor,
-    },
-  ])
-  const bars = rectsFilled(await exportSvg(model), barColor).sort(
-    (a, b) => a.x - b.x,
-  )
-  const trackHeight = model.conservationTrackHeight
-  expect(bars.map(b => b.x)).toEqual([0, colWidth, colWidth * 2, colWidth * 3])
-  expect(bars.map(b => b.height)).toEqual([
-    trackHeight,
-    trackHeight / 2,
-    0,
-    trackHeight / 4,
-  ])
-  expect(svgNamesTrack(await exportSvg(model))).toContain('dN/dS')
-})
-
-test('a text track from data exports its letters and its own colors', async () => {
-  const model = makeModel([
-    {
-      id: 'frame',
-      name: 'Codon frame',
-      kind: 'text',
-      data: '1231',
-      colors: { 1: '#aaaaaa', 2: '#bbbbbb', 3: '#cccccc' },
-    },
-  ])
-  const svg = await exportSvg(model)
-  expect(
-    rectsFilled(svg, '#aaaaaa')
-      .map(b => b.x)
-      .sort((a, b) => a - b),
-  ).toEqual([0, colWidth * 3])
-  expect(rectsFilled(svg, '#bbbbbb').map(b => b.x)).toEqual([colWidth])
-  expect(svgNamesTrack(svg)).toContain('Codon frame')
-})
-
-test('a data track that is toggled off stays out of the export', async () => {
-  const model = makeModel([
-    { id: 'dnds', name: 'dN/dS', kind: 'bar', values: [1], color: barColor },
-  ])
-  model.toggleTrack('dnds')
-  expect(rectsFilled(await exportSvg(model), barColor)).toEqual([])
-})
-
-function svgNamesTrack(svg: string) {
-  return [...svg.matchAll(/<text[^>]*>([^<]*)<\/text>/g)].map(m => m[1])
-}

package/src/renderDomainsSvg.test.tsx

@@ -1,118 +0,0 @@
-// @vitest-environment jsdom
-//
-// Verifies the SVG export draws the domain overlay: the boxes themselves across
-// the full alignment width, and the color-key legend as a reserved column on the
-// right. Polyfills mirror impgRender.test.tsx (svgcanvas needs
-// DOMMatrix/DOMPoint + a measureText).
-import { createJBrowseTheme } from '@jbrowse/core/ui/theme'
-import { beforeAll, expect, test } from 'vitest'
-
-import { renderToSvg } from './renderToSvg.tsx'
-import { createTestModel, installSvgTestEnv } from './svgTestUtil.ts'
-
-beforeAll(() => {
-  installSvgTestEnv()
-})
-
-const msa = `>seq1
-ACDEFGHIKL
->seq2
-ACDE-GHIKL`
-
-function makeModel({
-  data = msa,
-  start = 1,
-  end = 5,
-}: { data?: string; start?: number; end?: number } = {}) {
-  const model = createTestModel({
-    id: 'domain-svg-test',
-    data: { msa: data },
-  })
-  model.setDomains({
-    seq1: {
-      xref: [{ id: 'seq1' }],
-      matches: [
-        {
-          signature: {
-            entry: {
-              name: 'Kinase',
-              accession: 'PF00069',
-              description: 'Protein kinase domain',
-            },
-          },
-          locations: [{ start, end }],
-        },
-      ],
-    },
-  })
-  return model
-}
-
-function exportEntire(model: ReturnType<typeof makeModel>) {
-  return renderToSvg(model, {
-    theme: createJBrowseTheme(),
-    exportType: 'entire',
-    includeMinimap: false,
-    includeTracks: false,
-  })
-}
-
-test('domain legend is drawn in the svg export when domains are shown', async () => {
-  const model = makeModel()
-  expect(model.actuallyShowDomains).toBe(true)
-  expect(model.visibleDomainTypes.map(d => d.accession)).toEqual(['PF00069'])
-
-  expect(await exportEntire(model)).toContain('Kinase')
-})
-
-test('no legend column when domains are hidden', async () => {
-  const model = makeModel()
-  model.setShowDomains(false)
-  expect(model.actuallyShowDomains).toBe(false)
-
-  expect(await exportEntire(model)).not.toContain('Kinase')
-})
-
-test('the page grows to hold a key taller than the alignment', async () => {
-  const model = makeModel()
-  model.setDomains({
-    seq1: {
-      xref: [{ id: 'seq1' }],
-      matches: Array.from({ length: 12 }, (_, i) => ({
-        signature: {
-          entry: { name: `Dom${i}`, accession: `PF${i}`, description: '' },
-        },
-        locations: [{ start: 1, end: 5 }],
-      })),
-    },
-  })
-  expect(model.visibleDomainTypes).toHaveLength(12)
-  const keyHeight = 16 + 12 * 16
-  expect(model.totalHeight).toBeLessThan(keyHeight)
-
-  const svg = await exportEntire(model)
-  expect(svg).toContain(`height="${keyHeight}"`)
-  expect(/<svg[^>]*height="(\d+)"/.exec(svg)?.[1]).toBe(String(keyHeight))
-})
-
-test('a domain box past the on-screen block size still draws', async () => {
-  // the export renders the alignment in one pass, so the overlay has to be told
-  // how wide that pass is; falling back to the 500px on-screen block size culled
-  // every band to the left edge of a wide alignment
-  const row = 'ACDEFGHIKL'.repeat(20)
-  const model = makeModel({
-    data: `>seq1\n${row}\n>seq2\n${row}`,
-    start: 151,
-    end: 190,
-  })
-  const band = model.domainBands.get('seq1')![0]!
-  const x = band.startCol * model.colWidth
-  expect(x).toBeGreaterThan(model.blockSize)
-
-  const svg = await exportEntire(model)
-  const fill = model.fillPalette.PF00069!
-  const rects = [...svg.matchAll(/<rect[^>]*>/g)].map(m => m[0])
-  expect(
-    rects.some(r => r.includes(`fill="${fill}"`) && r.includes(`x="${x}"`)),
-  ).toBe(true)
-})

package/src/renderHighlightsSvg.test.tsx

@@ -1,85 +0,0 @@
-// @vitest-environment jsdom
-//
-// The SVG export draws the `highlights` layer: a bordered band with its label
-// over the alignment, a residue span at the column the row's gaps put it in,
-// and a row set tinted across both the tree and the alignment.
-import { createJBrowseTheme } from '@jbrowse/core/ui/theme'
-import { enableStaticRendering } from 'mobx-react'
-import { beforeAll, expect, test } from 'vitest'
-
-import { installHeadlessRenderEnv } from './headlessRenderEnv.ts'
-import MSAModelF from './model.ts'
-import { renderToSvg } from './renderToSvg.tsx'
-
-import type { Highlight } from './types.ts'
-
-beforeAll(() => {
-  enableStaticRendering(true)
-  installHeadlessRenderEnv()
-})
-
-const msa = `>seq1
-ACDEFGHIKL
->seq2
-AC--FGHIKL
->seq3
-ACDEFGHIKL`
-
-async function exportWith(highlights: Highlight[]) {
-  const model = MSAModelF().create({
-    id: 'highlight-svg-test',
-    type: 'MsaView',
-    height: 400,
-    msaFormat: 'fasta',
-    data: { msa },
-    highlights,
-  })
-  model.setWidth(800)
-  const svg = await renderToSvg(model, {
-    theme: createJBrowseTheme(),
-    exportType: 'entire',
-  })
-  return { model, svg }
-}
-
-const rects = (svg: string) => svg.match(/<rect[^>]*>/g) ?? []
-
-test('a labeled column span draws a band and its label', async () => {
-  const { model, svg } = await exportWith([
-    { start: 3, end: 5, label: 'motif', color: 'rgb(1, 2, 3)' },
-  ])
-  const { colWidth, totalHeight } = model
-  const band = rects(svg).find(
-    r => r.includes(`x="${2 * colWidth}"`) && r.includes('rgb(1, 2, 3)'),
-  )
-  expect(band).toBeDefined()
-  expect(band).toContain(`width="${3 * colWidth}"`)
-  expect(band).toContain(`height="${totalHeight}"`)
-  expect(svg).toContain('>motif<')
-})
-
-test('a residue span lands where the row has its residues', async () => {
-  const { model, svg } = await exportWith([
-    { row: 'seq2', start: 3, end: 3, color: 'rgb(9, 9, 9)' },
-  ])
-  expect(model.resolvedHighlights[0]).toMatchObject({
-    startCol: 4,
-    endCol: 4,
-  })
-  const band = rects(svg).find(r => r.includes('rgb(9, 9, 9)'))
-  expect(band).toContain(`x="${4 * model.colWidth}"`)
-})
-
-test('a row set tints the row in the tree and the alignment', async () => {
-  const { model, svg } = await exportWith([
-    { rows: ['seq3'], label: 'odd one out', color: 'rgb(7, 7, 7)' },
-  ])
-  const { rowHeight, treeAreaWidth, totalWidth } = model
-  const tints = rects(svg).filter(
-    r => r.includes('rgb(7, 7, 7)') && r.includes(`y="${2 * rowHeight}"`),
-  )
-  expect(tints.map(r => /width="([^"]+)"/.exec(r)?.[1])).toEqual(
-    expect.arrayContaining([`${treeAreaWidth}`, `${totalWidth}`]),
-  )
-  expect(svg).toContain('>odd one out<')
-})

package/src/renderMinimapSvg.test.tsx

@@ -1,62 +0,0 @@
-// @vitest-environment jsdom
-//
-// The viewport export draws a minimap by default, and nothing covered it. It
-// spans the same alignment canvas the live minimap does, so its trapezoid has
-// to reach the right edge of the exported alignment column -- and it is drawn
-// only when the live view shows one at all.
-import { createJBrowseTheme } from '@jbrowse/core/ui/theme'
-import { beforeAll, expect, test } from 'vitest'
-
-import { renderToSvg } from './renderToSvg.tsx'
-import { createTestModel, installSvgTestEnv } from './svgTestUtil.ts'
-
-beforeAll(() => {
-  installSvgTestEnv()
-})
-
-const width = 1000
-
-function makeModel(cols = 400) {
-  const row = 'ACDEFGHIKL'.repeat(cols / 10)
-  return createTestModel(
-    { height: 300, data: { msa: `>seq1\n${row}\n>seq2\n${row}` } },
-    width,
-  )
-}
-
-function exportViewport(model: ReturnType<typeof makeModel>) {
-  return renderToSvg(model, {
-    theme: createJBrowseTheme(),
-    exportType: 'viewport',
-    includeMinimap: true,
-    includeTracks: false,
-  })
-}
-
-test('the exported minimap spans the exported alignment column', async () => {
-  const model = makeModel()
-  expect(model.showHorizontalScrollbar).toBe(true)
-
-  const svg = await exportViewport(model)
-
-  // the minimap column is the alignment canvas, which is what the export lays
-  // out beside the tree
-  const minimapWidth = model.msaCanvasWidth
-  const polygon = /<polygon[^>]*points="([^"]*)"/.exec(svg)?.[1]
-  expect(polygon).toBeDefined()
-  // bottom edge of the trapezoid reaches the full width it was given
-  expect(polygon!.endsWith(`${minimapWidth},${model.minimapHeight - 12}`)).toBe(
-    true,
-  )
-  // and the bar outline is drawn to the same width
-  expect(svg).toContain(`width="${minimapWidth}"`)
-})
-
-test('no minimap when the alignment already fits across', async () => {
-  const model = makeModel(10)
-  expect(model.showHorizontalScrollbar).toBe(false)
-
-  // a minimap here would mark a viewport wider than the bar it sits in, and the
-  // live view draws none either
-  expect(await exportViewport(model)).not.toContain('<polygon')
-})