Skip to content

v11.2.0 — Improvements for plugins developers

Choose a tag to compare

View all tags
@shadowusr shadowusr released this 08 Oct 09:30
· 20 commits to master since this release
v11.2.0
dd945d5

🚀 Features

Plugins SDK

More dependencies are now available for use in reporter plugins — including @gravity-ui/uikit and all-new repoter plugins SDK.

what you can do with Plugins SDK

On Node side, you may import typings and constants (with more to come in the future).

Right now, you may import a enum, containing all possible extension point names (places where you can embed your plugin):

// Useful for exporting ready-to-use plugin presets
import {ExtensionPointName} from 'html-reporter/plugins-sdk';

export = {
    name: "my-plugin/ui",
    component: "Plugin",
    point: ExtensionPointName.SettingsPanel,
    position: "after",
};

Another thing you can do with Plugins SDK is to import plugin options type, which looks like this:

interface PluginOptions {
    pluginServerEndpointPrefix: string;
}

You can use it in your plugin UI to determine the correct endpoint where your plugin server side is exposing endpoints, like this:

// pluginOptions are injected in your UI by html-reporter
// @see https://github.com/gemini-testing/html-reporter/blob/b100027bb165377789fcbaa05954c6127788ddc7/lib/static/modules/load-plugin.js#L105

const endpoint = pluginOptions.pluginServerEndpointPrefix.replace(/\/$/, "") + "/items";

const responseFromPluginBackend = await fetch(endpoint);

There's also ready-to-use UI components in Plugins SDK that match HTML Reporter visuals perfectly.

For now, there's PanelSection component that lets you build additional settings that looks like this:

Screenshot 2025-10-08 at 12 23 48

And may be used like this:

import {} from 'html-reporter/plugins-sdk/ui';

export function Plugin() {
  return <PanelSection title='My Plugin Settings' description={'Change plugin settings in this section'}>
    {/* You may use any controls, like Select or TextInput here */}
  </PanelSection>;
}

You may learn more about what's available on UI side here: https://github.com/gemini-testing/html-reporter/blob/b100027bb165377789fcbaa05954c6127788ddc7/lib/static/modules/plugins-sdk-ui.ts.

Besides components, redux store typings and Feature types are exported. Important note: only typings are actually exported from the html-reporter/plugins-sdk/ui, not components themselves. The components themselves are injected here and should be supplied by your bundler.

Stay tuned for additional docs on how to build plugins for HTML Reporter ✨

Assets 2
Loading