@jbrowse/core 2.2.1 → 2.3.0

package/pluggableElementTypes/renderers/FeatureRendererType.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const operators_1 = require("rxjs/operators");
+const clone_1 = __importDefault(require("clone"));
 const util_1 = require("../../util");
 const simpleFeature_1 = __importDefault(require("../../util/simpleFeature"));
 const dataAdapterCache_1 = require("../../data_adapters/dataAdapterCache");
@@ -11,10 +12,10 @@ const ServerSideRendererType_1 = __importDefault(require("./ServerSideRendererTy
 const BaseAdapter_1 = require("../../data_adapters/BaseAdapter");
 class FeatureRendererType extends ServerSideRendererType_1.default {
     /**
-     * replaces the `displayModel` param (which on the client is a MST model) with
-     * a stub that only contains the `selectedFeature`, since this is the only
-     * part of the track model that most renderers read. also serializes the
-     * config and regions to JSON from MST objects.
+     * replaces the `displayModel` param (which on the client is a MST model)
+     * with a stub that only contains the `selectedFeature`, since this is the only
+     * part of the track model that most renderers read. also serializes the config
+     * and regions to JSON from MST objects.
      *
      * @param args - the arguments passed to render
      */
@@ -26,7 +27,7 @@ class FeatureRendererType extends ServerSideRendererType_1.default {
                 id: displayModel.id,
                 selectedFeatureId: displayModel.selectedFeatureId,
             },
-            regions: JSON.parse(JSON.stringify(regions)),
+            regions: (0, clone_1.default)(regions),
         };
         return super.serializeArgsInClient(serializedArgs);
     }
@@ -37,11 +38,7 @@ class FeatureRendererType extends ServerSideRendererType_1.default {
      * @param args - the arguments passed to render
      */
     deserializeResultsInClient(result, args) {
-        const deserializedFeatures = new Map();
-        result.features.forEach(j => {
-            const f = simpleFeature_1.default.fromJSON(j);
-            deserializedFeatures.set(String(f.id()), f);
-        });
+        const deserializedFeatures = new Map(result.features.map(f => simpleFeature_1.default.fromJSON(f)).map(f => [f.id(), f]));
         const deserialized = super.deserializeResultsInClient({
             ...result,
             features: deserializedFeatures,
@@ -83,8 +80,9 @@ class FeatureRendererType extends ServerSideRendererType_1.default {
      * @returns Map of features as `{ id => feature, ... }`
      */
     async getFeatures(renderArgs) {
+        const pm = this.pluginManager;
         const { signal, regions, sessionId, adapterConfig } = renderArgs;
-        const { dataAdapter } = await (0, dataAdapterCache_1.getAdapter)(this.pluginManager, sessionId, adapterConfig);
+        const { dataAdapter } = await (0, dataAdapterCache_1.getAdapter)(pm, sessionId, adapterConfig);
         if (!(0, BaseAdapter_1.isFeatureAdapter)(dataAdapter)) {
             throw new Error('Adapter does not support retrieving features');
         }
@@ -92,9 +90,9 @@ class FeatureRendererType extends ServerSideRendererType_1.default {
         if (!regions || regions.length === 0) {
             return features;
         }
+        // make sure the requested region's start and end are integers, if
+        // there is a region specification.
         const requestRegions = regions.map((r) => {
-            // make sure the requested region's start and end are integers, if
-            // there is a region specification.
             const requestRegion = { ...r };
             if (requestRegion.start) {
                 requestRegion.start = Math.floor(requestRegion.start);

package/pluggableElementTypes/renderers/RendererType.d.ts

@@ -16,6 +16,7 @@ export default class RendererType extends PluggableElementBase {
     constructor(stuff: {
         name: string;
         ReactComponent: AnyReactComponentType;
+        displayName?: string;
         configSchema: AnyConfigurationSchemaType;
         pluginManager: PluginManager;
     });

package/pluggableElementTypes/renderers/RpcRenderedSvgGroup.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { AnyReactComponentType, Feature } from '../../util';
+declare const _default: (props: {
+    html: string;
+    features: Map<string, Feature>;
+    RenderingComponent: AnyReactComponentType;
+}) => JSX.Element;
+export default _default;

package/pluggableElementTypes/renderers/RpcRenderedSvgGroup.js

@@ -0,0 +1,60 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const mobx_react_1 = require("mobx-react");
+const react_dom_1 = require("react-dom");
+const util_1 = require("../../util");
+exports.default = (0, mobx_react_1.observer)(function (props) {
+    const { html, RenderingComponent } = props;
+    const ref = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const domNode = ref.current;
+        function doHydrate() {
+            if (domNode && html) {
+                if (domNode.innerHTML) {
+                    (0, react_dom_1.unmountComponentAtNode)(domNode);
+                }
+                // setting outline:none fixes react "focusable" element issue. see
+                // https://github.com/GMOD/jbrowse-components/issues/2160
+                domNode.style.outline = 'none';
+                domNode.innerHTML = html;
+                // use requestIdleCallback to defer main-thread rendering
+                // and hydration for when we have some free time. helps
+                // keep the framerate up.
+                (0, util_1.rIC)(() => {
+                    (0, react_dom_1.hydrate)(react_1.default.createElement(RenderingComponent, { ...props }), domNode);
+                });
+            }
+        }
+        doHydrate();
+        return () => {
+            if (domNode) {
+                (0, react_dom_1.unmountComponentAtNode)(domNode);
+            }
+        };
+    }, [html, RenderingComponent, props]);
+    return react_1.default.createElement("g", { ref: ref });
+});

package/pluggableElementTypes/renderers/ServerSideRenderedContent.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ResultsSerialized, RenderArgs } from './ServerSideRendererType';
-interface ServerSideRenderedContentProps extends ResultsSerialized, RenderArgs {
+interface Props extends ResultsSerialized, RenderArgs {
     RenderingComponent: React.ComponentType<any>;
 }
-export default function ServerSideRenderedContent(props: ServerSideRenderedContentProps): JSX.Element;
+export default function ({ theme, html, RenderingComponent, ...rest }: Props): JSX.Element;
 export {};

package/pluggableElementTypes/renderers/ServerSideRenderedContent.js

@@ -26,14 +26,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const styles_1 = require("@mui/material/styles");
 const react_dom_1 = require("react-dom");
+// locals
 const ui_1 = require("../../ui");
 const util_1 = require("../../util");
-function ServerSideRenderedContent(props) {
-    const ssrContainerNode = (0, react_1.useRef)(null);
-    const { theme, html, RenderingComponent, ...rest } = props;
+function default_1({ theme, html, RenderingComponent, ...rest }) {
+    const ref = (0, react_1.useRef)(null);
     const jbrowseTheme = (0, ui_1.createJBrowseTheme)(theme);
     (0, react_1.useEffect)(() => {
-        const domNode = ssrContainerNode.current;
+        const domNode = ref.current;
         function doHydrate() {
             if (domNode) {
                 if (domNode) {
@@ -60,6 +60,6 @@ function ServerSideRenderedContent(props) {
             }
         };
     }, [html, jbrowseTheme, rest, RenderingComponent]);
-    return (react_1.default.createElement("div", { ref: ssrContainerNode, "data-html-size": html.length, className: "ssr-container" }));
+    return react_1.default.createElement("div", { ref: ref });
 }
-exports.default = ServerSideRenderedContent;
+exports.default = default_1;

package/pluggableElementTypes/renderers/ServerSideRendererType.d.ts

@@ -1,13 +1,13 @@
-import { DeprecatedThemeOptions } from '@mui/material';
+import { ThemeOptions } from '@mui/material';
 import { SnapshotOrInstance, SnapshotIn } from 'mobx-state-tree';
-import RendererType, { RenderProps, RenderResults } from './RendererType';
 import SerializableFilterChain, { SerializedFilterChain } from './util/serializableFilterChain';
 import { AnyConfigurationModel } from '../../configuration/configurationSchema';
 import RpcManager from '../../rpc/RpcManager';
+import RendererType, { RenderProps, RenderResults } from './RendererType';
 interface BaseRenderArgs extends RenderProps {
     sessionId: string;
     signal?: AbortSignal;
-    theme: DeprecatedThemeOptions;
+    theme: ThemeOptions;
     exportSVG: {
         rasterizeLayers?: boolean;
     };
@@ -53,7 +53,7 @@ export default class ServerSideRenderer extends RendererType {
      * @param results - the results of the render
      * @param args - the arguments passed to render
      */
-    deserializeResultsInClient(results: ResultsSerialized, args: RenderArgs): ResultsDeserialized;
+    deserializeResultsInClient(res: ResultsSerialized, args: RenderArgs): ResultsDeserialized;
     /**
      * modifies the passed arguments object to inflate arguments as necessary.
      * called in the worker process.
@@ -74,7 +74,7 @@ export default class ServerSideRenderer extends RendererType {
      * Render method called on the client. Serializes args, then calls
      * "CoreRender" with the RPC manager.
      *
-     * @param rpcManager - RPC mananger
+     * @param rpcManager - RPC manager
      * @param args - render args
      */
     renderInClient(rpcManager: RpcManager, args: RenderArgs): Promise<ResultsSerialized>;

package/pluggableElementTypes/renderers/ServerSideRendererType.js

@@ -31,13 +31,14 @@ const styles_1 = require("@mui/material/styles");
 const canvas_sequencer_1 = require("canvas-sequencer");
 const server_1 = require("react-dom/server");
 const mobx_state_tree_1 = require("mobx-state-tree");
+// locals
 const util_1 = require("../../util");
-const RendererType_1 = __importDefault(require("./RendererType"));
 const serializableFilterChain_1 = __importDefault(require("./util/serializableFilterChain"));
 const ui_1 = require("../../ui");
+const RendererType_1 = __importDefault(require("./RendererType"));
 const ServerSideRenderedContent_1 = __importDefault(require("./ServerSideRenderedContent"));
-function isSvgExport(elt) {
-    return 'canvasRecordedData' in elt;
+function isSvgExport(e) {
+    return 'canvasRecordedData' in e;
 }
 class ServerSideRenderer extends RendererType_1.default {
     /**
@@ -48,12 +49,13 @@ class ServerSideRenderer extends RendererType_1.default {
      * @returns the same object
      */
     serializeArgsInClient(args) {
+        var _a;
         return {
             ...args,
             config: (0, mobx_state_tree_1.isStateTreeNode)(args.config)
                 ? (0, mobx_state_tree_1.getSnapshot)(args.config)
                 : args.config,
-            filters: args.filters && args.filters.toJSON().filters,
+            filters: (_a = args.filters) === null || _a === void 0 ? void 0 : _a.toJSON().filters,
         };
     }
     /**
@@ -64,24 +66,23 @@ class ServerSideRenderer extends RendererType_1.default {
      * @param results - the results of the render
      * @param args - the arguments passed to render
      */
-    deserializeResultsInClient(results, args) {
-        const { html, ...rest } = results;
+    deserializeResultsInClient(res, args) {
         // if we are rendering svg, we skip hydration
         if (args.exportSVG) {
-            // only return the results if the renderer explicitly has
+            // only return the res if the renderer explicitly has
             // this.supportsSVG support to avoid garbage being rendered in SVG
             // document
             return {
-                ...results,
+                ...res,
                 html: this.supportsSVG
-                    ? results.html
+                    ? res.html
                     : '<text y="12" fill="black">SVG export not supported for this track</text>',
             };
         }
-        // hydrate results using ServerSideRenderedContent
+        // hydrate res using ServerSideRenderedContent
         return {
-            ...rest,
-            reactElement: (react_1.default.createElement(ServerSideRenderedContent_1.default, { ...args, ...results, RenderingComponent: this.ReactComponent })),
+            ...res,
+            reactElement: (react_1.default.createElement(ServerSideRenderedContent_1.default, { ...args, ...res, RenderingComponent: this.ReactComponent })),
         };
     }
     /**
@@ -117,7 +118,7 @@ class ServerSideRenderer extends RendererType_1.default {
      * Render method called on the client. Serializes args, then calls
      * "CoreRender" with the RPC manager.
      *
-     * @param rpcManager - RPC mananger
+     * @param rpcManager - RPC manager
      * @param args - render args
      */
     async renderInClient(rpcManager, args) {

package/rpc/BaseRpcDriver.d.ts

@@ -15,7 +15,7 @@ export interface WorkerHandle {
 export interface RpcDriverConstructorArgs {
     config: AnyConfigurationModel;
 }
-export declare function watchWorker(worker: WorkerHandle, pingTime: number, rpcDriverClassName: string): Promise<unknown>;
+export declare function watchWorker(worker: WorkerHandle, pingTime: number, rpcDriverClassName: string): Promise<void>;
 declare class LazyWorker {
     driver: BaseRpcDriver;
     workerP?: Promise<WorkerHandle> | undefined;

package/rpc/BaseRpcDriver.js

@@ -18,23 +18,13 @@ function isClonable(thing) {
 // the worker times out
 async function watchWorker(worker, pingTime, rpcDriverClassName) {
     // after first ping succeeds, apply wait for timeout
-    return new Promise((_resolve, reject) => {
-        function delay() {
-            setTimeout(async () => {
-                try {
-                    await worker.call('ping', [], {
-                        timeout: pingTime * 2,
-                        rpcDriverClassName,
-                    });
-                    delay();
-                }
-                catch (e) {
-                    reject(e);
-                }
-            }, pingTime);
-        }
-        delay();
-    });
+    while (true) {
+        await worker.call('ping', [], {
+            timeout: pingTime * 2,
+            rpcDriverClassName,
+        });
+        await new Promise(resolve => setTimeout(resolve, pingTime));
+    }
 }
 exports.watchWorker = watchWorker;
 function detectHardwareConcurrency() {
@@ -110,7 +100,7 @@ class BaseRpcDriver {
     }
     async remoteAbort(sessionId, functionName, signalId) {
         const worker = await this.getWorker(sessionId);
-        worker.call(functionName, { signalId }, { timeout: 1000000, rpcDriverClassName: this.name });
+        await worker.call(functionName, { signalId }, { timeout: 1000000, rpcDriverClassName: this.name });
     }
     createWorkerPool() {
         const hardwareConcurrency = detectHardwareConcurrency();

package/rpc/coreRpcMethods.d.ts

@@ -1,99 +1,11 @@
-import RpcMethodType from '../pluggableElementTypes/RpcMethodType';
-import { RenderArgs as ServerSideRenderArgs, RenderArgsSerialized as ServerSideRenderArgsSerialized, RenderResults, ResultsSerialized } from '../pluggableElementTypes/renderers/ServerSideRendererType';
-import { RemoteAbortSignal } from './remoteAbortSignals';
-import { Region } from '../util';
-import SimpleFeature, { SimpleFeatureSerialized } from '../util/simpleFeature';
-export declare class CoreGetRefNames extends RpcMethodType {
-    name: string;
-    execute(args: {
-        sessionId: string;
-        signal: RemoteAbortSignal;
-        adapterConfig: {};
-    }, rpcDriver: string): Promise<string[]>;
-}
-export declare class CoreGetFileInfo extends RpcMethodType {
-    name: string;
-    execute(args: {
-        sessionId: string;
-        signal: RemoteAbortSignal;
-        adapterConfig: {};
-    }, rpcDriver: string): Promise<unknown>;
-}
-export declare class CoreGetMetadata extends RpcMethodType {
-    name: string;
-    execute(args: {
-        sessionId: string;
-        signal: RemoteAbortSignal;
-        adapterConfig: {};
-    }, rpcDriver: string): Promise<unknown>;
-}
-export declare class CoreGetFeatures extends RpcMethodType {
-    name: string;
-    deserializeReturn(feats: SimpleFeatureSerialized[], args: unknown, rpcDriver: string): Promise<SimpleFeature[]>;
-    serializeArguments(args: RenderArgs, rpcDriver: string): Promise<RenderArgs>;
-    execute(args: {
-        sessionId: string;
-        regions: Region[];
-        adapterConfig: {};
-        signal?: RemoteAbortSignal;
-        opts?: any;
-    }, rpcDriver: string): Promise<SimpleFeatureSerialized[]>;
-}
-/**
- * free up any resources (e.g. cached adapter objects)
- * that are only associated with the given track ID.
- *
- * returns number of objects deleted
- */
-export declare class CoreFreeResources extends RpcMethodType {
-    name: string;
-    execute(specification: {}): Promise<number>;
-    serializeArguments(args: {}, _rpcDriver: string): Promise<{}>;
-}
-export interface RenderArgs extends ServerSideRenderArgs {
-    adapterConfig: {};
-    rendererType: string;
-}
-export interface RenderArgsSerialized extends ServerSideRenderArgsSerialized {
-    assemblyName: string;
-    regions: Region[];
-    adapterConfig: {};
-    rendererType: string;
-}
-export declare class CoreEstimateRegionStats extends RpcMethodType {
-    name: string;
-    serializeArguments(args: RenderArgs & {
-        signal?: AbortSignal;
-        statusCallback?: (arg: string) => void;
-    }, rpcDriver: string): Promise<{}>;
-    execute(args: {
-        adapterConfig: {};
-        regions: Region[];
-        signal?: RemoteAbortSignal;
-        headers?: Record<string, string>;
-        sessionId: string;
-    }, rpcDriver: string): Promise<import("../data_adapters/BaseAdapter").Stats>;
-}
-/**
- * fetches features from an adapter and call a renderer with them
- */
-export declare class CoreRender extends RpcMethodType {
-    name: string;
-    serializeArguments(args: RenderArgs, rpcDriver: string): Promise<ServerSideRenderArgsSerialized | RenderArgs>;
-    execute(args: RenderArgsSerialized & {
-        signal?: RemoteAbortSignal;
-    }, rpcDriver: string): Promise<ResultsSerialized | RenderResults>;
-    deserializeReturn(serializedReturn: RenderResults | ResultsSerialized, args: RenderArgs, rpcDriver: string): Promise<unknown>;
-}
-/**
- * fetches features from an adapter and call a renderer with them
- */
-export declare class CoreGetFeatureDetails extends RpcMethodType {
-    name: string;
-    serializeArguments(args: RenderArgs, rpcDriver: string): Promise<ServerSideRenderArgsSerialized | RenderArgs>;
-    execute(args: RenderArgsSerialized & {
-        signal?: RemoteAbortSignal;
-    }, rpcDriver: string): Promise<{
-        feature: any;
-    }>;
-}
+import CoreGetRefNames from './methods/CoreGetRefNames';
+import CoreGetMetadata from './methods/CoreGetMetadata';
+import CoreGetFeatureDetails from './methods/CoreGetFeatureDetails';
+import CoreGetFeatures from './methods/CoreGetFeatures';
+import CoreGetFileInfo from './methods/CoreGetFileInfo';
+import CoreFreeResources from './methods/CoreFreeResources';
+import CoreRender from './methods/CoreRender';
+import CoreEstimateRegionStats from './methods/CoreEstimateRegionStats';
+import { RenderArgs } from './methods/util';
+export type { RenderArgs };
+export { CoreGetRefNames, CoreGetFileInfo, CoreGetMetadata, CoreGetFeatures, CoreRender, CoreGetFeatureDetails, CoreFreeResources, CoreEstimateRegionStats, };