Experiments: Rebuild the wp-admin Experiments screen on the wp-build routes pattern by t-hamano · Pull Request #77443 · WordPress/gutenberg

t-hamano · 2026-04-17T06:48:25Z

What?

Closes Update Experimental settings page to leverage wp-build + DataViews/Forms #77429
Alternatives to Update Experiments settings screen to use DataForms #70711

Rebuild the Experiments screen on top of the new wp-build routes pattern, replacing the PHP-based screen.

Why?

The number of screens using wp-build is increasing, including Guidelines, Fonts, Connectors, and AI. To keep pace with these developments, the Gutenberg experiment page should also be revamped.

How?

Expose the settings at /wp/v2/settings
Group each setting appropriately
Use toggles instead of checkboxes, similar to the AI settings screen
Add redirects from an old link

Testing Instructions

Toggle any experiment — a snackbar should appear with the group name (e.g. "Blocks settings updated.")
Visit the legacy URL wp-admin/admin.php?page=gutenberg-experiments — you should be redirected to ?page=experiments-wp-admin.

Screenshots or screencast

Recording.2026-04-17.160949.mp4

Use of AI Tools

This PR was authored with the help of Claude Code (Anthropic). Code, copy and PR description were reviewed by the author.

…tings screen

Co-authored-by: Daniel Richards <daniel.richards@automattic.com>

# Conflicts: # lib/experiments-page.php # packages/e2e-test-utils-playwright/src/request-utils/gutenberg-experiments.ts # packages/edit-site/src/index.js

…/gutenberg into feature/new-experiments-screen

…rl to be available

# Conflicts: # lib/experiments-page.php

…e notice

…-screen

Move the Experiments screen off the legacy `initializeExperiments()` bootstrap in `@wordpress/edit-site` and onto the `wp-build` routes pattern used by `connectors-home` and `font-list`, so it plugs into the same page/route registration pipeline as the other wp-admin screens. - Register a new `experiments` page in `wpPlugin.pages` and create `routes/experiments/` (route.ts + stage.tsx + style.scss + types.ts). - Extend the `gutenberg-experiments` setting schema with `title`, `description`, `group`, and `separate_option`/`option_name` per property, so the experiment metadata can be read from the existing `OPTIONS /wp/v2/settings` endpoint instead of being injected via inline script. - Replace `the_gutenberg_experiments()` with the auto-generated `gutenberg_experiments_wp_admin_render_page()` in the admin submenu. - Redirect the legacy `?page=gutenberg-experiments` URL to `?page=experiments-wp-admin` via a hidden submenu + `load-*` hooks, following the same pattern as `edit-site-routes-backwards-compat.php`. - Remove the now-unused experiments-app code from `@wordpress/edit-site`. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Relocate the experiments PHP bootstrap and rename the route package so both match the existing conventions used by connectors, fonts, and guidelines. - Move `lib/experiments-page.php` to `lib/experimental/experiments/load.php`, matching the `lib/experimental/{feature}/load.php` layout shared with `connectors`, `fonts`, and `guidelines`. - Rename `routes/experiments/` to `routes/experiments-home/` and the package to `@wordpress/experiments-home-route`, matching the `-home` naming used by `connectors-home` and `fonts-home` for the root route of a page. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Simplify the screen to only expose a Save action and surface its result via a snackbar notice, so users get immediate feedback on save success/failure consistent with how other wp-admin routes report save outcomes. - Drop the Reset to default button, ConfirmDialog, and related reset state. The feature was a rarely-needed escape hatch and complicated the UI. - Call `saveSettings({ throwOnError: true })` and dispatch `createSuccessNotice`/`createErrorNotice` from `@wordpress/notices` with `type: 'snackbar'` to report the outcome. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Rework the form so each category is a collapsible card and changes are persisted immediately, removing the Save step and its notice feedback. - Group each experiment category as a `layout: { type: 'card' }` entry with `isCollapsible` and `isOpened: true`, and switch the outer form to `layout: { type: 'card' }`, so users see each category as a collapsible section instead of a single flat list. - Change experiment fields from `Edit: 'checkbox'` to `Edit: 'toggle'`, which reads as an on/off control closer to how the settings behave. - Drop the Save button and the snackbar notice: `setSettings` now calls `saveSettings()` right after `edit()`, so toggling a switch persists the change immediately and the toggle state itself is sufficient feedback. Removes the `@wordpress/notices` dependency and related imports. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

…sible The card content wrapper uses `overflow: hidden` for the collapse animation, which clips the focus outline of a toggle flush at the top. Add a small padding-top on the first field inside each card so the focus ring renders within the visible area. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

ramonjd

This is great work @t-hamano thank you!

I tested with a few experiments and it's working as described.

I'd be inclined to say "let's ship it", but I'll let other folks weigh in.

…tion Registering an experiment in load.php only exposes it on the Experiments screen; enabling it in the editor requires a matching JS global bridge in editor-settings.php. Note this in the function docblock so future additions do not silently stop at step one. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

ramonjd

👍🏻 from me

t-hamano · 2026-04-21T02:33:28Z

I've vide-coded an approach to add an option to wp-build for specifying URL parameters, aiming to avoid a redundant URL redirect. It was a bit confusing because wp-build has both a full-page mode and a WP-Admin mode. #77508

I'm not sure whether we need to move that PR forward 🤔

# Conflicts: # lib/experiments-page.php # package.json

The new `gutenberg-content-types` experiment was merged from trunk with a verb-prefixed, colon-style label that did not match the noun-only style used by the other entries in the Other group (Color randomizer, Workflow Palette, Extensible Site Editor, Guidelines). Drop the verb prefix and mirror the "under Settings" phrasing used by Guidelines so both entries describe where the feature surfaces. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

t-hamano · 2026-04-21T10:59:40Z

Update: #77497 added a new experimental setting, so I updated this PR accordingly.

ramonjd · 2026-04-22T03:28:19Z

Some incoming changes to experiment labels in #7753 (not yet merged just a heads up)

jameskoster · 2026-04-23T08:16:40Z

Very cool! A small detail; do you think the cards need to be collapsible? It doesn't seem super-useful.

t-hamano · 2026-04-23T08:33:11Z

do you think the cards need to be collapsible?

I don't mind either way. On the AI and Guidelines pages, the cards were collapsible, so I followed that.

t-hamano · 2026-04-24T07:22:07Z

I've fixed all the conflicts again. Is it okay to merge this PR? I think making the menu slug customizable needs further discussion.

manzoorwanijk · 2026-04-27T04:40:00Z

@@ -0,0 +1,12 @@
+@use "@wordpress/base-styles/variables" as *;


Same issue as #77497 (comment).

@wordpress/base-styles is used here without being declared as a dependency for the route. The build failed in #75814, catching that missing dependency,

This seems like something easy to miss. We should try to find a way to catch this before merges - maybe stylelint? 🤔

Yes, we are trying to address it via the isolated installation of dependencies - #76195.

I don't know if Stylelint will be able to catch such dependencies.

Thanks for pointing that out. #77684 should fix the issue.

alecgeatches · 2026-04-27T20:08:53Z

We've been seeing some various performance tests failing via timeout of >1 hour. For example, here's a recent random failing performance test log:

Mon, 27 Apr 2026 17:09:21 GMT     > Suite: site-editor (round 1 of 1)
Mon, 27 Apr 2026 17:09:21 GMT         > Branch: dd3d51f768a02e395f2954603a745e1409966cf0
Mon, 27 Apr 2026 17:09:21 GMT             > Starting environment
Mon, 27 Apr 2026 17:09:29 GMT             > Running tests
Mon, 27 Apr 2026 17:24:53 GMT             > Stopping environment
Mon, 27 Apr 2026 17:25:06 GMT         > Branch: trunk
Mon, 27 Apr 2026 17:25:06 GMT             > Starting environment
Mon, 27 Apr 2026 17:25:14 GMT             > Running tests
# Timeout at 1 hour

The site-editor tests are taking a longer time to run, and eventually time out. I'm still not sure the cause, but I do see performance tests on trunk increasing after this PR:

Performance test results from above also show a big 1502% change in the firstBlock metric :in the site editor:

site-editor

Metric	`cf45676`	trunk	% Change
firstBlock	65353.75 ms +0.09% -0.12%	4077.75 ms +0.91% -0.32%	1502.69%

ramonjd · 2026-04-28T01:11:47Z

Possible fix merged here: #77725

Seems to be back to normal

│ firstBlock           │ '8308.85 ms +0.94% -0.85%'               │ '8252.5 ms +0.17% -0.55%'   │ '0.68%'   │

andrewserong · 2026-04-28T01:21:55Z

I noticed a bug where experiments toggled on and then off were still being output. Fix here: #77728

As an aside, the redesign looks very nice! 🎉

t-hamano · 2026-04-28T07:55:42Z

Thanks everyone for addressing this 🙇‍♂️

fabiankaegy and others added 30 commits September 8, 2025 09:22

scaffold new experiments screen

633f591

wire up settings

26651db

fix simplify entiry record usage

d03f683

add reset button

bcb507a

fix use long array syntax

b29269b

fix remove trailing comma

4f0d25c

update e2e test helper to use rest api rather than manual post to set…

0feba77

…tings screen

add missing textdomain

e9d599c

remove boilerplate code

0962f2b

Update packages/edit-site/src/experiments.js

74abcad

Co-authored-by: Daniel Richards <daniel.richards@automattic.com>

Merge branch 'trunk' into feature/new-experiments-screen

b577b50

# Conflicts: # lib/experiments-page.php # packages/e2e-test-utils-playwright/src/request-utils/gutenberg-experiments.ts # packages/edit-site/src/index.js

Merge branch 'feature/new-experiments-screen' of github.com:WordPress…

5eba505

…/gutenberg into feature/new-experiments-screen

fix phpcs warning

6091ec2

uodates

5fa6567

fix update experiments based on latest changes

ccb316e

fix simplify code further

3a0b60d

fix remove trailing comma

0e2cf88

fix move experiments to single source of truth in PHP

4056bba

fix add back editor settings because the back button needs the site u…

e3bbcda

…rl to be available

fix e2e tests

79385d3

handle special case of template activation

73b43ef

Merge branch 'trunk' into feature/new-experiments-screen

6a3221d

# Conflicts: # lib/experiments-page.php

add modal for confirming reset

9492627

fix, initialize all settings as false to avoid ucontroled input chang…

069e5b6

…e notice

Merge remote-tracking branch 'origin/trunk' into wp-build-experiments…

752b67f

…-screen

ramonjd reviewed Apr 18, 2026

View reviewed changes

Comment thread routes/experiments-home/stage.tsx

Comment thread routes/experiments-home/stage.tsx

Comment thread lib/experimental/experiments/load.php

t-hamano requested a review from a team April 20, 2026 14:42

t-hamano and others added 2 commits April 20, 2026 23:43

Merge branch 'trunk' into wp-build-experiments-screen

f7eed8a

ramonjd approved these changes Apr 20, 2026

View reviewed changes

t-hamano mentioned this pull request Apr 21, 2026

wp-build: Add menuSlug and menuSlugAdmin options for admin page URLs #77508

Open

t-hamano and others added 2 commits April 21, 2026 19:46

Merge branch 'trunk' into wp-build-experiments-screen

07ba419

# Conflicts: # lib/experiments-page.php # package.json

Merge branch 'trunk' into wp-build-experiments-screen

d40ef07

t-hamano merged commit 0f99b8a into trunk Apr 25, 2026
41 checks passed

t-hamano deleted the wp-build-experiments-screen branch April 25, 2026 01:51

github-actions Bot added this to the Gutenberg 23.1 milestone Apr 25, 2026

t-hamano mentioned this pull request Apr 25, 2026

CollapsibleCard: Prevent focus ring clipping by content overflow #77667

Merged

manzoorwanijk reviewed Apr 27, 2026

View reviewed changes

t-hamano mentioned this pull request Apr 27, 2026

Experiments: Declare @wordpress/base-styles dependency #77684

Merged

alecgeatches mentioned this pull request Apr 27, 2026

RTC: fix connection lost error on large update cause by mismatch between update size bounds check and expanded base64 update size #77669

Merged

ramonjd mentioned this pull request Apr 28, 2026

e2e: shorten visit-site-editor canvas-loader visible wait #77725

Merged

3 tasks

andrewserong mentioned this pull request Apr 28, 2026

Gutenberg Experiments: Ensure the experiment is active before outputting flags #77728

Merged

This was referenced Apr 28, 2026

[abandoned draft, please ignore] Fix site editor performance helper wait #77727

Closed

Fix wait / sleep which is causing many PRs to fail performance tests in CI for reasons unrelated to the PR #77726

Open

		@@ -0,0 +1,12 @@
		@use "@wordpress/base-styles/variables" as *;

Conversation

t-hamano commented Apr 17, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What?

Why?

How?

Testing Instructions

Screenshots or screencast

Use of AI Tools

Uh oh!

ramonjd left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

ramonjd left a comment

Choose a reason for hiding this comment

Uh oh!

t-hamano commented Apr 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

t-hamano commented Apr 21, 2026

Uh oh!

ramonjd commented Apr 22, 2026

Uh oh!

jameskoster commented Apr 23, 2026

Uh oh!

t-hamano commented Apr 23, 2026

Uh oh!

t-hamano commented Apr 24, 2026

Uh oh!

Uh oh!

manzoorwanijk Apr 27, 2026

Choose a reason for hiding this comment

Uh oh!

ntsekouras Apr 27, 2026

Choose a reason for hiding this comment

Uh oh!

manzoorwanijk Apr 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

t-hamano Apr 27, 2026

Choose a reason for hiding this comment

Uh oh!

alecgeatches commented Apr 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ramonjd commented Apr 28, 2026

Uh oh!

andrewserong commented Apr 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

t-hamano commented Apr 28, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

9 participants

t-hamano commented Apr 17, 2026 •

edited

Loading

t-hamano commented Apr 21, 2026 •

edited

Loading

manzoorwanijk Apr 27, 2026 •

edited

Loading

alecgeatches commented Apr 27, 2026 •

edited

Loading

andrewserong commented Apr 28, 2026 •

edited

Loading