Update build system for external plugins

packages/core/PluginLoader.ts

@@ -65,11 +65,17 @@ export default class PluginLoader {
       await this.loadScript(definition.url)
       const moduleName = definition.name
       const umdName = `JBrowsePlugin${moduleName}`
+      // Based on window-or-global
+      // https://github.com/purposeindustries/window-or-global/blob/322abc71de0010c9e5d9d0729df40959e1ef8775/lib/index.js
+      const scope =
+        (typeof self === 'object' && self.self === self && self) ||
+        (typeof global === 'object' && global.global === global && global) ||
+        this
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const plugin = (window as any)[umdName] as { default: PluginConstructor }
+      const plugin = (scope as any)[umdName] as { default: PluginConstructor }
       if (!plugin)
         throw new Error(
-          `plugin ${moduleName} failed to load, window.${umdName} is undefined`,
+          `plugin ${moduleName} failed to load, ${scope.constructor.name}.${umdName} is undefined`,
         )
 
       return plugin.default

packages/core/ReExports/list.ts

@@ -7,6 +7,7 @@ export default [
   'prop-types',
 
   '@material-ui/core',
+  '@material-ui/core/styles',
   '@material-ui/lab',
 
   '@jbrowse/core/Plugin',
@@ -29,6 +30,7 @@ export default [
   '@jbrowse/core/util/Base1DViewModel',
   '@jbrowse/core/util/io',
   '@jbrowse/core/util/mst-reflection',
+  '@jbrowse/core/util/rxjs',
   '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail',
 
   '@jbrowse/core/data_adapters/BaseAdapter',

packages/core/ReExports/modules.ts

@@ -10,6 +10,7 @@ import * as MUIStyles from '@material-ui/core/styles'
 
 // @material-ui components
 import * as MUICore from '@material-ui/core'
+import MUISvgIcon from '@material-ui/core/SvgIcon'
 import * as MUILab from '@material-ui/lab'
 import MUIBox from '@material-ui/core/Box'
 import MUIButton from '@material-ui/core/Button'
@@ -69,6 +70,7 @@ import * as coreColor from '../util/color'
 import * as trackUtils from '../util/tracks'
 import * as coreIo from '../util/io'
 import * as coreMstReflection from '../util/mst-reflection'
+import * as rxjs from '../util/rxjs'
 import * as MUIColors from './material-ui-colors'
 import * as mstTypes from '../util/types/mst'
 
@@ -84,6 +86,8 @@ const libs = {
 
   // material-ui 1st-level components
   '@material-ui/core': MUICore,
+  // special case so plugins can easily use @material-ui/icons; don't remove
+  '@material-ui/core/SvgIcon': MUISvgIcon,
   '@material-ui/lab': MUILab,
 
   // material-ui subcomponents, should get rid of these
@@ -143,6 +147,7 @@ const libs = {
   '@jbrowse/core/util/Base1DViewModel': Base1DView,
   '@jbrowse/core/util/io': coreIo,
   '@jbrowse/core/util/mst-reflection': coreMstReflection,
+  '@jbrowse/core/util/rxjs': rxjs,
   '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail': BaseFeatureDetail,
 
   '@jbrowse/core/data_adapters/BaseAdapter': BaseAdapterExports,

packages/development-tools/index.js

@@ -0,0 +1,28 @@
+function createJBrowsePluginTsdxConfig(config, options, globals) {
+  if (options.format === 'umd') {
+    // If it's an external package in node_modules and is not in JBrowse's
+    // list of re-exported packages, bundle it in the UMD build.
+    const originalExternal = config.external
+    config.external = (...args) => {
+      const isExternal = originalExternal(...args)
+      if (isExternal) {
+        const id = args[0]
+        if (!globals.includes(id)) {
+          try {
+            require.resolve(id)
+            return false
+            // eslint-disable-next-line no-empty
+          } catch {}
+        }
+      }
+      return isExternal
+    }
+    // Let rollup know the global name of each JBrowse re-exported package
+    globals.forEach(global => {
+      config.output.globals[global] = `JBrowseExports.${global}`
+    })
+  }
+  return config
+}
+
+exports.createJBrowsePluginTsdxConfig = createJBrowsePluginTsdxConfig

packages/development-tools/package.json

@@ -15,37 +15,25 @@
     "directory": "packages/development-tools"
   },
   "author": "JBrowse Team",
-  "main": "dist/index.js",
+  "main": "index.js",
   "files": [
-    "dist"
+    "patches/",
+    "postinstall.js"
   ],
-  "scripts": {
-    "test": "jest",
-    "coverage": "npm test -- --coverage",
-    "lint": "tsc --noEmit && eslint --ext .js,.ts,.jsx,.tsx src",
-    "clean": "rimraf dist",
-    "prebuild": "npm run clean",
-    "build": "babel src --out-dir dist --extensions '.ts,.js'",
-    "version": "standard-changelog && git add CHANGELOG.md",
-    "prepare": "npm run build",
-    "postpublish": "git push origin master --follow-tags"
+  "bin": {
+    "jbrowse-plugin-postinstall": "./postinstall.js"
   },
+  "engines": {
+    "node": ">=10"
+  },
+  "scripts": {},
   "dependencies": {
-    "@jbrowse/core": "^1.0.2",
-    "@types/copy-webpack-plugin": "^6.0.0",
-    "@types/webpack": "^4.41.18",
-    "change-case": "^4.1.1",
-    "copy-webpack-plugin": "^6.0.3",
-    "css-loader": "^3.6.0",
-    "postcss-flexbugs-fixes": "^4.2.1",
-    "postcss-loader": "^3.0.0",
-    "postcss-preset-env": "^6.7.0",
-    "sass": "^1.26.10",
-    "sass-loader": "^9.0.2",
-    "style-loader": "^1.2.1"
+    "cross-spawn": "^7.0.3",
+    "patch-package": "^6.2.2",
+    "tsdx": "0.14.0"
   },
   "peerDependencies": {
-    "webpack": "^4.42.0"
+    "@jbrowse/core": "^1.0.3"
   },
   "publishConfig": {
     "access": "public"

packages/development-tools/patches/tsdx+0.14.0.patch

@@ -0,0 +1,51 @@
+diff --git a/node_modules/tsdx/dist/createRollupConfig.js b/node_modules/tsdx/dist/createRollupConfig.js
+index d6d9378..75b8fe7 100644
+--- a/node_modules/tsdx/dist/createRollupConfig.js
++++ b/node_modules/tsdx/dist/createRollupConfig.js
+@@ -11,9 +11,15 @@ const plugin_replace_1 = tslib_1.__importDefault(require("@rollup/plugin-replace
+ const plugin_node_resolve_1 = tslib_1.__importStar(require("@rollup/plugin-node-resolve"));
+ const rollup_plugin_sourcemaps_1 = tslib_1.__importDefault(require("rollup-plugin-sourcemaps"));
+ const rollup_plugin_typescript2_1 = tslib_1.__importDefault(require("rollup-plugin-typescript2"));
++const fs = tslib_1.__importStar(require("fs-extra"));
+ const typescript_1 = tslib_1.__importDefault(require("typescript"));
+ const extractErrors_1 = require("./errors/extractErrors");
+ const babelPluginTsdx_1 = require("./babelPluginTsdx");
++let appPackageJson;
++try {
++    appPackageJson = fs.readJSONSync(constants_1.paths.appPackageJson);
++}
++catch (e) { }
+ const errorCodeOpts = {
+     errorMapFilePath: constants_1.paths.appErrorsJson,
+ };
+@@ -24,7 +30,7 @@ async function createRollupConfig(opts, outputNum) {
+     const findAndRecordErrorCodes = await extractErrors_1.extractErrors(Object.assign(Object.assign({}, errorCodeOpts), opts));
+     const shouldMinify = opts.minify !== undefined ? opts.minify : opts.env === 'production';
+     const outputName = [
+-        `${constants_1.paths.appDist}/${utils_1.safePackageName(opts.name)}`,
++        `${constants_1.paths.appDist}/${utils_1.safePackageName(appPackageJson.name)}`,
+         opts.format,
+         opts.env,
+         shouldMinify ? 'min' : '',
+diff --git a/node_modules/tsdx/dist/index.js b/node_modules/tsdx/dist/index.js
+index d2322e5..a7278fa 100755
+--- a/node_modules/tsdx/dist/index.js
++++ b/node_modules/tsdx/dist/index.js
+@@ -214,7 +214,7 @@ prog
+         await cleanDistFolder();
+     }
+     if (opts.format.includes('cjs')) {
+-        await writeCjsEntryFile(opts.name);
++        await writeCjsEntryFile(appPackageJson.name);
+     }
+     let firstTime = true;
+     let successKiller = null;
+@@ -295,7 +295,7 @@ prog
+     await cleanDistFolder();
+     const logger = await createProgressEstimator_1.createProgressEstimator();
+     if (opts.format.includes('cjs')) {
+-        const promise = writeCjsEntryFile(opts.name).catch(logError_1.default);
++        const promise = writeCjsEntryFile(appPackageJson.name).catch(logError_1.default);
+         logger(promise, 'Creating entry file');
+     }
+     try {

packages/development-tools/postinstall.js

@@ -0,0 +1,22 @@
+#!/usr/bin/env node
+
+const spawn = require('cross-spawn')
+const path = require('path')
+
+function main() {
+  const devTools = require.resolve('@jbrowse/development-tools')
+  const patchPackage = require.resolve('patch-package')
+  const patchDir = path.relative(
+    '',
+    path.join(path.dirname(devTools), 'patches/'),
+  )
+  const { signal, status } = spawn.sync(
+    'node',
+    [patchPackage, '--patch-dir', patchDir],
+    { stdio: 'inherit' },
+  )
+  if (signal || (status !== null && status > 0)) {
+    process.exit(status || 1)
+  }
+}
+main()