This is example plugin for plugin development. You can find this file from plugin-api/dev/plugins/dev-plugin/index.html. You can try making changes to this file and clicking R in Cypress UI to see how plugin updates (To open Cypress UI for plugin development, run npm run dev:plugin or yarn dev:plugin in project root).

Plugin contains at least one html file and manifest.json. HTML file contains everything plugin needs to render and manifest file contains configurations for the plugin. In development tooling basic information is mocked in test file instead.

We are using Cypress testing tool as our development environment for plugins. Cypress provides easy way to setup only small part of application and mock requests. This plugin is setup in file plugin-api/dev/index.plugin-dev.tsx. You can use this file, or make a new one like plugin-api/dev/brand-new-plugin.plugin-dev.tsx, to develop your plugins. You could also use this tooling to test your plugin if needed.

plugin-api/dev/index.plugin-dev.tsx file also defines all the mock data.

Recommended workflow

  1. Create new folder to plugin-api/dev/plugins and initialise it as repository to your version control.
  2. Add index.html and manifest.json
  3. Change PLUGIN_DEFINITIONS[0].name from plugin-api/dev/index.plugin-dev.tsx to be your folder name.
  4. Develop your plugin to index.html
  5. Plugin that are ready for real use are installed to Metaflow Metadata service. Head to Metadata service documentation for deployment instructions. Remember to provide MetaflowPluginAPI.js to your plugin.

Here is some elements created after getting data from main application: