search

GMOD / jbrowse-components

Source code for JBrowse 2, a modern React-based genome browser
https://jbrowse.org/jb2
Apache License 2.0
208 stars 62 forks source link

Create sample non-core build-time plugin #27

Closed garrettjstevens closed 5 years ago

garrettjstevens commented 5 years ago

All the plugins developed so far have been core plugins, so I decided to create and test a simple non-core menu bar for testing before I create the core Main Menu Bar.

I also added a Yeoman generator to generate this testing menu bar. It's working now in 9022ca02255c7fb0f8763cb8dcbdd5ee419f27af if you follow these steps:

  1. cd into the jbrowse-web plugins dir
  2. run yo jbrowse and follow the prompts image
  3. add a few lines to the main index.js 
    ...
import HelloWorldMenuBar from './plugins/HelloWorldMenuBar'
...
jbrowse.pluginManager.addPlugin(new HelloWorldMenuBar())
...
model.addMenuBar('HelloWorldMenuBar')
...
  4. yarn start image

It would be good to have an integration test that basically does what I showed in the steps above.

rbuels commented 5 years ago

holy cow that's fantastic!

integration testing wise, would you be able to use native react testing, or do you think you would need to do nightwatch (ugh)

On Mon, Dec 3, 2018 at 5:56 PM Garrett Stevens notifications@github.com wrote:

All the plugins developed so far have been core plugins, so I decided to create and test a simple non-core menu bar for testing before I create the core Main Menu Bar.

I also added a Yeoman generator to generate this testing menu bar. It's working now in 9022ca0 https://github.com/GMOD/jbrowse-components/commit/9022ca02255c7fb0f8763cb8dcbdd5ee419f27af if you follow these steps:

  1. cd into the jbrowse-web plugins dir
  2. run yo jbrowse and follow the prompts [image: image] https://user-images.githubusercontent.com/25592344/49412983-705c5d80-f73c-11e8-99c3-a60292115fc7.png
  3. add a few lines to the main index.js

...import HelloWorldMenuBar from './plugins/HelloWorldMenuBar'...jbrowse.pluginManager.addPlugin(new HelloWorldMenuBar())...model.addMenuBar('HelloWorldMenuBar')...

  1. yarn start [image: image] https://user-images.githubusercontent.com/25592344/49413322-83bbf880-f73d-11e8-992a-a12e36e3b9ba.png

It would be good to have an integration test that basically does what I showed in the steps above.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/GMOD/jbrowse-components/issues/27, or mute the thread https://github.com/notifications/unsubscribe-auth/AAEgFdLzQ6hNuexylGX9saQdgAsjrJ8aks5u1dZggaJpZM4Y_w6O .

garrettjstevens commented 5 years ago

I think we should be fine with Jest and React. It looks like what other monorepos have done is move Jest up to the monorepo root and then put the integration/end-to-end tests there. Then you can configure the root Jest to also run in the separate packages. This would make adding new packages a lot easier, too.

I also came across Yarn workspaces while working on this. Basically the node_modules and yarn.lock exist only in the monorepo root so that all the packages can share dependencies and reduce size. It also links the packages to each other so if you import one, it imports the current version and not the NPM released version.

I'm currently working out how hard it will be to move over to that system.

garrettjstevens commented 5 years ago

I've got a second template now in https://github.com/GMOD/jbrowse-components/pull/40 that will generate a plugin with two pluggable elements: an app bar and a drawer widget. The app bar has a button that opens the drawer widget. Works the same as above.

garrettjstevens commented 5 years ago

Both templates are now in master, so closing this. There's an idea for a better integration test in df834ae01ed49f10e4a8cc15c9e1718749d49ebb, but won't implement now since the plugin architecture is still evolving.