Experiment: Auto fill slug from singular label for taxonomies and post types#77938
Merged
Merged
Conversation
ntsekouras
added
[Type] Experimental
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
49 tasks
|
Size Change: +952 B (+0.01%) Total Size: 7.91 MB 📦 View Changed
ℹ️ View Unchanged
|
|
Flaky tests detected in c09a8df. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/25367568231
|
tyxla
approved these changes
May 5, 2026
Member
tyxla
left a comment
tyxla
left a comment
There was a problem hiding this comment.
Nice improvement 👍
I think this is shippable as-is, but there are a few things to consider before or after shipping.
Also it's a bummer we're introducing a bunch of duplicated code. Should we start looking at how we reuse it?
Comment on lines
+311
to
+332
| const onFocus = () => { | ||
| if ( data.id !== undefined || data.slug ) { | ||
| return; | ||
| } | ||
| const singular = data.config.labels.singular_name?.trim(); | ||
| if ( ! singular ) { | ||
| return; | ||
| } | ||
| const cleaned = cleanForSlug( singular ); | ||
| // On a fresh record fill the input from the singular label. | ||
| // Skip auto-fill if cleanForSlug retained non-ASCII to match | ||
| // the server's sanitize_key charset. | ||
| if ( /[^a-z0-9_-]/.test( cleaned ) ) { | ||
| return; | ||
| } | ||
| const trimmed = cleaned | ||
| .slice( 0, SLUG_MAX_LENGTH ) | ||
| // Slicing can introduce a trailing hyphen — strip it. | ||
| .replace( /-+$/, '' ); | ||
| if ( trimmed ) { | ||
| handleChange( trimmed ); | ||
| } |
Member
There was a problem hiding this comment.
One of the issues of this logic is that if we use a singular label matching an existing post type (like Post, it will preflll the slug with post and error out since it exists. We might need to improve that handling so we don't suggest a slug that matches an existing one.
Contributor
Author
There was a problem hiding this comment.
Added it in the tracking issue for a follow up.
Contributor
There was a problem hiding this comment.
I think we can solve this in one of two ways. First, we can validate before suggesting a slug. This way, if the slug that is about to be suggested is already registered, we can simply leave it blank for the user to fill in.
The second option, which I feel is more practical, is to suffix the suggested slug with a number if it already exists. For example, post could become post-n. This would require multiple validations because, if post has already been used five times, we would end up checking post, post-2, post-3, post-4, and finally post-5, which is what we would eventually suggest to the user. This approach would require us to determine the next available suffix number. Ref
Personally, I would choose the second option if we must suggest a slug. Otherwise, a simpler approach would be to leave it blank and let the user input the slug manually, while we validate it each time they type one in. This would be cleaner to implement, though the UX implications might need some consideration.
I am looking forward to hearing your thoughts. Once we reach some consensus, I would be happy to implement this.
cc: @ntsekouras @tyxla
Member
There was a problem hiding this comment.
@im3dabasia I see you've opened a PR for that, let's discuss there: #78341
Comment on lines
+209
to
+231
| const onFocus = () => { | ||
| if ( data.id !== undefined || data.slug ) { | ||
| return; | ||
| } | ||
| const singular = data.config.labels.singular_name?.trim(); | ||
| if ( ! singular ) { | ||
| return; | ||
| } | ||
| const cleaned = cleanForSlug( singular ); | ||
| // On a fresh record fill the input from the singular label. | ||
| // Skip auto-fill if cleanForSlug retained non-ASCII to match | ||
| // the server's sanitize_key charset. | ||
| if ( /[^a-z0-9_-]/.test( cleaned ) ) { | ||
| return; | ||
| } | ||
| const trimmed = cleaned | ||
| .slice( 0, SLUG_MAX_LENGTH ) | ||
| // Slicing can introduce a trailing hyphen — strip it. | ||
| .replace( /-+$/, '' ); | ||
| if ( trimmed ) { | ||
| handleChange( trimmed ); | ||
| } | ||
| }; |
Member
There was a problem hiding this comment.
Same as above wrt generating a slug that matches an existing taxonomy
| // Surface them in priority order: structural rules first, async slug-taken last. | ||
| // `required` only overrides the native browser message when our rule supplies | ||
| // one of its own. | ||
| function getSlugCustomValidity( validity?: FieldValidity ) { |
Member
There was a problem hiding this comment.
Should we look at reusing some of those when they're literally the same between post types and taxonomies?
Contributor
Author
There was a problem hiding this comment.
Yeah.. We'll probably need a shared content-types package or something that might contain both user taxonomies and post types. I updated the tracking issue with this.
| : null; | ||
| }, | ||
| }, | ||
| Edit: function SlugEdit( { |
Member
There was a problem hiding this comment.
This entire component also looks pretty reusable, would be nice to see how to avoid the duplication
tyxla
reviewed
May 5, 2026
| import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis'; | ||
|
|
||
| export const { lock, unlock } = | ||
| __dangerousOptInToUnstableAPIsOnlyForCoreModules( |
Member
There was a problem hiding this comment.
It's a shame we need to do this solely for using ValidatedInputControl.
@mirka are we planning to stabilize the validated form components soon?
Member
There was a problem hiding this comment.
Since the validated components are currently mainly used through @wordpress/dataviews, I was hoping to keep them private, and replace them with validated versions of @wordpress/ui form components when they're available.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What?
Part of #77600
Testing instructions
Content typesexperiment.Settings → Post Typesand go to add a new one.slugfieldslugisn't auto-filledTaxonomies.