jbrowse-plugin-graphgenomeviewer 7.4.4 → 7.6.0

package/src/GraphGenomeView/model.test.ts

@@ -156,6 +156,7 @@ vi.mock('@jbrowse/core/util/io', () => ({
 }))
 
 const SIMPLE_GFA = 'H\tVN:Z:1.0\nS\t1\tACGT\nS\t2\tGGCC\nL\t1\t+\t2\t+\t0M\n'
+const WALKED_GFA = `${SIMPLE_GFA}W\tGRCh38\t0\tchr1\t0\t8\t>1>2\nW\tA\t1\tctg\t0\t8\t>1>2\n`
 
 const MOCK_LAYOUT = {
   nodePositions: {
@@ -218,7 +219,9 @@ function createAnchoredModel(props: { layers?: GraphLayers } = {}) {
 
 // A view attached to a tree, so afterAttach installs its reactions. A root
 // model never attaches.
-function attachedModel(props: { layoutMode?: LayoutModeValue } = {}) {
+function attachedModel(
+  props: { layoutMode?: LayoutModeValue; [key: string]: unknown } = {},
+) {
   return types
     .model({ view: stateModelFactory() })
     .create({ view: { type: 'GraphGenomeView', ...props } }).view
@@ -292,12 +295,24 @@ describe('rampDomain', () => {
     expect(model.rampDomain).toBeUndefined()
   })
 
+  test('a saved flat color is read as the channel object', () => {
+    const model = restoredView({
+      color: { field: 'position', domainMin: 5, domainMax: 50 },
+    })
+    expect(model.color).toEqual({
+      field: 'position',
+      scale: { domainMin: 5, domainMax: 50 },
+    })
+    expect(model.statedColorDomain).toEqual({ start: 5, end: 50 })
+    expect(restoredView({ color: 'uniform' }).chosenColorScheme).toBe('uniform')
+  })
+
   test('a stated color domain survives loading a GFA file, and wins', async () => {
     rpcRespond()
     const model = createModel()
     applySnapshot(model, {
       ...getSnapshot(model),
-      color: { domainMin: 1445000, domainMax: 1474500 },
+      color: { scale: { domainMin: 1445000, domainMax: 1474500 } },
       loadedRegion: TEST_REGION,
     })
     await model.loadGFA(SIMPLE_GFA)
@@ -366,6 +381,30 @@ describe('restoring a stated cut', () => {
     )
   })
 
+  // Only a GBZ cut follows snarls past the window; a walk file cuts the same
+  // graph either way, so the strip's toggle has nothing to fetch.
+  test.each([
+    ['RgfaTabixAdapter', 0],
+    ['GbzBaseSyntenyAdapter', 1],
+  ])('the walk strip on a %s track cuts again %i times', async (type, n) => {
+    rpcRespond()
+    mockSession.tracks = [{ trackId: 'rgfa-track', adapter: { type } }]
+    const model = attachedModel({
+      layoutMode: 'force',
+      loadedTrackId: 'rgfa-track',
+      loadedRegion: TEST_REGION,
+    })
+    await vi.waitFor(() => {
+      expect(model.graph).toBeDefined()
+    })
+    const cuts = () =>
+      mockRpcCall.mock.calls.filter(c => c[1] === 'GetSubgraph').length
+    const before = cuts()
+    model.setWalkStrip(!model.walkStrip)
+    await layoutsSettled(model)
+    expect(cuts()).toBe(before + n)
+  })
+
   test('a stated track the session lacks is reported without a fetch', async () => {
     mockSession.tracks = []
     const model = restoredView()
@@ -1136,7 +1175,7 @@ describe('layoutMode', () => {
     const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
     rpcRespond()
     const model = attachedModel()
-    await model.loadGFA(SIMPLE_GFA, 'plain')
+    await model.loadGFA(WALKED_GFA, 'plain')
 
     model.setMaxGraphNodes(1)
     await layoutsSettled(model)
@@ -1434,7 +1473,7 @@ describe('node budget', () => {
     const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
     rpcRespond()
     const model = withLimit(1)
-    await model.loadGFA(SIMPLE_GFA, 'two nodes')
+    await model.loadGFA(WALKED_GFA, 'two nodes')
     expect(String(model.error)).toMatch(/too large to draw/i)
 
     await model.switchLayout('walkrows')
@@ -1443,6 +1482,21 @@ describe('node budget', () => {
     consoleSpy.mockRestore()
   })
 
+  // walk rows hand a graph with no walks to the force engine, which draws
+  // every node
+  test('walk rows of a graph with no walks keep the budget', async () => {
+    const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+    rpcRespond()
+    const model = withLimit(1)
+    model.setLayoutMode('walkrows')
+    await model.loadGFA(SIMPLE_GFA, 'two nodes')
+    expect(String(model.error)).toMatch(/too large to draw/i)
+    expect(
+      mockRpcCall.mock.calls.filter(c => c[1] === 'GraphComputeLayout'),
+    ).toHaveLength(0)
+    consoleSpy.mockRestore()
+  })
+
   test('a declined graph does not keep the last graph drawn under it', async () => {
     const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
     rpcRespond()
@@ -1466,7 +1520,7 @@ describe('node budget', () => {
     rpcRespond()
     const model = withLimit(1)
     model.setLayoutMode('walkrows')
-    await model.loadGFA(SIMPLE_GFA, 'two nodes')
+    await model.loadGFA(WALKED_GFA, 'two nodes')
     expect(model.error).toBeUndefined()
     expect(model.layoutResult).toBeDefined()
   })
@@ -2279,6 +2333,61 @@ describe('launching out of the graph', () => {
   // Where every contributor is a loaded assembly the graph offers one panel per
   // strain, and a synteny view of all of them — the item is disabled while no
   // synteny track aligns them, rather than absent.
+  // Sakai's allele is drawn bare unless Sakai's own annotation is read onto
+  // it: the reference's genes only reach the backbone
+  test("a loaded strain's own genes are read onto its nodes off the reference", async () => {
+    mockSession.assemblyNames = ['K12', 'Sakai']
+    mockSession.tracks = [
+      {
+        trackId: 'Sakai_genes',
+        name: 'Sakai genes',
+        assemblyNames: ['Sakai'],
+        adapter: { type: 'Gff3TabixAdapter' },
+      },
+    ]
+    const model = await loadedGraph(ECOLI_RGFA, {
+      refName: 'chr',
+      assemblyName: 'K12',
+      start: 1000,
+      end: 1020,
+    })
+    expect(model.ownGeneReads).toEqual([
+      {
+        stableRefName: 'Sakai#1#chr',
+        trackId: 'Sakai_genes',
+        region: {
+          assemblyName: 'Sakai',
+          refName: 'chr',
+          start: 90000,
+          end: 90004,
+        },
+      },
+    ])
+    mockRpcCall.mockImplementation((_sid: unknown, method: string) =>
+      method === 'CoreGetFeatures'
+        ? Promise.resolve([
+            {
+              name: 'stx2A',
+              refName: 'chr',
+              start: 90001,
+              end: 90003,
+              strand: 1,
+              subfeatures: [{ type: 'exon', start: 90001, end: 90003 }],
+            },
+          ])
+        : Promise.reject(new Error(`Unexpected RPC: ${method}`)),
+    )
+    await model.loadOwnGenes()
+    expect(model.ownGeneFeatures).toEqual([
+      expect.objectContaining({
+        name: 'stx2A · Sakai#1',
+        refName: 'Sakai#1#chr',
+        start: 90001,
+        end: 90003,
+      }),
+    ])
+  })
+
   test('loaded strains offer a per-strain linear view and a synteny item', async () => {
     mockSession.assemblyNames = ['K12', 'Sakai']
     const model = await loadedGraph(ECOLI_RGFA, {
@@ -2345,6 +2454,68 @@ describe('launching out of the graph', () => {
     expect(model.connectedViewId).toBe('view-1')
   })
 
+  test('an opened view carries one gene track, not every feature track', async () => {
+    mockSession.assemblyNames = ['hg38']
+    const feature = (trackId: string, name: string, type: string) => ({
+      trackId,
+      name,
+      type: 'FeatureTrack',
+      assemblyNames: ['hg38'],
+      adapter: { type },
+    })
+    mockSession.tracks = [
+      feature('rgfa-track', 'graph', 'RgfaTabixAdapter'),
+      feature('clinvar', 'ClinVar', 'BigBedAdapter'),
+      feature('ncbi', 'NCBI RefSeq genes', 'Gff3TabixAdapter'),
+      feature('gwas', 'GWAS catalog', 'BedTabixAdapter'),
+    ]
+    const model = await loadedGraph(HPRC_RGFA)
+    const { reference } = model.nodeLaunchTargets('1+')
+    model.showInLinearView(reference!)
+
+    expect(mockSession.addedViews).toEqual([
+      [
+        'LinearGenomeView',
+        expect.objectContaining({
+          init: expect.objectContaining({ tracks: ['rgfa-track', 'ncbi'] }),
+        }),
+      ],
+    ])
+  })
+
+  // a BED named for no annotation is not picked as genes, but beats `No
+  // tracks active`
+  test('a strain with no gene-looking track opens on its first feature track', async () => {
+    mockSession.assemblyNames = ['K12', 'Sakai']
+    mockSession.tracks = [
+      {
+        trackId: 'Sakai_segments',
+        name: 'Sakai segments',
+        type: 'FeatureTrack',
+        assemblyNames: ['Sakai'],
+        adapter: { type: 'BedAdapter' },
+      },
+    ]
+    const model = await loadedGraph(ECOLI_RGFA, {
+      refName: 'chr',
+      assemblyName: 'K12',
+      start: 1000,
+      end: 1020,
+    })
+    model.showInLinearView(model.nodeLaunchTargets('3+').own!)
+    expect(mockSession.addedViews).toEqual([
+      [
+        'LinearGenomeView',
+        expect.objectContaining({
+          init: expect.objectContaining({
+            assembly: 'Sakai',
+            tracks: ['Sakai_segments'],
+          }),
+        }),
+      ],
+    ])
+  })
+
   // A pairing is not stolen from a view still on screen: a graph launched from
   // a linear view came in on that sync. One whose view has been closed is held
   // by nothing, and kept, the view the graph opens next never got its hover.
@@ -2978,7 +3149,7 @@ describe('the auto color scheme', () => {
     const model = createModel()
     applySnapshot(model, {
       ...getSnapshot(model),
-      color: { domainMin: 1000, domainMax: 5000 },
+      color: { scale: { domainMin: 1000, domainMax: 5000 } },
     })
     await model.loadGFA(RGFA, 'rgfa')
 
@@ -3244,6 +3415,71 @@ describe('walk rows', () => {
     expect(model.walkStripRows).toBeUndefined()
   })
 
+  // node 2 is off GRCh38's path and both A#1 and B#1 walk it
+  test('the block two rows walk off the reference is lettered on both', async () => {
+    rpcRespond()
+    const model = stateModelFactory().create({
+      type: 'GraphGenomeView',
+      layoutMode: 'walkrows',
+    })
+    await model.loadGFA(WALKS_GFA, 'walks')
+    expect(model.sharedBlocks).toBeUndefined()
+    model.setLayer('walkBlocks', true)
+    const rows = [model.walkRowBars!.reference, ...model.walkRowBars!.rows]
+    const lettered = model.sharedBlocks!.map(b => ({
+      label: rows[b.row]!.label,
+      start: b.start,
+      bp: b.bp,
+      block: b.block,
+    }))
+    expect(lettered.sort((a, b) => a.label.localeCompare(b.label))).toEqual([
+      { label: 'A#1', start: 4, bp: 8, block: 0 },
+      { label: 'B#1', start: 4, bp: 8, block: 0 },
+    ])
+  })
+
+  test('the shared order stacks rows that walk the same nodes together', async () => {
+    rpcRespond()
+    const model = stateModelFactory().create({
+      type: 'GraphGenomeView',
+      layoutMode: 'walkrows',
+    })
+    await model.loadGFA(WALKS_GFA, 'walks')
+    model.setWalkRowSamples(['A', 'B'])
+    const before = model.walkRowBars!.rows.map(r => r.label)
+    model.setWalkRowOrder('shared')
+    const labels = model.walkRowBars!.rows.map(r => r.label)
+    expect(labels).not.toEqual(before)
+    // A#1 and B#1 share node 2, so B#1 stacks under A#1 rather than after
+    // A#2, which walks GRCh38's own route
+    expect(labels).toEqual(['A#1', 'B#1', 'A#2'])
+    // the sample filter and the order sit side by side in the grammar
+    expect(model.walkRowSamples).toEqual(['A', 'B'])
+    model.setWalkRowSamples(undefined)
+    expect(model.walkRowOrder).toBe('shared')
+  })
+
+  test('ribbons join neighbouring walk rows where they walk the same nodes', async () => {
+    rpcRespond()
+    const model = stateModelFactory().create({
+      type: 'GraphGenomeView',
+      layoutMode: 'walkrows',
+    })
+    await model.loadGFA(WALKS_GFA, 'walks')
+    expect(model.walkRowRibbons).toBeUndefined()
+    model.setLayer('walkRibbons', true)
+    const ribbons = model.walkRowRibbons!
+    expect(ribbons.length).toBeGreaterThan(0)
+    // every row passes nodes 1 and 3, so each pair of neighbours shares a
+    // stretch that starts at both bars' left ends
+    const rows = [model.walkRowBars!.reference, ...model.walkRowBars!.rows]
+    for (let row = 0; row < rows.length - 1; row++) {
+      expect(ribbons.some(r => r.row === row && r.a0 === 0 && r.b0 === 0)).toBe(
+        true,
+      )
+    }
+  })
+
   test('walk rows and tube maps take no strip', async () => {
     rpcRespond()
     const model = stateModelFactory().create({
@@ -3604,7 +3840,7 @@ describe('walk rows', () => {
     model.liftWalks(['B#1#ctg'])
     const svg = model.figure()!
     expect(svg).toMatch(/^<svg xmlns="http:\/\/www\.w3\.org\/2000\/svg"/)
-    expect(svg).toContain('not on B#1')
+    expect(svg).toContain('only in other haplotypes')
   })
 
   test('a tube map lifts no walk: its tubes are the walks', async () => {
@@ -3801,6 +4037,33 @@ describe('walk rows', () => {
     model.setHoveredRowWalks([])
     expect(model.walkLift).toBeUndefined()
   })
+
+  // each lift rebuilds the drawing, and a sweep down a lane crosses many rows
+  test('moving between lane rows lifts the next once the pointer settles', async () => {
+    rpcRespond()
+    const model = stateModelFactory().create({
+      type: 'GraphGenomeView',
+      layoutMode: 'auto',
+    })
+    await model.loadGFA(WALKS_GFA, 'walks')
+    vi.useFakeTimers()
+    try {
+      model.setHoveredRowWalks(['A#1#ctg'])
+      expect(model.hoveredRowWalks).toEqual(['A#1#ctg'])
+      model.setHoveredRowWalks(['A#2#ctg'])
+      model.setHoveredRowWalks(['B#1#ctg'])
+      vi.advanceTimersByTime(40)
+      // more moves within the row do not put the lift off
+      model.setHoveredRowWalks(['B#1#ctg'])
+      expect(model.hoveredRowWalks).toEqual(['A#1#ctg'])
+      vi.advanceTimersByTime(60)
+      expect(model.hoveredRowWalks).toEqual(['B#1#ctg'])
+      model.setHoveredRowWalks([])
+      expect(model.hoveredRowWalks).toEqual([])
+    } finally {
+      vi.useRealTimers()
+    }
+  })
 })
 
 describe('annotation reads beside a cut', () => {
@@ -3900,6 +4163,43 @@ describe('annotation reads beside a cut', () => {
     expect(model.error).toBeUndefined()
   })
 
+  // most graphs have no bubble index, and a pan re-cuts many times
+  test('a bubble index that failed to read is not asked for again', async () => {
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const bubbleReads = () =>
+      mockRpcCall.mock.calls.filter(
+        c =>
+          (c[2] as { adapterConfig?: { type?: string } }).adapterConfig
+            ?.type === 'MinigraphBubbleAdapter',
+      ).length
+    const respond = mockRpcCall.getMockImplementation()!
+    mockRpcCall.mockImplementation(
+      (sid: unknown, method: string, args: Record<string, unknown>) =>
+        (args.adapterConfig as { type?: string } | undefined)?.type ===
+        'MinigraphBubbleAdapter'
+          ? Promise.reject(new Error('404'))
+          : respond(sid, method, args),
+    )
+    const model = attachedModel()
+    const settleAll = async () => {
+      await vi.waitFor(() => {
+        expect(reads.length).toBeGreaterThanOrEqual(2)
+      })
+      for (const read of reads.splice(0)) {
+        read.settle([])
+      }
+    }
+    let loaded = cut(model)
+    await settleAll()
+    await loaded
+    expect(bubbleReads()).toBe(1)
+    loaded = cut(model)
+    await settleAll()
+    await loaded
+    expect(bubbleReads()).toBe(1)
+    warn.mockRestore()
+  })
+
   test('a cut too large to draw still reads its genes, for when the limit is raised', async () => {
     vi.spyOn(console, 'error').mockImplementation(() => {})
     const model = attachedModel()

package/src/GraphGenomeView/model.ts

@@ -1,5 +1,3 @@
-import { cutsWholeWalks as wholeWalksRule } from '@jbrowse/bandage-core/layout/walkStrip'
-import { layoutModeByValue } from '@jbrowse/bandage-core/layoutModes'
 import { getSession } from '@jbrowse/core/util'
 
 import {
@@ -46,16 +44,11 @@ export const GraphPane = withLaunchActions
             canonicalAssemblyName(session, region.assemblyName),
           )
     },
-    // Walk rows, and the strip of them under a node layout, measure whole
-    // walks, which a GBZ cut only follows when asked, so a layout change
-    // that changes whether the drawing needs them cuts the track again.
+    // A layout change that changes the cut options cuts the track again:
+    // whole walks (cutsWholeWalksIn), or the walk-row step budget.
     cutChangedFrom(from: LayoutModeValue) {
-      const before = wholeWalksRule(layoutModeByValue(from), {
-        walkStrip: self.walkStrip,
-        host: !!self.host,
-      })
       return (
-        self.cutsWholeWalks !== before ||
+        self.cutsWholeWalks !== self.cutsWholeWalksIn(from) ||
         (from === 'walkrows') !== (self.chosenLayoutMode === 'walkrows')
       )
     },

package/src/GraphGenomeView/nodeColor.test.ts

@@ -8,12 +8,38 @@ test.each(COLOR_SCHEME_VALUES)('%s survives the trip through a color', s => {
 
 test('a color carries its domain', () => {
   const color = colorOfScheme('reference-position', { start: 5, end: 50 })
-  expect(color).toEqual({ field: 'position', domainMin: 5, domainMax: 50 })
+  expect(color).toEqual({
+    field: 'position',
+    scale: { domainMin: 5, domainMax: 50 },
+  })
   expect(domainOfColor(color)).toEqual({ start: 5, end: 50 })
 })
 
 test('a color it cannot read is auto', () => {
   expect(schemeOfColor({ field: 'gc' })).toBe('auto')
   expect(schemeOfColor('red')).toBe('auto')
+  expect(schemeOfColor({ value: 'red' })).toBe('auto')
   expect(schemeOfColor(undefined)).toBe('auto')
 })
+
+test('a constant is a value and a field is its own member', () => {
+  expect(colorOfScheme('grey')).toEqual({ value: 'grey' })
+  expect(colorOfScheme('depth')).toEqual({ field: 'depth' })
+})
+
+test('the id field reads its scale off the nested scale', () => {
+  expect(schemeOfColor({ field: 'id' })).toBe('random')
+  expect(schemeOfColor({ field: 'id', scale: { type: 'ordinal' } })).toBe(
+    'random',
+  )
+  expect(schemeOfColor({ field: 'id', scale: { scheme: 'rainbow' } })).toBe(
+    'rainbow',
+  )
+})
+
+test('a flat member beside the field reads as nothing', () => {
+  expect(schemeOfColor({ field: 'id', scheme: 'rainbow' })).toBe('random')
+  expect(domainOfColor({ field: 'position', domainMin: 1, domainMax: 2 })).toBe(
+    undefined,
+  )
+})

package/src/GraphGenomeView/nodeColor.ts

@@ -7,21 +7,28 @@ interface Span {
   end: number
 }
 
-// The node color as a config or session writes it, in core's color-object
-// members (ADR-131, ADR-151): a named constant, or the field the nodes are
-// colored by. `{}` or unset picks by the graph, reference position on an
-// anchored one. Translated here because Bandage's painter takes its own
-// schemes, which BandageJS shares.
-export type NodeColor =
-  | 'grey'
-  | 'uniform'
-  | {
-      field?: 'depth' | 'length' | 'rank' | 'position' | 'id'
-      scale?: 'categorical'
-      scheme?: 'rainbow'
-      domainMin?: number
-      domainMax?: number
-    }
+// The node color as a config or session writes it, in core's channel object
+// (ADR-240): a `value` naming a constant scheme, or the `field` the nodes are
+// colored by with the `scale` it maps through. `{}` or unset picks by the
+// graph, reference position on an anchored one. Not display-kit's
+// `colorConfigSchema`: its `value` is a CSS color and its `field` a feature
+// attribute, where Bandage's painter takes its own schemes, which BandageJS
+// shares.
+export interface NodeColor {
+  value?: 'grey' | 'uniform'
+  field?: 'depth' | 'length' | 'rank' | 'position' | 'id'
+  scale?: {
+    type?: 'ordinal'
+    scheme?: 'rainbow'
+    domainMin?: number
+    domainMax?: number
+  }
+}
+
+// What the node color sits in on a display's config: core's `encoding`
+export interface GraphEncoding {
+  color?: NodeColor
+}
 
 const SCHEME_OF_FIELD = {
   depth: 'depth',
@@ -35,13 +42,15 @@ const FIELD_OF_SCHEME = Object.fromEntries(
 ) as Record<string, keyof typeof SCHEME_OF_FIELD>
 
 export function schemeOfColor(color: unknown): ColorScheme {
-  if (color === 'grey' || color === 'uniform') {
-    return color
-  }
   if (isRecord(color)) {
-    const { field, scheme } = color
+    const { field, value, scale } = color
+    if (value === 'grey' || value === 'uniform') {
+      return value
+    }
     if (field === 'id') {
-      return scheme === 'rainbow' ? 'rainbow' : 'random'
+      return isRecord(scale) && scale.scheme === 'rainbow'
+        ? 'rainbow'
+        : 'random'
     }
     if (typeof field === 'string' && field in SCHEME_OF_FIELD) {
       return SCHEME_OF_FIELD[field as keyof typeof SCHEME_OF_FIELD]
@@ -51,26 +60,26 @@ export function schemeOfColor(color: unknown): ColorScheme {
 }
 
 export function domainOfColor(color: unknown): Span | undefined {
-  return isRecord(color) &&
-    typeof color.domainMin === 'number' &&
-    typeof color.domainMax === 'number'
-    ? { start: color.domainMin, end: color.domainMax }
+  const scale = isRecord(color) ? color.scale : undefined
+  return isRecord(scale) &&
+    typeof scale.domainMin === 'number' &&
+    typeof scale.domainMax === 'number'
+    ? { start: scale.domainMin, end: scale.domainMax }
     : undefined
 }
 
 export function colorOfScheme(scheme: ColorScheme, domain?: Span): NodeColor {
   if (scheme === 'grey' || scheme === 'uniform') {
-    return scheme
+    return { value: scheme }
   }
   return scheme === 'random'
-    ? { field: 'id', scale: 'categorical' }
+    ? { field: 'id', scale: { type: 'ordinal' } }
     : scheme === 'rainbow'
-      ? { field: 'id', scheme: 'rainbow' }
+      ? { field: 'id', scale: { scheme: 'rainbow' } }
       : scheme === 'reference-position' && domain
         ? {
             field: 'position',
-            domainMin: domain.start,
-            domainMax: domain.end,
+            scale: { domainMin: domain.start, domainMax: domain.end },
           }
         : FIELD_OF_SCHEME[scheme]
           ? { field: FIELD_OF_SCHEME[scheme] }

package/src/GraphGenomeView/nodeSize.test.ts

@@ -1,14 +1,30 @@
-import { nodeSizeOf, sizeOfNodeWidth } from './nodeSize'
+import { nodeSizeOf, sizeOf } from './nodeSize'
 
 test('a number is a uniform thickness, an object scales by its field', () => {
-  expect(nodeSizeOf(9)).toEqual({ width: 'uniform', px: 9 })
+  expect(nodeSizeOf(9)).toEqual({ width: 'uniform', px: 9, links: 'uniform' })
   expect(nodeSizeOf({ field: 'depth', value: 4 })).toEqual({
     width: 'depth',
     px: 4,
+    links: 'uniform',
+  })
+  expect(nodeSizeOf(undefined)).toEqual({
+    width: 'depth',
+    px: 6,
+    links: 'uniform',
+  })
+  expect(nodeSizeOf({ value: 5, links: 'walks' })).toEqual({
+    width: 'uniform',
+    px: 5,
+    links: 'walks',
   })
-  expect(nodeSizeOf(undefined)).toEqual({ width: 'depth', px: 6 })
 })
 
-test.each(['depth', 'uniform'] as const)('%s survives the trip', width => {
-  expect(nodeSizeOf(sizeOfNodeWidth(width, 5))).toEqual({ width, px: 5 })
+test.each([
+  ['depth', 'uniform'],
+  ['uniform', 'uniform'],
+  ['depth', 'walks'],
+  ['uniform', 'walks'],
+] as const)('nodes %s, links %s survive the trip', (width, links) => {
+  const size = { width, px: 5, links }
+  expect(nodeSizeOf(sizeOf(size))).toEqual(size)
 })

package/src/GraphGenomeView/nodeSize.ts

@@ -1,25 +1,41 @@
 import { isRecord } from '../isRecord'
 
+import type { EdgeWidth } from '@jbrowse/bandage-core/edgeWidths'
 import type { NodeWidth } from '@jbrowse/bandage-core/nodeWidths'
 
-// The node thickness as a config or session writes it: a px number draws every
+// The mark thickness as a config or session writes it: a px number draws every
 // node that thick; `{ field: 'depth', value }` thickens a node the more paths
-// carry it, around `value` px. Unset is by depth around 6.
-export type NodeSize = number | { field?: 'depth'; value?: number }
+// carry it, around `value` px; `links: 'walks'` thickens a link the more walks
+// take it. Unset is nodes by depth around 6, links uniform.
+export type NodeSize =
+  number | { field?: 'depth'; value?: number; links?: 'walks' }
 
 const DEFAULT_PX = 6
 
-export function nodeSizeOf(size: unknown): { width: NodeWidth; px: number } {
+export interface MarkSize {
+  width: NodeWidth
+  px: number
+  links: EdgeWidth
+}
+
+export function nodeSizeOf(size: unknown): MarkSize {
   return typeof size === 'number'
-    ? { width: 'uniform', px: size }
+    ? { width: 'uniform', px: size, links: 'uniform' }
     : isRecord(size)
       ? {
           width: size.field === 'depth' ? 'depth' : 'uniform',
           px: typeof size.value === 'number' ? size.value : DEFAULT_PX,
+          links: size.links === 'walks' ? 'walks' : 'uniform',
         }
-      : { width: 'depth', px: DEFAULT_PX }
+      : { width: 'depth', px: DEFAULT_PX, links: 'uniform' }
 }
 
-export function sizeOfNodeWidth(width: NodeWidth, px: number): NodeSize {
-  return width === 'depth' ? { field: 'depth', value: px } : px
+export function sizeOf({ width, px, links }: MarkSize): NodeSize {
+  return width === 'uniform' && links === 'uniform'
+    ? px
+    : {
+        ...(width === 'depth' ? { field: 'depth' as const } : {}),
+        value: px,
+        ...(links === 'walks' ? { links } : {}),
+      }
 }