Forms: Add form editor #46444

enejb · 2026-01-05T21:37:50Z

This PR is part of #46297
It breaks up the larger PR (#46297 ) in a meaningfully smaller PR that can be reviewed easier and merged.

It adds a new Form Editor

Proposed changes:

Main: Now when you visit /wp-admin/post-new.php?post_type=jetpack_form you get a more tailored experience.
Hide the post title in the jetpack form editor.
Implement the locking of the form and form insertion.
Hide the Editor tabs when the form block is selected.
Autoselect the from block when no block is selected.
We generate the new js and css files for the jetpack form editor.
They are loaded in all block editors but only if you have the feature flag enabled.
Fixed the template so that we get the default placeholders.
Implement nicer block selection with the jetpack form blocks at the top of the block inserter that you find on the left side.

Other information:

Have you written new tests for your changes, if applicable?
Have you checked the E2E test CI results, and verified that your changes do not break them?
Have you tested your changes on WordPress.com, if applicable (if so, you'll see a generated comment below with a script to run)?

Jetpack product discussion

No

Does this pull request change what data or activity we track or use?

No

Testing instructions:

Since we are adding a new class. You will need to run jetpack install -r after you switch to this PR.

Have the feature flag enabled in your sandbox.

add_filter( 'jetpack_block_editor_feature_flags', 'eb_register_feature' );

function eb_register_feature( $flags ) {
    $flags['reusable-forms'] = true;
    $flags['central-form-management'] = true;
    return $flags;
}

Notice that the you can visit /wp-admin/post-new.php?post_type=jetpack_form and that see the placeholder.
You should be able to save the form and add new form fields.

With the feature flag disabled.
You should not be able to visit /wp-admin/post-new.php?post_type=jetpack_form
Nothing should crash.
You can insert a form without any issues.
No form-editor js or css should be loaded.

github-actions · 2026-01-05T21:39:01Z

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

✅ Include a description of your PR changes.
✅ Add a "[Status]" label (In Progress, Needs Review, ...).
✅ Add a "[Type]" label (Bug, Enhancement, Janitorial, Task).
✅ Add testing instructions.
✅ Specify whether this PR includes any changes to data or privacy.
✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

Follow this PR Review Process:

Ensure all required checks appearing at the bottom of this PR are passing.
Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
You can use GitHub's Reviewers functionality to request a review.
When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

Jetpack plugin:

No scheduled milestone found for this plugin.

If you have any questions about the release process, please ask in the #jetpack-releases channel on Slack.

Copilot

Pull request overview

This PR introduces a dedicated form editor for the Jetpack Forms feature, providing a tailored editing experience when creating or editing forms via /wp-admin/post-new.php?post_type=jetpack_form. The functionality is gated behind feature flags (reusable-forms and central-form-management) and includes form locking, block nesting enforcement, and a rename command.

Key Changes

New form editor with automatic form block creation and locking to prevent removal/movement
Form rename functionality accessible via command palette when form block is selected
Custom styling that hides post title, editor tabs, and adjusts block appearance for form editing context

Reviewed changes

Copilot reviewed 12 out of 12 changed files in this pull request and generated 16 comments.

Show a summary per file

File	Description
`projects/plugins/jetpack/changelog/add-form-editor`	Changelog entry documenting the form editor addition
`projects/packages/forms/changelog/add-form-editor`	Package-level changelog entry
`projects/packages/forms/tools/webpack.config.form-editor.js`	Webpack configuration for building the form editor bundle
`projects/packages/forms/src/form-editor/use-form-rename-command.tsx`	Custom hook providing form renaming functionality via command palette
`projects/packages/forms/src/form-editor/style.scss`	Styling for form editor including tab hiding and rename modal
`projects/packages/forms/src/form-editor/index.tsx`	Main form editor logic for block locking, nesting enforcement, and category management
`projects/packages/forms/src/form-editor/class-form-editor.php`	PHP class managing allowed blocks, editor settings, and script enqueuing
`projects/packages/forms/src/contact-form/class-contact-form.php`	Adds template definition for jetpack_form post type
`projects/packages/forms/src/contact-form/class-contact-form-plugin.php`	Initializes Form_Editor when feature flag is enabled
`projects/packages/forms/src/blocks/shared/util/constants.js`	Adds FORM_POST_TYPE constant for consistent reference
`projects/packages/forms/src/blocks/contact-form/editor.scss`	Hides post title in jetpack_form editor context
`projects/packages/forms/package.json`	Adds form-editor build tasks and required dependencies

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/style.scss

projects/packages/forms/src/blocks/contact-form/editor.scss

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/index.tsx

github-actions · 2026-01-05T21:46:11Z

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack or WordPress.com Site Helper), and enable the add/form-editor branch.
To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack add/form-editor

bin/jetpack-downloader test jetpack-mu-wpcom-plugin add/form-editor

Interested in more tips and information?

In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
Read more about our development workflow here: PCYsg-eg0-p2
Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

jp-launch-control · 2026-01-05T22:03:26Z

Code Coverage Summary

Coverage changed in 3 files.

File	Coverage	Δ%	Δ Uncovered
projects/packages/forms/src/contact-form/class-contact-form-plugin.php	496/1459 (34.00%)	-0.02%	1 ❤️‍🩹
projects/packages/forms/src/contact-form/class-contact-form.php	984/1413 (69.64%)	0.02%	0 💚
projects/packages/forms/src/blocks/shared/util/constants.js	10/10 (100.00%)	100.00%	-9 💚

4 files are newly checked for coverage.

File	Coverage
projects/packages/forms/src/form-editor/index.tsx	0/118 (0.00%) 💔
projects/packages/forms/src/form-editor/class-form-editor.php	56/73 (76.71%) 💚
projects/packages/forms/src/form-editor/utils/block-utils.ts	9/9 (100.00%) 💚
projects/packages/forms/src/form-editor/utils/category-utils.ts	14/14 (100.00%) 💚

Full summary · PHP report · JS report

_{If appropriate, add one of these labels to override the failing coverage check:

Covered by non-unit tests
Use to ignore the Code coverage requirement check when E2Es or other non-unit tests cover the code

Coverage tests to be added later
Use to ignore the Code coverage requirement check when tests will be added in a follow-up PR

I don't care about code coverage for this PR
Use this label to ignore the check for insufficient code coveage.}

Copilot

Pull request overview

Copilot reviewed 12 out of 13 changed files in this pull request and generated 9 comments.

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/style.scss

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/style.scss

projects/packages/forms/tools/webpack.config.form-editor.js

projects/packages/forms/src/form-editor/index.tsx

Copilot

Pull request overview

Copilot reviewed 14 out of 15 changed files in this pull request and generated 8 comments.

projects/packages/forms/src/form-editor/use-form-rename-command.tsx

projects/packages/forms/src/form-editor/style.scss

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/use-form-rename-command.tsx

projects/packages/forms/tests/js/form-editor/index.test.js

Copilot

Pull request overview

Copilot reviewed 18 out of 19 changed files in this pull request and generated 7 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

Comments suppressed due to low confidence (1)

projects/packages/forms/tests/js/form-editor/index.test.js:21

The second test "should have a style.scss file" doesn't actually verify anything meaningful - it just checks that true equals true. This test should either be removed or replaced with a meaningful assertion that verifies the SCSS file can be imported or that its styles are applied correctly.

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/use-form-rename-command.tsx

projects/packages/forms/tools/webpack.config.form-editor.js

projects/packages/forms/src/form-editor/index.tsx

Copilot · 2026-01-05T23:54:10Z

@enejb I've opened a new pull request, #46446, to work on those changes. Once the pull request is ready, I'll request review from you.

Copilot

Pull request overview

Copilot reviewed 18 out of 19 changed files in this pull request and generated 3 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

projects/packages/forms/src/form-editor/class-form-editor.php

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/src/form-editor/use-form-rename-command.tsx

The form editor now tracks and restores the previous block categories order when moving the Jetpack contact form category to the front and back. Tests were added to verify tracking, restoring, and fallback behavior for category management.

Copilot

Pull request overview

Copilot reviewed 16 out of 17 changed files in this pull request and generated 6 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

Copilot · 2026-01-06T20:24:04Z

projects/packages/forms/src/form-editor/utils/block-utils.ts

+ * @return True if the block should be locked
+ */
+export function shouldLockBlock( block: Block ): boolean {
+	const lock = block.attributes?.lock as { remove?: boolean; move?: boolean } | undefined;


The block lock type assertion is also present in the utility file. Consider defining the BlockLock type in the block-utils.ts file and exporting it for reuse, so both the utility and the main index file can use the same type definition, improving consistency.

Copilot · 2026-01-06T20:24:05Z

projects/packages/forms/tests/php/form-editor/Form_Editor_Test.php

+		// Expected blocks - core blocks
+		$expected_core_blocks = array(
+			'core/paragraph',
+			'core/heading',
+			'core/list',
+			'core/list-item',
+			'core/separator',
+			'core/spacer',
+			'core/columns',
+			'core/column',
+			'core/group',
+			'core/image',
+			'core/html',
+		);


The PHP test file includes blocks like 'core/audio', 'core/row', 'core/stack', 'core/subhead', and 'core/video' in the allowed list (lines 88-103 of the PHP file), but these blocks are not included in the test expectations (lines 430-443 in the test file). The test should verify all allowed core blocks to ensure completeness.

projects/packages/forms/src/form-editor/index.tsx

Renamed asset files and script handles from 'jetpack-forms-editor' to 'jetpack-form-editor' for consistency. Improved TypeScript typing for block locking by introducing a BlockLock interface and updating related usages. Added asset file existence check and dynamic dependency loading in PHP registration.

…ipt doesn't run

Copilot

Pull request overview

Copilot reviewed 16 out of 17 changed files in this pull request and generated 5 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

projects/packages/forms/tests/php/form-editor/Form_Editor_Test.php

projects/plugins/jetpack/changelog/add-form-editor

projects/packages/forms/src/form-editor/index.tsx

projects/packages/forms/tests/php/form-editor/Form_Editor_Test.php

projects/packages/forms/src/form-editor/class-form-editor.php

….php Co-authored-by: Copilot <[email protected]>

Copilot

Pull request overview

Copilot reviewed 16 out of 17 changed files in this pull request and generated no new comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

edanzer · 2026-01-07T21:28:25Z

projects/packages/forms/src/form-editor/index.tsx

+		} else if ( categoriesFiltered ) {
+			categoriesFiltered = false;
+			moveFormsCategoryBackToOriginalOrder( previousCategories || [] );
+		}


Do we need to 'undo' the unregisterPlugin() call? I think in most cases if you navigate to a different block editor, this should reload/reset, but I'm not 100% sure.

edanzer · 2026-01-07T21:29:50Z

projects/packages/forms/src/form-editor/class-form-editor.php

+		$screen = get_current_screen();
+
+		// Only load in block editor contexts, not site editor
+		if ( ! $screen || $screen->id === 'site-editor' || ! $screen->is_block_editor ) {


Do we want to only be loading this JS when post_type === jetpack_form? I think that's also possible with the $screen var.

In my testing when I do that (limit by post type) then the switching in the block editor (clicking the edit form button) doesn't quite work as expected.

But since this feature doesn't load on the site-editor removing the script from the site editor is fine.

edanzer · 2026-01-07T21:35:54Z

projects/packages/forms/package.json

 	"type": "module",
 	"scripts": {
-		"build": "pnpm run clean && pnpm run build:blocks && pnpm run build:contact-form && pnpm run build:dashboard && pnpm run module:build",
+		"build": "pnpm run clean && pnpm run build:blocks && pnpm run build:contact-form && pnpm run build:dashboard && pnpm run build:form-editor && pnpm run module:build",


@enejb - the form editor if feature flagged, but this build code will always run and include the feature flagged form editor. Same with other package.json updates below specific to the form editor.

Is that a concern?

Update: I was also trying find other places the changes might leak out of the feature flag.

We bump a dependency version in this file.

We've added tests - I assume it's fine if those run during automated testing even if functionality is feature flagged.

We update the template for register_post_type in a general file, but that is feature flagged upstream.

Anyways, just worth doing a sanity check that any code outside the feature flag will be safe.

Thanks for bringing this up. This will definitely create scripts even though the feature flag is not enabled.

I think this is fine since there shouldn't be an impact on the user. (They are not downloading) the script when they visit the editor. (for example) but we might be distributing the assets (js and css) files even though they the site is under the feature flag. ( but the same cases exists for PHP files)

edanzer

Reviewed and tested:

The new form editor is working well for me.
We removed objectionable editor hacks based on comments.
PHP and JS tests pass.
I tried to find any place our changes might leak outside the feature flag, and it mostly looks good. Added a comment/question about this elsewhere.
I also tested with feature flag off with no issues to confirm no regressions.

I added a few other small comments/questions.

There will be things to tweak, but I'd say let's merge so we can clear blockers and start tackling other things in smaller increments. Nice work @enejb!

enejb requested review from a team and Copilot January 5, 2026 21:37

enejb added [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it [Status] Needs Review This PR is ready for review. [Package] Forms labels Jan 5, 2026

Copilot started reviewing on behalf of enejb January 5, 2026 21:38 View session

github-actions bot added [Block] Contact Form Form block (also see Contact Form label) [Feature] Contact Form [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ labels Jan 5, 2026

Copilot AI reviewed Jan 5, 2026

View reviewed changes

Copilot AI review requested due to automatic review settings January 5, 2026 22:11

Copilot started reviewing on behalf of enejb January 5, 2026 22:11 View session

Copilot AI reviewed Jan 5, 2026

View reviewed changes

github-actions bot added the [Tests] Includes Tests label Jan 5, 2026

Copilot AI review requested due to automatic review settings January 5, 2026 23:02

Copilot started reviewing on behalf of enejb January 5, 2026 23:03 View session

Copilot AI reviewed Jan 5, 2026

View reviewed changes

Copilot AI review requested due to automatic review settings January 5, 2026 23:38

Copilot started reviewing on behalf of enejb January 5, 2026 23:39 View session

Copilot AI reviewed Jan 5, 2026

View reviewed changes

Copilot AI mentioned this pull request Jan 5, 2026

Optimize form editor subscribe callback to prevent unnecessary operations #46446

Closed

Copilot AI review requested due to automatic review settings January 5, 2026 23:56

Copilot started reviewing on behalf of enejb January 5, 2026 23:56 View session

Copilot AI reviewed Jan 6, 2026

View reviewed changes

projects/packages/forms/src/form-editor/class-form-editor.php Show resolved Hide resolved

projects/packages/forms/src/form-editor/index.tsx Outdated Show resolved Hide resolved

projects/packages/forms/src/form-editor/use-form-rename-command.tsx Outdated Show resolved Hide resolved

Copilot AI review requested due to automatic review settings January 6, 2026 00:06

Copilot started reviewing on behalf of enejb January 6, 2026 00:07 View session

enejb added 7 commits January 6, 2026 11:33

Update to use React.KeyboardEvent

7592d53

update the form title command

a5f24aa

Improve the performance of subscribe

dbd2863

minor

f62e29d

co pilot fixes

543bd41

update the lockfiles

2801f02

Remove the hidding of the post title and the rename command

5eefef6

enejb force-pushed the add/form-editor branch from 4c81821 to 5eefef6 Compare January 6, 2026 19:49

Copilot AI review requested due to automatic review settings January 6, 2026 20:19

Copilot started reviewing on behalf of enejb January 6, 2026 20:20 View session

Copilot AI reviewed Jan 6, 2026

View reviewed changes

enejb added 3 commits January 6, 2026 14:46

Add version

cd58a05

Lets skip the test if the file doesn't exits because the js build scr…

7f63ed8

…ipt doesn't run

Copilot AI review requested due to automatic review settings January 7, 2026 19:23

Copilot started reviewing on behalf of enejb January 7, 2026 19:24 View session

Copilot AI reviewed Jan 7, 2026

View reviewed changes

Update projects/packages/forms/tests/php/form-editor/Form_Editor_Test…

6b7a364

….php Co-authored-by: Copilot <[email protected]>

Copilot AI review requested due to automatic review settings January 7, 2026 19:37

Copilot started reviewing on behalf of enejb January 7, 2026 19:38 View session

Copilot AI reviewed Jan 7, 2026

View reviewed changes

edanzer reviewed Jan 7, 2026

View reviewed changes

edanzer approved these changes Jan 7, 2026

View reviewed changes

enejb merged commit 125da7c into trunk Jan 7, 2026
96 of 98 checks passed

enejb deleted the add/form-editor branch January 7, 2026 22:32

github-actions bot removed the [Status] Needs Review This PR is ready for review. label Jan 7, 2026

github-actions bot added this to the jetpack/15.5 milestone Jan 7, 2026

Forms: Add form editor #46444

Forms: Add form editor #46444

Uh oh!

Conversation

enejb commented Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Proposed changes:

Other information:

Jetpack product discussion

Does this pull request change what data or activity we track or use?

Testing instructions:

Uh oh!

github-actions bot commented Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Key Changes

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions bot commented Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jp-launch-control bot commented Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Coverage Summary

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI commented Jan 5, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

enejb commented Jan 5, 2026 •

edited

Loading

github-actions bot commented Jan 5, 2026 •

edited

Loading

github-actions bot commented Jan 5, 2026 •

edited

Loading

jp-launch-control bot commented Jan 5, 2026 •

edited

Loading

edanzer Jan 7, 2026 •

edited

Loading