Improve assembly loading time by moving to main thread

packages/core/assemblyManager/assembly.ts

@@ -62,7 +62,6 @@ async function loadRefNameMap(
     },
     { timeout: 1000000 },
   )
-
   const refNameMap: Record<string, string> = {}
   const { refNameAliases } = assembly
   if (!refNameAliases) {
@@ -160,6 +159,9 @@ export default function assemblyFactory(assemblyConfigType: IAnyType) {
         }
         return Array.from(self.refNameAliases.keys())
       },
+      get pluginManager() {
+        return getParent(self, 2).pluginManager
+      },
       get rpcManager() {
         return getParent(self, 2).rpcManager
       },
@@ -292,6 +294,7 @@ function loadAssemblyData(self: Assembly) {
       sequenceAdapterConfig,
       adapterConfigId,
       rpcManager,
+      assembly: self,
       assemblyName: self.name,
       refNameAliasesAdapterConfig,
     }
@@ -300,44 +303,40 @@ function loadAssemblyData(self: Assembly) {
 }
 async function loadAssemblyReaction(
   props: ReturnType<typeof loadAssemblyData> | undefined,
-  signal: AbortSignal,
+  _signal: AbortSignal,
 ) {
   if (!props) {
     return
   }
 
   const {
     sequenceAdapterConfig,
-    rpcManager,
     assemblyName,
+    assembly,
     refNameAliasesAdapterConfig,
   } = props
 
-  const sessionId = `assembly-${assemblyName}`
-  const adapterRegions = (await rpcManager.call(
-    sessionId,
-    'CoreGetRegions',
-    { sessionId, adapterConfig: sequenceAdapterConfig, signal },
-    { timeout: 1000000 },
-  )) as Region[]
+  const { pluginManager } = assembly
+  const dataAdapterType = pluginManager.getAdapterType(
+    sequenceAdapterConfig.type,
+  )
+  const adapter = new dataAdapterType.AdapterClass(sequenceAdapterConfig)
+  const adapterRegions = (await adapter.getRegions()) as Region[]
+
   const adapterRegionsWithAssembly = adapterRegions.map(adapterRegion => {
     const { refName } = adapterRegion
     checkRefName(refName)
     return { ...adapterRegion, assemblyName }
   })
   const refNameAliases: RefNameAliases = {}
   if (refNameAliasesAdapterConfig) {
-    const refNameAliasesAborter = new AbortController()
-    const refNameAliasesList = (await rpcManager.call(
-      sessionId,
-      'CoreGetRefNameAliases',
-      {
-        sessionId,
-        adapterConfig: refNameAliasesAdapterConfig,
-        signal: refNameAliasesAborter.signal,
-      },
-      { timeout: 1000000 },
-    )) as {
+    const refAliasAdapterType = pluginManager.getAdapterType(
+      refNameAliasesAdapterConfig.type,
+    )
+    const refNameAliasAdapter = new refAliasAdapterType.AdapterClass(
+      refNameAliasesAdapterConfig,
+    )
+    const refNameAliasesList = (await refNameAliasAdapter.getRefNameAliases()) as {
       refName: string
       aliases: string[]
     }[]

packages/core/assemblyManager/assemblyManager.ts

@@ -41,6 +41,9 @@ export default function assemblyManagerFactory(assemblyConfigType: IAnyType) {
       get rpcManager() {
         return getParent(self).rpcManager
       },
+      get pluginManager() {
+        return getParent(self).pluginManager
+      },
       get allPossibleRefNames() {
         let refNames: string[] = []
         for (const assembly of self.assemblies) {

packages/core/rpc/coreRpcMethods.ts

@@ -8,38 +8,12 @@ import ServerSideRendererType, {
 } from '../pluggableElementTypes/renderers/ServerSideRendererType'
 import { RemoteAbortSignal } from './remoteAbortSignals'
 import {
-  isRegionsAdapter,
   BaseFeatureDataAdapter,
   isRefNameAliasAdapter,
 } from '../data_adapters/BaseAdapter'
 import { Region } from '../util/types'
 import { checkAbortSignal, renameRegionsIfNeeded } from '../util'
 
-export class CoreGetRegions extends RpcMethodType {
-  name = 'CoreGetRegions'
-
-  async execute(args: {
-    sessionId: string
-    signal: RemoteAbortSignal
-    adapterConfig: {}
-  }) {
-    const deserializedArgs = await this.deserializeArguments(args)
-    const { sessionId, adapterConfig } = deserializedArgs
-    const { dataAdapter } = getAdapter(
-      this.pluginManager,
-      sessionId,
-      adapterConfig,
-    )
-    if (
-      dataAdapter instanceof BaseFeatureDataAdapter &&
-      isRegionsAdapter(dataAdapter)
-    ) {
-      return dataAdapter.getRegions(deserializedArgs)
-    }
-    return []
-  }
-}
-
 export class CoreGetRefNames extends RpcMethodType {
   name = 'CoreGetRefNames'
 
@@ -62,28 +36,6 @@ export class CoreGetRefNames extends RpcMethodType {
   }
 }
 
-export class CoreGetRefNameAliases extends RpcMethodType {
-  name = 'CoreGetRefNameAliases'
-
-  async execute(args: {
-    sessionId: string
-    signal: RemoteAbortSignal
-    adapterConfig: {}
-  }) {
-    const deserializedArgs = await this.deserializeArguments(args)
-    const { sessionId, adapterConfig } = deserializedArgs
-    const { dataAdapter } = getAdapter(
-      this.pluginManager,
-      sessionId,
-      adapterConfig,
-    )
-    if (isRefNameAliasAdapter(dataAdapter)) {
-      return dataAdapter.getRefNameAliases(deserializedArgs)
-    }
-    return []
-  }
-}
-
 export class CoreGetFileInfo extends RpcMethodType {
   name = 'CoreGetInfo'
 

plugins/linear-genome-view/src/LinearGenomeView/components/Header.tsx

@@ -79,9 +79,16 @@ const Controls = observer(({ model }: { model: LGV }) => {
 const Search = observer(({ model }: { model: LGV }) => {
   const [value, setValue] = useState<string | undefined>()
   const inputRef = useRef<HTMLInputElement>(null)
-  const classes = useStyles()
   const theme = useTheme()
-  const { coarseVisibleLocStrings: visibleLocStrings } = model
+  const {
+    coarseVisibleLocStrings,
+    visibleLocStrings: nonCoarseVisibleLocStrings,
+  } = model
+
+  // use regular visibleLocStrings if coarseVisibleLocStrings is undefined
+  const visibleLocStrings =
+    coarseVisibleLocStrings || nonCoarseVisibleLocStrings
+
   const session = getSession(model)
 
   function navTo(locString: string) {
@@ -95,21 +102,29 @@ const Search = observer(({ model }: { model: LGV }) => {
 
   return (
     <form
+      data-testid="search-form"
       onSubmit={event => {
         event.preventDefault()
         inputRef && inputRef.current && inputRef.current.blur()
         value && navTo(value)
+
+        // need to manually call the action of blur here for
+        // react-testing-library
+        setValue(undefined)
       }}
     >
       <TextField
         inputRef={inputRef}
         onFocus={() => setValue(visibleLocStrings)}
         onBlur={() => setValue(undefined)}
         onChange={event => setValue(event.target.value)}
-        className={classes.input}
         variant="outlined"
         value={value === undefined ? visibleLocStrings : value}
         style={{ margin: SPACING, marginLeft: SPACING * 3 }}
+        inputProps={{
+          'data-testid': 'search-input',
+        }}
+        // eslint-disable-next-line react/jsx-no-duplicate-props
         InputProps={{
           startAdornment: <SearchIcon />,
           style: {

plugins/linear-genome-view/src/LinearGenomeView/components/__snapshots__/LinearGenomeView.test.js.snap

@@ -228,9 +228,11 @@ exports[`<LinearGenomeView /> renders one track, one region 1`] = `
               </div>
             </div>
           </div>
-          <form>
+          <form
+            data-testid="search-form"
+          >
             <div
-              class="MuiFormControl-root MuiTextField-root makeStyles-input"
+              class="MuiFormControl-root MuiTextField-root"
               style="margin: 7px 7px 7px 21px;"
             >
               <div
@@ -250,6 +252,7 @@ exports[`<LinearGenomeView /> renders one track, one region 1`] = `
                 <input
                   aria-invalid="false"
                   class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputAdornedStart MuiOutlinedInput-inputAdornedStart"
+                  data-testid="search-input"
                   type="text"
                   value="ctgA:1..100"
                 />
@@ -1028,9 +1031,11 @@ exports[`<LinearGenomeView /> renders two tracks, two regions 1`] = `
               </div>
             </div>
           </div>
-          <form>
+          <form
+            data-testid="search-form"
+          >
             <div
-              class="MuiFormControl-root MuiTextField-root makeStyles-input"
+              class="MuiFormControl-root MuiTextField-root"
               style="margin: 7px 7px 7px 21px;"
             >
               <div
@@ -1050,6 +1055,7 @@ exports[`<LinearGenomeView /> renders two tracks, two regions 1`] = `
                 <input
                   aria-invalid="false"
                   class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputAdornedStart MuiOutlinedInput-inputAdornedStart"
+                  data-testid="search-input"
                   type="text"
                   value="ctgA:1..100;ctgB:1,001..1,698"
                 />

plugins/linear-genome-view/src/LinearGenomeView/index.ts

@@ -129,8 +129,15 @@ export function stateModelFactory(pluginManager: PluginManager) {
     }))
     .views(self => ({
       get initialized() {
+        const { assemblyNames } = this
+        const { assemblyManager } = getSession(self)
+        const assembliesInitialized = assemblyNames.every(
+          asm => assemblyManager.get(asm)?.initialized,
+        )
         return (
-          self.volatileWidth !== undefined && self.displayedRegions.length > 0
+          self.volatileWidth !== undefined &&
+          self.displayedRegions.length > 0 &&
+          assembliesInitialized
         )
       },
       get scaleBarHeight() {
@@ -658,14 +665,18 @@ export function stateModelFactory(pluginManager: PluginManager) {
       navToMultiple(locations: NavLocation[]) {
         const firstLocation = locations[0]
         let { refName } = firstLocation
-        const { start, end, assemblyName } = firstLocation
+        const {
+          start,
+          end,
+          assemblyName = self.assemblyNames[0],
+        } = firstLocation
+
         if (start !== undefined && end !== undefined && start > end) {
           throw new Error(`start "${start + 1}" is greater than end "${end}"`)
         }
         const session = getSession(self)
-        const assembly = session.assemblyManager.get(
-          assemblyName || self.assemblyNames[0],
-        )
+        const { assemblyManager } = session
+        const assembly = assemblyManager.get(assemblyName)
         if (assembly) {
           const canonicalRefName = assembly.getCanonicalRefName(refName)
           if (canonicalRefName) {

products/jbrowse-web/src/rootModel.ts

@@ -58,6 +58,7 @@ export default function RootModel(
     })
     .volatile(() => ({
       savedSessionsVolatile: observable.map({}),
+      pluginManager,
       error: undefined as undefined | Error,
     }))
     .views(self => ({

products/jbrowse-web/src/tests/BasicLinearGenomeView.test.js

@@ -104,24 +104,21 @@ describe('valid file tests', () => {
   })
 
   it('click and zoom in and back out', async () => {
-    jest.useFakeTimers()
     const pluginManager = getPluginManager()
     const state = pluginManager.rootModel
-    const { findByTestId, getAllByText } = render(
+    const { findByTestId, findAllByText } = render(
       <JBrowse pluginManager={pluginManager} />,
     )
-    await getAllByText('ctgA')
+    await findAllByText('ctgA')
     const before = state.session.views[0].bpPerPx
     fireEvent.click(await findByTestId('zoom_in'))
     await wait(() => {
-      jest.runAllTimers()
       const after = state.session.views[0].bpPerPx
       expect(after).toBe(before / 2)
     })
     expect(state.session.views[0].bpPerPx).toBe(before / 2)
     fireEvent.click(await findByTestId('zoom_out'))
     await wait(() => {
-      jest.runAllTimers()
       const after = state.session.views[0].bpPerPx
       expect(after).toBe(before)
     })
@@ -172,4 +169,29 @@ describe('valid file tests', () => {
     expect(centerLineInfo.refName).toBe('ctgA')
     expect(centerLineInfo.offset).toEqual(120)
   })
+
+  it('test navigation with the search input box', async () => {
+    const pluginManager = getPluginManager()
+    const { findByTestId, findByText } = render(
+      <JBrowse pluginManager={pluginManager} />,
+    )
+    fireEvent.click(await findByText('Help'))
+
+    // need this to complete before we can try to search
+    fireEvent.click(await findByTestId('htsTrackEntry-volvox_alignments'))
+    await findByTestId(
+      'trackRenderingContainer-integration_test-volvox_alignments',
+    )
+
+    const target = await findByTestId('search-input')
+    const form = await findByTestId('search-form')
+    fireEvent.change(target, { target: { value: 'contigA:1-200' } })
+    form.submit()
+    // can't just hit enter it seems
+    // fireEvent.keyDown(target, { key: 'Enter', code: 'Enter' })
+    await wait(() => {
+      expect(target.value).toBe('ctgA:1..200')
+    })
+    expect(target.value).toBe('ctgA:1..200')
+  })
 })

products/jbrowse-web/src/tests/Loader.test.tsx

@@ -16,7 +16,11 @@ if (!window.TextDecoder) {
   window.TextDecoder = TextDecoder
 }
 
-const getFile = (url: string) => new LocalFile(require.resolve(`../../${url}`))
+const getFile = (url: string) => {
+  url = url.replace(/http:\/\/localhost\//, '')
+  return new LocalFile(require.resolve(`../../${url}`))
+}
+
 const readBuffer = async (url: string, args: RequestInit) => {
   if (url.match(/testid/)) {
     return {
@@ -32,6 +36,15 @@ const readBuffer = async (url: string, args: RequestInit) => {
       statusText: 'failed to find session',
     }
   }
+  // this is the analytics
+  if (url.match(/jb2=true/)) {
+    return {
+      ok: true,
+      async json() {
+        return {}
+      },
+    }
+  }
   try {
     const file = getFile(url)
     const maxRangeRequest = 1000000 // kind of arbitrary, part of the rangeParser