Skip to main content
↓ Download as Markdown

Plugin manifest

The plugin manifest describes metadata about a plugin. The manifest is used:

  • By Future Ordering "Frontend Plugin Configurator" Navigator-app to display information about the plugin and to display configurable parameters
  • By build script to generate javascript file names which include version

Each plugin must have a manifest file. Create a file named manifest.json that should contain the following properties:

  • version: Example: "1.0.0"
  • esm: Default: true. Use ES-module style plugins, se to true for modern browsers. See Plugins in old browser for more info.
  • description: Description of the plugin.
  • parameters: Description of parameters in the configuration. Each parameter is rendered as inputs to be easily entered when configuring the plugin. See section below for more info.
  • defaultConfig: Object describing default plugin config. These values are predefined in the Plugin Configurator when activating a plugin. Available values are:
    • allowedDataUrls (string array): Default value. Describes URLs that the plugin is allowed to load data from. These URLs are added to content sources in Content Security Policy. For more information see CSP source values.
    • allowBlobs (boolean): Default value. Allows plugin use blobs. Enabling allowBlobs adds blob: to content sources in Content Security Policy.
    • allowUnsafeInline (boolean): Default value. Allows plugin to use inline scripts. Enabling allowUnsafeInline adds 'unsafe-inline' to Content Security Policy.
    • allowUnsafeEval (boolean): Default value. Allows plugin to use eval(). Enabling allowUnsafeEval adds 'unsafe-eval' to Content Security Policy.
    • appTrackingConsent (boolean): Default value. Requires user to allow app tracking in native app in order for plugin to be loaded.
    • channels (enum array): Default values. Requires channel to be one of defined values for plugin to be loaded. Valid values are foapp, mobile-browser, desktop-browser, kiosk.
    • consentLevels (enum array): Default values. Requires user to give consent to all content levels for plugin to be loaded. Valid values are: standard, preferences, statistics, marketing.
    • countryCodes (string array): Default countryCodes. Describes countries were plugin is loaded.
    • dependentOn (string array): Default values. Defines load order of plugins. Describes names of plugin that are loaded before this plugin.

Parameters​

An array of objects. Properties of each object:

  • name (string): Name of the parameter. It must match the property name in the plugin configuration on the context object.
  • friendlyName (string): Name of the parameter as displayed in the Plugin Configurator.
  • description (string, optional): Description of the parameter.
  • required (boolean): Indicates whether the parameter is required.
  • defaultValue(any): Predefined value in the Plugin Configurator.
  • schema (object): Describes the type of the parameter with the following properties:
    • type (string): Type of the parameter, which can be string, boolean, integer, array, object or record.
    • (... additional properties depending on type)

Parameters examples​

Examples of how different schemas will be displayed in the plugin configurator.

Displayed as a text input

{
    "schema": {
        "type": "string"
    }
}

Displayed as a checkbox

{
    "schema": {
        "type": "boolean",
    }
}

Displayed as a list of string values

{
    "schema": {
        "type": "array",
        "items": {
            "type": "string"
        }
    }
}

Displayed as select box (dropdown)

{
    "schema": {
        "type": "string",
        "enum": ["dev", "test", "prod"]
    }
}

Displayed as input textbox with json content

{
    "schema": {
        "type": "object",
        "properties": {
            "planId": {
                "type": "string"
            },
            "planVersion": {
                "type": "integer"
            }
        }
    }
}

Displayed as table, with default values

{
    "schema": {
        "type": "record",
        "keys": {
            "type": "string"
        },
        "values": {
            "type": "object",
            "properties": {
                "title": {
                    "type": "string"
                },
                "description": {
                    "type": "string"
                }
            }
        }
    },
    "defaultValue": {
        "en": {
            "title": "Points & Rewards",
            "description": "Gather points and earn rewards"
        },
        "sv": {
            "title": "Poäng & Erbjudanden",
            "loading": "Samla poäng of få erbjudanden"
        }
    }
}

See plugin translations example for an example of a complete plugin using translations.

Note: if schema not supported an input textbox is shown which expects json.

Example​

Example of plugin that utilized config parameters.

manifest.json

{
    "version": "1.0.0",
    "description": "Adds menu item 'Discounts' to popout navigation. Clicking it leads to framed page with discounts from Como",
    "esm": true,
    "parameters": [
        {
            "name": "env",
            "friendlyName": "Future Ordering Environment",
            "description": "The environment to target in future ordering. Use dev or test for testing. Prod for production. Default is prod.",
            "required": false,
            "schema": {
                "type": "string",
                "enum": ["dev", "test", "prod"]
            }
        },
        {
            "name": "enabledForUserIds",
            "friendlyName": "Enabled for user ids",
            "description": "Users IDs for which the feature is enabled",
            "required": false,
            "schema": {
                "type": "array",
                "items": {
                    "type": "string"
                }
            }
        }
    ]
}

myplugin.ts

type MyContext = PluginContext & {
    config: {
        env?: 'dev' | 'test' | 'prod';
        /**
         * If set, only users with these user IDs will see the plugin.
         */
        enabledForUserIds?: string[];
    };
};

export default async (context: MyContext) => {
    const env = context.config.env ?? 'test';
    const enabledForUserIds = context.config.enabledForUserIds ?? [];
   
   // plugin code
};

More examples​