Experimental Features

Experimental Features Suite

Feature Flags

Experimental feature flags can be added using the pmc-gutenberg/src/config/experimental-features.json config.

{
	"pmc_gutenberg_theme_json": {
		"label": "Experimental theme.json",
		"description": "This enables features for blocks defined by theme.json."
	}
}

Follows the convention of "flag key" and object containing an "label" (required) and optional "description".

Once added the flag will be visible at on the wp-admin/options-general.php?page=pmc_gutenberg_options options page located at Settings > Gutenberg Options in the WordPress admin. By default, all flags are opt-in.

PHP Handling

In PHP the PMC\Gutenberg\Experimental_Features\Options::flag_enabled method can be used which accepts a single parameter, the feature flag "key".

JS Handling

Similarly, there are two methods for use by JS and React features that are located in the pmc-gutenberg/src/hooks/use-experimental-features directory.

useFlagEnabled which accepts a flag "key" as a param. React hook.
flagEnabled which also accepts a flag "key" as a param. Use in static js features.

Both the function and hook look at the window.pmc_gutenberg_config_script.pmc_gutenberg_experimental_features window object and will return the boolean value for whether or not the feature is enabled.

Brand Config

All brand configurations are located in the same brand folders src/config/brands as the config.json. The file defines all of the supported blocks, filters, sidebars, navbars, and pluginSidebars supported by the brand. This is a JSON configuration that used to be defined at the brand level described here. The same configuration format applies.

Experimental Features

Class for registering and enabling the Experimental Feature flags.

get_features_json

Get the features json from the config directory.

get_feature_flags

Get settings feature flag fields.

Filters

pmc_gutenberg_features_flags

Filters the available feature flags.

$flags: array — Available feature flags.

get_feature_flags_status

Get the slug/status of each of the feature flags.

localize_feature_flag_config

Localize script for accessing our feature flag status in the block editor.

$config: array — config script for gutenberg.

enqueue_experimental_css

Enqueue inline styles in the head, if the feature supports it.

Heartbeat

Initialize custom heartbeat features.

modify_heartbeat_settings

Modify the frequency of the heartbeat.

$settings: array — array of heartbeat api settings.

modify_post_lock_window_check

Modify the interval in which we check for a post lock.

Options

Class for creating the Gutenberg options menu and related helper methods.

register_admin_menu

Registers a new settings page under Settings.

register_settings_page

Settings page display callback.

flag_enabled

Determine whether or not option is enabled.

$slug: string — slug for the option.

has_flag

Check if feature flag has value.

$slug: string — Slug for feature flag.

enable_flag

Enable the status of a feature flag.

$slug: string — Slug for flag to enable.

disable_flag

Disable the status of a feature flag.

$slug: string — Slug for flag to disable.

register_settings_fields

render_checkbox

Render the custom checkbox field.

$args: array — array of args.

sanitize_flags

Sanitizes an array of feature flags.

$option_value: ?array — The array of feature flag slugs to sanitize.

Editor Interfaces