@jbrowse/plugin-alignments 2.5.0 → 2.6.0

package/src/BamAdapter/BamAdapter.ts

@@ -8,10 +8,10 @@ import { bytesForRegions, updateStatus, Feature } from '@jbrowse/core/util'
 import { openLocation } from '@jbrowse/core/util/io'
 import { ObservableCreate } from '@jbrowse/core/util/rxjs'
 import { toArray } from 'rxjs/operators'
+import { firstValueFrom } from 'rxjs'
 
 // locals
 import BamSlightlyLazyFeature from './BamSlightlyLazyFeature'
-import { firstValueFrom } from 'rxjs'
 
 interface Header {
   idToName: string[]
@@ -43,8 +43,6 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
       // chunkSizeLimit and fetchSizeLimit are more troublesome than
       // helpful, and have given overly large values on the ultra long
       // nanopore reads even with 500MB limits, so disabled with infinity
-      chunkSizeLimit: Infinity,
-      fetchSizeLimit: Infinity,
       yieldThreadTime: Infinity,
     })
 
@@ -89,7 +87,7 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
         const idToName: string[] = []
         const nameToId: Record<string, number> = {}
         samHeader
-          .filter(l => l.tag === 'SQ')
+          ?.filter(l => l.tag === 'SQ')
           .forEach((sqLine, refId) => {
             sqLine.data.forEach(item => {
               if (item.tag === 'SN') {
@@ -182,48 +180,50 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
     return ObservableCreate<Feature>(async observer => {
       const { bam } = await this.configure()
       await this.setup(opts)
-      statusCallback('Downloading alignments')
-      const records = await bam.getRecordsForRange(refName, start, end, opts)
-
-      const {
-        flagInclude = 0,
-        flagExclude = 0,
-        tagFilter,
-        readName,
-      } = filterBy || {}
-
-      for (const record of records) {
-        let ref: string | undefined
-        if (!record.get('MD')) {
-          ref = await this.seqFetch(
-            originalRefName || refName,
-            record.get('start'),
-            record.get('end'),
-          )
-        }
+      const records = await updateStatus(
+        'Downloading alignments',
+        statusCallback,
+        () => bam.getRecordsForRange(refName, start, end, opts),
+      )
 
-        const flags = record.flags
-        if (
-          !((flags & flagInclude) === flagInclude && !(flags & flagExclude))
-        ) {
-          continue
-        }
+      await updateStatus('Processing alignments', statusCallback, async () => {
+        const {
+          flagInclude = 0,
+          flagExclude = 0,
+          tagFilter,
+          readName,
+        } = filterBy || {}
+
+        for (const record of records) {
+          let ref: string | undefined
+          if (!record.get('MD')) {
+            ref = await this.seqFetch(
+              originalRefName || refName,
+              record.get('start'),
+              record.get('end'),
+            )
+          }
 
-        if (tagFilter) {
-          const val = record.get(tagFilter.tag)
-          if (!(val === '*' ? val !== undefined : val === tagFilter.value)) {
+          const flags = record.flags
+          if ((flags & flagInclude) !== flagInclude && !(flags & flagExclude)) {
             continue
           }
-        }
 
-        if (readName && record.get('name') !== readName) {
-          continue
-        }
+          if (tagFilter) {
+            const v = record.get(tagFilter.tag)
+            if (!(v === '*' ? v !== undefined : `${v}` === tagFilter.value)) {
+              continue
+            }
+          }
 
-        observer.next(new BamSlightlyLazyFeature(record, this, ref))
-      }
-      statusCallback('')
-      observer.complete()
+          if (readName && record.get('name') !== readName) {
+            continue
+          }
+
+          observer.next(new BamSlightlyLazyFeature(record, this, ref))
+        }
+        observer.complete()
+      })
     }, signal)
   }
 
@@ -233,8 +233,7 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
   ) {
     const { bam } = await this.configure()
     // this is a method to avoid calling on htsget adapters
-    // @ts-expect-error
-    if (bam.index.filehandle !== '?') {
+    if (bam.index) {
       const bytes = await bytesForRegions(regions, bam)
       const fetchSizeLimit = this.getConf('fetchSizeLimit')
       return { bytes, fetchSizeLimit }

package/src/CombinationTest.test.ts

@@ -100,9 +100,9 @@ async function mismatchesCheck(f: string) {
 test('match CIGAR across file types', async () => {
   await cigarCheck('volvox-sorted')
   await cigarCheck('volvox-long-reads.fastq.sorted')
-})
+}, 20000)
 
 test('mismatches same across file types', async () => {
   await mismatchesCheck('volvox-sorted')
   await mismatchesCheck('volvox-long-reads.fastq.sorted')
-})
+}, 20000)

package/src/CramAdapter/CramAdapter.ts

@@ -4,7 +4,12 @@ import {
   BaseOptions,
   BaseSequenceAdapter,
 } from '@jbrowse/core/data_adapters/BaseAdapter'
-import { checkAbortSignal, Region, Feature } from '@jbrowse/core/util'
+import {
+  checkAbortSignal,
+  Region,
+  Feature,
+  updateStatus,
+} from '@jbrowse/core/util'
 import { openLocation } from '@jbrowse/core/util/io'
 import { ObservableCreate } from '@jbrowse/core/util/rxjs'
 import { toArray } from 'rxjs/operators'
@@ -142,36 +147,36 @@ export default class CramAdapter extends BaseFeatureDataAdapter {
 
   private async setupPre(opts?: BaseOptions) {
     const { statusCallback = () => {} } = opts || {}
-    const conf = await this.configure()
-    statusCallback('Downloading index')
-    const { cram } = conf
-    const samHeader = await cram.cram.getSamHeader()
-
-    // use the @SQ lines in the header to figure out the
-    // mapping between ref ID numbers and names
-    const idToName: string[] = []
-    const nameToId: Record<string, number> = {}
-    samHeader
-      .filter(l => l.tag === 'SQ')
-      .forEach((sqLine, refId) => {
-        sqLine.data.forEach(item => {
-          if (item.tag === 'SN') {
-            // this is the ref name
-            const refName = item.value
-            nameToId[refName] = refId
-            idToName[refId] = refName
-          }
+    return updateStatus('Downloading index', statusCallback, async () => {
+      const conf = await this.configure()
+      const { cram } = conf
+      const samHeader = await cram.cram.getSamHeader()
+
+      // use the @SQ lines in the header to figure out the
+      // mapping between ref ID numbers and names
+      const idToName: string[] = []
+      const nameToId: Record<string, number> = {}
+      samHeader
+        .filter(l => l.tag === 'SQ')
+        .forEach((sqLine, refId) => {
+          sqLine.data.forEach(item => {
+            if (item.tag === 'SN') {
+              // this is the ref name
+              const refName = item.value
+              nameToId[refName] = refId
+              idToName[refId] = refName
+            }
+          })
         })
-      })
 
-    const readGroups = samHeader
-      .filter(l => l.tag === 'RG')
-      .map(rgLine => rgLine.data.find(item => item.tag === 'ID')?.value)
+      const readGroups = samHeader
+        .filter(l => l.tag === 'RG')
+        .map(rgLine => rgLine.data.find(item => item.tag === 'ID')?.value)
 
-    const data = { idToName, nameToId, readGroups }
-    statusCallback('')
-    this.samHeader = data
-    return { samHeader: data, ...conf }
+      const data = { idToName, nameToId, readGroups }
+      this.samHeader = data
+      return { samHeader: data, ...conf }
+    })
   }
 
   private async setup(opts?: BaseOptions) {
@@ -236,38 +241,44 @@ export default class CramAdapter extends BaseFeatureDataAdapter {
       if (originalRefName) {
         this.seqIdToOriginalRefName[refId] = originalRefName
       }
-      statusCallback('Downloading alignments')
-      const records = await cram.getRecordsForRange(refId, start, end)
+      const records = await updateStatus(
+        'Downloading alignments',
+        statusCallback,
+        () => cram.getRecordsForRange(refId, start, end),
+      )
       checkAbortSignal(signal)
-      const {
-        flagInclude = 0,
-        flagExclude = 0,
-        tagFilter,
-        readName,
-      } = filterBy || {}
-
-      let filtered = records.filter(record => {
-        const flags = record.flags
-        return (flags & flagInclude) === flagInclude && !(flags & flagExclude)
-      })
+      await updateStatus('Processing alignments', statusCallback, () => {
+        const {
+          flagInclude = 0,
+          flagExclude = 0,
+          tagFilter,
+          readName,
+        } = filterBy || {}
+
+        for (const record of records) {
+          const flags = record.flags
+          if ((flags & flagInclude) !== flagInclude && !(flags & flagExclude)) {
+            continue
+          }
 
-      if (tagFilter) {
-        filtered = filtered.filter(record => {
-          // @ts-expect-error
-          const val = record[tagFilter.tag]
-          return val === '*' ? val !== undefined : val === tagFilter.value
-        })
-      }
+          if (tagFilter) {
+            const v =
+              tagFilter.tag === 'RG'
+                ? this.samHeader.readGroups?.[record.readGroupId]
+                : record.tags[tagFilter.tag]
+            if (!(v === '*' ? v !== undefined : `${v}` === tagFilter.value)) {
+              continue
+            }
+          }
 
-      if (readName) {
-        filtered = filtered.filter(record => record.readName === readName)
-      }
+          if (readName && record.readName !== readName) {
+            continue
+          }
+          observer.next(this.cramRecordToFeature(record))
+        }
 
-      filtered.forEach(record => {
-        observer.next(this.cramRecordToFeature(record))
+        observer.complete()
       })
-      statusCallback('')
-      observer.complete()
     }, signal)
   }
 

package/src/CramAdapter/CramSlightlyLazyFeature.ts

@@ -47,8 +47,7 @@ export default class CramSlightlyLazyFeature implements Feature {
   }
 
   _read_group_id() {
-    const rg = this._store.samHeader.readGroups
-    return rg ? rg[this.record.readGroupId] : undefined
+    return this._store.samHeader.readGroups?.[this.record.readGroupId]
   }
 
   _get_qual() {
@@ -157,9 +156,7 @@ export default class CramSlightlyLazyFeature implements Feature {
     const mismatches = this.get('mismatches')
     if (mismatches.length) {
       const record =
-        this.get('strand') === -1
-          ? mismatches[mismatches.length - 1]
-          : mismatches[0]
+        this.get('strand') === -1 ? mismatches.at(-1) : mismatches[0]
       const { type, cliplen } = record
       if (type === 'softclip' || type === 'hardclip') {
         return cliplen

package/src/CramAdapter/CramTestAdapters.ts

@@ -13,7 +13,7 @@ export function parseSmallFasta(text: string) {
       const [defLine, ...seqLines] = entryText.split(/\n|\r\n|\r/)
       const [id, ...descriptionLines] = defLine.split(' ')
       const description = descriptionLines.join(' ')
-      const sequence = seqLines.join('').replace(/\s/g, '')
+      const sequence = seqLines.join('').replaceAll(/\s/g, '')
       return { id, description, sequence }
     })
 }

package/src/LinearAlignmentsDisplay/models/model.tsx

@@ -336,7 +336,11 @@ function stateModelFactory(
        */
       async renderSvg(opts: { rasterizeLayers?: boolean }) {
         const pileupHeight = self.height - self.SNPCoverageDisplay.height
-        await when(() => self.PileupDisplay.ready)
+        await when(
+          () =>
+            !self.PileupDisplay.renderProps().notReady &&
+            !self.SNPCoverageDisplay.renderProps().notReady,
+        )
         return (
           <>
             <g>{await self.SNPCoverageDisplay.renderSvg(opts)}</g>

package/src/LinearPileupDisplay/components/ColorByModifications.tsx

@@ -9,43 +9,7 @@ import {
   Typography,
 } from '@mui/material'
 import { Dialog } from '@jbrowse/core/ui'
-import { makeStyles } from 'tss-react/mui'
-
-const useStyles = makeStyles()(theme => ({
-  table: {
-    border: '1px solid #888',
-    margin: theme.spacing(4),
-    '& td': {
-      padding: theme.spacing(1),
-    },
-  },
-}))
-
-function ModificationTable({
-  modifications,
-}: {
-  modifications: [string, string][]
-}) {
-  const { classes } = useStyles()
-  return (
-    <table className={classes.table}>
-      <tbody>
-        {modifications.map(([key, value]) => (
-          <tr key={key}>
-            <td>{key}</td>
-            <td>{value}</td>
-            <td
-              style={{
-                width: '1em',
-                background: value,
-              }}
-            />
-          </tr>
-        ))}
-      </tbody>
-    </table>
-  )
-}
+import ModificationTable from './ModificationsTable'
 
 function ColorByTagDlg(props: {
   model: {
@@ -84,13 +48,13 @@ function ColorByTagDlg(props: {
                   />
                 </>
               ) : (
-                <div>
+                <>
                   <Typography>
                     Note: color by modifications is already enabled. Loading
                     current modifications...
                   </Typography>
                   <CircularProgress size={15} />
-                </div>
+                </>
               )}
             </div>
           ) : null}

package/src/LinearPileupDisplay/components/ColorByTag.tsx

@@ -32,22 +32,17 @@ function ColorByTagDlg(props: {
           placeholder="Enter tag name"
           inputProps={{
             maxLength: 2,
-            'data-testid': 'color-tag-name-input',
           }}
           error={tag.length === 2 && !validTag}
           helperText={tag.length === 2 && !validTag ? 'Not a valid tag' : ''}
           autoComplete="off"
-          data-testid="color-tag-name"
         />
         <DialogActions>
           <Button
             variant="contained"
             color="primary"
             onClick={() => {
-              model.setColorScheme({
-                type: 'tag',
-                tag,
-              })
+              model.setColorScheme({ type: 'tag', tag })
               handleClose()
             }}
             disabled={!validTag}

package/src/LinearPileupDisplay/components/LinearPileupDisplayBlurb.tsx

@@ -8,26 +8,25 @@ export interface LinearPileupDisplayBlurbProps {
       pos: number
       refName: number
       type: string
+      tag?: string
     }
   }
 }
 
-function LinearPileupDisplayBlurb(props: LinearPileupDisplayBlurbProps) {
+export default observer(function LinearPileupDisplayBlurb(
+  props: LinearPileupDisplayBlurbProps,
+) {
   const { model } = props
   const { sortedBy } = model
   return sortedBy ? (
-    <div
-      data-testid={`blurb-${model.sortedBy}`}
-      style={{ backgroundColor: 'white' }}
-    >
+    <div data-testid={`blurb-${sortedBy}`}>
       <Typography color="secondary" variant="caption">
-        {model.sortedBy
-          ? `Sorted by ${sortedBy.type.toLowerCase()} at ${sortedBy.refName}:${
-              sortedBy.pos
-            }`
+        {sortedBy
+          ? `Sorted by ${sortedBy.tag ?? sortedBy.type} at ${
+              sortedBy.refName
+            }:${sortedBy.pos}`
           : null}
       </Typography>
     </div>
   ) : null
-}
-export default observer(LinearPileupDisplayBlurb)
+})

package/src/LinearPileupDisplay/components/ModificationsTable.tsx

@@ -0,0 +1,38 @@
+import React from 'react'
+import { makeStyles } from 'tss-react/mui'
+
+const useStyles = makeStyles()(theme => ({
+  table: {
+    border: '1px solid #888',
+    margin: theme.spacing(4),
+    '& td': {
+      padding: theme.spacing(1),
+    },
+  },
+}))
+
+export default function ModificationTable({
+  modifications,
+}: {
+  modifications: [string, string | undefined][]
+}) {
+  const { classes } = useStyles()
+  return (
+    <table className={classes.table}>
+      <tbody>
+        {modifications.map(([key, value]) => (
+          <tr key={key}>
+            <td>{key}</td>
+            <td>{value}</td>
+            <td
+              style={{
+                width: '1em',
+                background: value,
+              }}
+            />
+          </tr>
+        ))}
+      </tbody>
+    </table>
+  )
+}