What’s new in Gutenberg 14.1? (15 September)

“What’s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/…” posts (labeled with the #gutenberg-new tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.)) are posted following every Gutenberg release on a biweekly basis, discovering new features included in each release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Full Site Editing project.


Gutenberg 14.1 has been released and is available for download!

Table of Contents

Consolidating design tools in blocks.

Typography and Spacing support was added for blocks like AvatarAvatar An avatar is an image or illustration that specifically refers to a character that represents an online user. It’s usually a square box that appears next to the user’s name., Buttons, Categories List, Comments Links, Latest Posts, Navigation, Query Pagination Links, Social Icons, etc.

This improvement allows users to customize their site more without dealing with CSSCSS Cascading Style Sheets.

A screenshot of all blocks that includes new options.

Better content locking experience.

Duotone filters, blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. alignment and resizing are now disabled on content-locked blocks.

A small video showing how locked patterns work.

The menu selector moved from the Navigation block toolbar to the new “Menu” section in the inspector sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. In this new section, you can now quickly access all the menus you have created through the “Manage menus” button.

A gif showing the moved Menu section.

Before this release, when importing a classic menu, Gutenberg automatically transformed it into a block menu and then updated the user site navigation menuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site.. From now on, you will have to first save your changes in order to show the imported menu. If you don’t, the site will keep displaying the menu that you had used before importing the classic menu! This provides a better user experience as the menu is only changed when the user explicitly saves the template.

The navigation block keeps iterating on its user experience. All feedback is welcome!

Zoomed-out view in the site editor (experimental).

This feature provides a zoomed-out view in the site editor, allowing you to focus on site building rather than the details of each granular block. 

When in this mode, the users will have a quick overview of their site without having to scroll or using the native browser zoom-out function. Also, navigation between areas becomes easier with this new enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature..

This feature is still experimental so users have to enable it in “Experiments” under the “Gutenberg” menu item. If you want to explore using it, join this call for testing for the FSE Outreach program and start providing feedback!

Improving the theme developer experience.

Box-shadow support included in theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.

From now on, it won’t be necessary to use CSS to add box-shadow properties to the blocks, you can use theme.json to achieve this. Here’s an example of how to do this:

In color section, add a new property shadow to any block.

{
  ...
  "styles": {
    "elements": {
      "button": {
         "shadow": "10px 10px 5px 0px rgba(0,0,0,0.66)"
      }
    }
  }
}

 

Block-based template parts for classic themes.

Classic themes can now add support for block-based template parts, allowing users to build more parts of their site with blocks without fully switching to a block theme. The theme author can enable it by using the add_theme_support( ‘block-template-parts’) function.

Once enabled, a new “Template Parts” menu is visible under “Appearance” which displays the list of the template parts available for that theme.

A screenshot of the Template Parts menu item.

Let’s use an example:
If theme authors want the site footer to be editable using blocks, they have to create a file called footer.htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. and save it inside their name_of_the_theme/parts/ directory. To use it on the front end, they need to call the block_template_part PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher function wherever they want to use a template part in their theme. In this case, it could be a footer.php file:

<?php block_template_part( 'footer' ); ?>

And that’s it! They can now update their footer in the Site Editor as if it were a block theme.

There will be a call for testing for this feature, feel free to join!

Global styles data are now filterable

Gutenberg 14.1 includes four filters to edit the global styles data in PHP.

  • global_styles_default => to filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. data provided by CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • global_styles_blocks => to filter data provided by the blocks (only styles so far).
  • global_styles_theme => to filter data provided by the theme.
  • global_styles_user => to filter data provided by the user.

Some use cases will now become much easier:

  • Providing settings dynamically. For example, color presets depending on some contextual information.
  • Allowing plugins to modify the existing data.
  • Editing or removing core data by code (color presets, etc).

You can read more about it in the documentation.

Improving the writing experience

Better multi-selection

Multi-selection feature now has a smoother experience by preventing some flashes of the block outline when you select between blocks or placeholders. 

Better block transforms organization

Paragraph, heading, list and quote are now shown in a separate menu subgroup. This way, they are easier to find as those are the most used transformations.

Screenshot 2022-09-12 at 12 19 57 PM
An example of the new block transforms subgroup

Changelog

Features

Block Library

  • Add select icon for Navigation Block’s menu button. (43674)

Full Site Editing

  • Add a zoomed out view to the site editor. (41156)

Enhancements

Design Tools support in Blocks

  • Archives: Add typography support. (43935)
  • Avatar: Add padding support. (43519)
  • Buttons: Add typography supports to button/s blocks. (43934)
  • Calendar: Add typography supports (except text-decoration). (43969)
  • Categories List: Add spacing support. (43647)
  • Comment Date: Add spacing support. (43656)
  • Comment Edit Link: Add spacing support. (43657)
  • Comment Reply Link: Add spacing support. (43658)
  • Gallery: Add padding and margin support. (43965)
  • Heading: Add missing typography support. (44003)
  • Home Link: Add typography support. (43307)
  • Latest Posts: Add typography supports. (43540)
  • List: Add missing typography block supports. (43311)
  • Navigation Link: Add typography support. (44005)
  • Post Content: Add typography supports. (43339)
  • Post ExcerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox.: Add missing typography supports. (43341)
  • Query No Results: Add typography supports. (43551)
  • Query Pagination Next: Add missing typography supports. (43555)
  • Query Pagination Numbers: Add missing typography supports. (43559)
  • Query Pagination Previous: Add missing typography supports. (43556)
  • Query Pagination: Add typography support. (43552)
  • Query Title: Add missing typography supports. (43565)
  • Quote: Add missing typography supports. (43567)
  • Search block: Add typography supports. (43499)
  • Site Logo: Add padding and margin support. (43520)
  • Site Title and Tagline: Add text decoration support. (43972)
  • Social Icons: Add missing padding support, update margin support. (43885)
  • Table: Add missing typography supports. (43974)
  • Term Description: Add missing typography supports. (43568)
  • Verse: Add missing typography supports. (43569)

Block Library

  • Add: Content role to relevant audio block attributes. (44037)
  • Audio: Display upload error notices using snackbars. (43891)
  • Code: Add transformation to Paragraph. (43938)
  • Columns: Add axial block spacing to Columns block (alternate attempt). (44101)
  • Comments block (legacy mode): Update warning message wording. (43527)
  • Cover Block: Keep the inner contents in a physical direction even in RTL languages. (43663)
  • Create classic navigation menus as draft and dirty the site editor. (43580)
  • File: Display upload error notices using snackbars. (43893)
  • Gallery: Display upload error notices using snackbars. (43946)
  • Image: Display transformation error notice using snackbars. (44031)
  • Improves the UXUX User experience of menu management in the navigation block. (42987)
  • Mark which attributes of the video should be considered content. (44038)
  • Media & Text: Display upload error notices using snackbars. (43890)
  • Navigation: Add overlay close button to icon toggle control. (43067)
  • Navigation: Set the icon control to full width. (43844)
  • Navigation: Try adding minimal animation to overlay. (43851)
  • Navigation: Try making it possible for themes to have the X overlay the = icon. (43576)
  • Navigation: Update to use translate instead of top. (44082)
  • Prevent single Columns blocks transforming into Columns. (43641)
  • Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop.: Add allowedControls in block variations for better extensibility. (43632)
  • Query Loop: Pass extra query args in REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/. call for accurate preview for extenders. (44093)
  • Quote: Restrict single block transforms to specific blocks. (44106)
  • Update: Add __experimentalRole attributes to media text block. (43957)
  • Video: Display upload error notices using snackbars. (43892)

Components

  • Add contextConnectWithoutRef() to bypass ref forwarding. (43611)
  • AlignmentMatrixControl: Keep the physical direction in RTL languages. (43126)
  • ColorPalette: Make popover style consistent. (43570)
  • DropdownMenu: Use KeyboardEvent.code, refactor tests to model RTL and user-event. (43439)
  • GradientPicker: Show custom picker before swatches. (43577)
  • Guide: Use code instead of keyCode for keyboard events. (43604)
  • NavigableContainer: Use code instead of keyCode for keyboard events. (43606)
  • Popover: Refactor to TypeScript. (43823)
  • Storybook: Support dashicons for testing. (43721)
  • Style engine: Pass CSS formatting options from global functions. (43886)
  • TextControl, TextareaControl: Add flag to remove bottom margin. (43782)
  • ToggleGroupControl: Decouple borderless style with icon use. (43771)
  • Upsize typography tools. (43331)

Block Editor

  • Add icons for different types of suggestions in LinkControl. (43970)
  • Add justification controls to constrained layout. (44065)
  • Adds block supports for metadata. (43986)
  • Better block transforms organization. (44072)
  • Block Setttings Menu Controls: Add unstableDisplayLocation prop. (43987)
  • Content width toggle: Polish wording and appearance. (43702)
  • CustomGradientPicker: Remove and deprecate outer margins. (43436)
  • Improve content locking experience. (43956)
  • Multi-select: Add transition to reduce chance of flash. (43510)
  • Partial multi selection: Limit if selection contains unmergeable block. (42934)
  • Rich text: Log deprecation message for multiline prop. (43613)
  • Show parent block as selected when there is content locking. (43918)
  • Simplify the inserter styles and scrollable. (44088)
  • TextTransformControl/TextDecorationControl: Migrate to ToggleGroupControl. (43328)

Post Editor

  • Add ‘isDeletingPost’ selector. (44012)

CSS & Styling

  • Categories List Block: Match the markup on the block editor to the front end. (43666)
  • Placeholders: Make dashed style a mixin, and apply across. (43512)
  • Separator: Remove appearance of “inset” style. (43948)

Patterns

  • Allow remote pattern registration in theme.json when core patterns are disabled. (43634)
  • Content lock ability. (43037)
  • Post type restriction APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. for patterns. (41842)

Global Styles

  • Added outline support for blocks via theme.json. (43526)
  • Block Spacing: Using spacing controls for block gap values to support presets in the UIUI User interface. (43466)
  • Add box-shadow support for blocks via theme.json. (41972)
  • Make global styles data filterable. (44015)

Testing

  • Draggable block tests: Click block inserter instead of pressing Enter key. (43734)

Document Settings

  • Display pretty permalink for draft posts. (43600)

Themes

  • Add cite to theme.json elements. (43543)
  • Block-based template parts for Classic themes. (42729)
  • Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. block: Enable gradient overlay. (43838)

Site Editor

  • Archive-PostType template UI. (42746)
  • New archive-$postType templates get proper fallback content. (43603)
  • Template for specific categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging.: Only load posts from that category in post template block. (43699)

New APIs

Block Library

  • Add filter for inner blocks in the Navigation block. (37998)
  • Make it possible to import individual blocks. (42258)

Extensibility

  • Add a filter to build_query_vars_from_query_block. (43590)

Block API

  • Blocks: Add new render field to block.json. (42430)

Bug Fixes

Block Library

  • Code Block: Fix duplicate background color. (43599)
  • File Block: Remove i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill. from save function. (43050)
  • Fix block switcher preview scrollbar. (44079)
  • Fix block transform preview height. (44076)
  • Fix duplicate navigation block props. (43596)
  • Fix error in useClientWidth. (43585)
  • Fix site editor toolbar when block is bigger than viewport. (43548)
  • Fix the default icon for the navigation block. (44104)
  • Fix: Site logo rounded on mobile. (43903)
  • Fix: Site logo rounded. (43762)
  • Group: Fix click-first state. (43513)
  • Image: Display upload error notices using snackbars. (43767)
  • List: Add cut clipboard handler. (43609)
  • Navigation: Add current-menu-item also for archive links. (43800)
  • Navigation: Hide overlay preview settings when the overlay is off. (44032)
  • Navigation: Remove unneeded gap:Inherit rule on wrapper element of navigation block. (43669)
  • Post Terms: Use unbound query in the usePostTerms hook. (43501)
  • Site Logo: Fix border radius regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5.. (43701)
  • Fix cover flex issue in the editor. (43413)
  • Fix embed iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser. sizing issue. (40213)
  • Update: Make it possible to change list items even if parent is template locked. (43959)
  • Latest Posts categories settings. (43685)
  • navigation block: Fix empty site-log li element in the dom. (44049)

Global Styles

  • Block editor: Move margins to theme.scss and common.scss. (43813)
  • Don’t apply root padding to nested layout blocks. (43842)
  • Duotone palette doesn’t reflect settings in theme.json. (43671)
  • Fixing broken layout styles for themes using theme.json settings on blocks that require layout styles. (43925)
  • Layout: Fix issue with fallback gap styles where gap was being output for constrained layout type. (44001)
  • Remove main content layout padding in preview. (43601)
  • Split root layout rules into a different function. (43792)

Components

  • Button, Icon: Fix iconSize prop doesn’t work with some icons. (43821)
  • Flex: Remove flex gap polyfill. (43995)
  • Popover: Enable auto-updating every animation frame. (43617)
  • Popover: Make more reactive to prop changes, avoid unnecessary updates. (43335)
  • Site editor: Fix padding and margin visualizer positioning. (43971)
  • Disabled: Preserve input values when toggling the isDisabled prop. (43508)

Block Editor

  • BlockInspector, ComplementaryArea: Fix overscoped p style. (43866)
  • Column Block: Enable global template_lock inheritance. (42677)
  • Fix blank screen on templates page. (43602)
  • Fix the horizontal block list drop indicator when dragging to the start. (43944)
  • Fix: Block styles preview is not displayed. (43837)
  • Fix: Non boolean usage on reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. output. (43919)
  • hasContentRoleAttribute: Check that block type exists. (43864)
  • Improve Safari text-selection style. (43313)
  • Prevent the default browser behaviour for dropped files from running. (43493)
  • RTL fix for inlined block-styles. (41762)
  • Spacing presets: fix bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. with unlinked not applying if non int slugs used. (44136)

Design Tools

  • Fix display of width controls for legacy layouts. (43688)
  • FontFamily: Fix server-side attribute registration via typography support. (43937)
  • Layout: Fix blockGap output when using a falsy 0 value. (43757)
  • Layout: Fix toggling off inner blocks content width setting for legacy markup. (43888)

Testing

  • Fix asserting Post Format without opening the document settings sidebar. (43710)
  • Fix clicking on top of the publish panel in metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. box end-to-end test. (43708)
  • Fix playwright’s openDocumentSettingsSidebar util not opening the sidebar. (43506)

Style Variations

  • Styles API: Fixed selectors for nested elements. (43988)

Typography

  • Font size picker: Add a fallback for the name property. (43794)

Post Editor

  • Editor: Simplify ‘findOrCreateTerm’ method logic. (43766)
  • Fix the style settings from core/post-content block in theme.json that are not applied in the editor. (42270)

Site Editor

  • Site Editor: Fix focus outline cut off in code editor. (42980)

Templates API

  • Block Templates: Add the custom templates info for the template posts. (43597)

AccessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility)

  • Better handling of loading states for navigation selector. (43904)
  • Limit contrast checker to only blocks that have at least one color defined. (43592)

Performance

Block Library

  • Comments Pagination: Avoid creating a new allowedBlocks array on every render. (44021)
  • Lodash: Refactor away from _.first() and _.last(). (43894)
  • Lodash: Remove _.omit() from block library. (43707)
  • Query Pagination: Avoid creating a new allowedBlocks array on every render. (44020)
  • Query by name. (43850)

Components

  • Lodash: Refactor away from _.cloneDeep(). (43631)
  • Lodash: Refactor away from _.partial(). (43895)
  • Lodash: Remove from FormTokenField component. (43744)

Data Layer

  • Lodash: Refactor away from _.forEach(). (43807)
  • Lodash: Refactor away from _.has(). (43626)
  • Lodash: Remove _.omit() from wordpress/data. (43712)

Post Editor

  • Lodash: Refactor away from _.unionBy(). (43735)
  • Lodash: Remove _.omit() from a few other packages. (43714)

Testing

  • Updates the content we use for performance testing. (43770)

Widgets Editor

  • Lodash: Remove completely from wordpress/edit-widgets package. (43682)

Block Editor

  • Lodash: Remove from blocks API raw handling. (43575)
  • Lodash: Refactor away from BlockActionsMenu (RN). (43849)
  • Lodash: Refactor away from BlockActions. (43846)
  • Lodash: Refactor away from BlockMover. (43853)
  • Lodash: Refactor away from useFocusFirstElement. (43847)
  • Lodash: Remove _.first() and _.last() from block editor store. (43854)
  • Lodash: Remove _.first() and _.last() from block tools and useSelectAll hook. (43855)
  • Lodash: Remove _.omit() from block editor. (43704)

REST API

  • Core Data: Stop sending duplicate requests in canUser resolver. (43480)

Documentation

  • Add documentation for the block template parts theme support. (44009)
  • Adding instructions for adding sub-pages to packages documentation. (43750)
  • Create a new handbook page for propagating updates. (43538)
  • Create Block: Split documentation into two sections. (43718)
  • Docgen: Add basic handling for the since tag. (43550)
  • Docs: Add example of BlockControls to Format API how to guide. (43581)
  • Docs: Fix required status of onSelectUrl prop of MediaReplaceFlow component. (44025)
  • Document new global styles filters. (44111)
  • Document template_lock=noContent for Custom Post Types. (43977)
  • InnerBlocks: document that templateLock:NoContent cannot be overriden by children. (43825)
  • Theme.json: Add default values for settings.spacing.spacingScale. (43860)
  • Theme.json: Fix schema for useRootPaddingAwareAlignments. (43628)
  • Typography block supports: Call tear_down in tests and format PHP doc blocks. (43968)
  • Update a broken link to the format-api example. (44058)
  • Update playwright end-to-end utils readme. (44016)
  • Updated the “Create your First App with Gutenberg Data” how-to guide. (43633)
  • Add select icon for Navigation Block’s menu button. (43674)
  • Style engine: pre-core migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. documentation and house keeping. (43840)
  • Fix JSON syntax issues in theme.json examples. (43828)

Code Quality

Components

  • AnglePickerControl: Deprecate margin bottom. (43867)
  • CheckboxControl: Add flag to remove bottom margin. (43720)
  • ComboboxControl: Add unit tests. (42403)
  • DateTimePicker: Address feedback after recent refactor to date-fns and use-lilius. (43495)
  • DropZone: Convert to TypeScript. (43962)
  • Fix TS types for isValueDefined()/isValueEmpty(). (43983)
  • FocalPointControl: Add flag to remove bottom margin. (43996)
  • FocalPointPicker: Convert to TypeScript. (43872)
  • FontSizePicker: Deprecate bottom margin. (43870)
  • FormFileUpload: Convert to TypeScript. (43960)
  • Invert tsconfig to be exclude-based. (43534)
  • Lodash: Refactor away from _.escapeRegExp(). (43629)
  • Lodash: Remove from block factory API. (43560)
  • Lodash: Remove from block registration API. (43558)
  • Lodash: Remove from block serializer API. (43561)
  • Lodash: Remove from block templates API. (43563)
  • Make more components pass type checks. (43579)
  • RadioControl: Clean up CSS. (43868)
  • Remove unused normalizeArrowKey utility function. (43640)
  • Remove unused Storybook utils. (43578)
  • Retire DARK_GRAY colors. (43773)
  • Retire LIGHT_GRAY[ 200 ] and DARK_GRAY[ 150 ]. (43719)
  • Retire LIGHT_GRAY color object. (43994)
  • SearchControl: Convert to TypeScript and add flag to remove bottom margin. (43871)
  • Style engine: Refer to ‘context’ rather than ‘store’ in global function. (43841)
  • TabPanel: Convert to TypeScript. (43536)
  • ToggleControl: Convert to TypeScript. (43717)
  • WordPressComponentProps: Only add refs when they are actually added. (43610)
  • Refactor Icon tests to @testing-library/react. (44051)
  • Refactor IsolatedEventContainer tests to @testing-library/react. (44073)
  • Refactor KeyboardShortcuts tests to @testing-library/react. (44075)
  • NUX: Refactor DotTip tests to @testing-library/react. (43768)

Compose

  • Refactor pure HoC tests to @testing-library/react. (43913)
  • Refactor withInstanceId HoC tests to @testing-library/react. (43915)

Post Editor

  • Edit Post: Refactor BrowserURL tests to @testing-library/react. (43978)
  • Edit Post: Refactor PageAttributesOrder tests to @testing-library/react. (43980)
  • Refactor PostPublishButton tests to @testing-library/react. (43909)
  • Refactor PostPublishPanel tests to @testing-library/react. (43908)
  • Refactor PostSavedState tests to @testing-library/react. (43769)
  • Refactor PostSlug tests to @testing-library/react. (43973)
  • Update changelog to include a new ‘isDeletingPost’ selector. (44120)
  • Refactor MetaBoxesSection tests to @testing-library/react. (43774)
  • Refactor PostPublishButtonOrToggle tests to @testing-library/react. (43776)
  • Refactor PreferencesModal tests to @testing-library/react. (43775)
  • NumberControl: Add TypeScript prop types. (43791)
  • Popover: Stabilize __unstableShift prop to shift. (43845)

Block Library

  • Button: Remove hardcoded white. (43553)
  • Categories List Block: Escape home_url(). (43824)
  • Gallery Block: Use wp_enqueue_block_support_styles(). (43859)
  • Post Terms: Refactor the usePostTerms hook. (43503)
  • Navigation: Use code instead of keyCode for keyboard events. (43644)
  • Create an alias get_element_class_name to use it in blocks. (44099)

Block Editor

  • Refactor AlignmentControl tests to @testing-library/react. (44022)
  • Refactor BlockAlignmentUI tests to @testing-library/react. (44023)
  • Refactor BlockEdit tests to @testing-library/react. (44027)
  • Refactor BlockIcon tests to @testing-library/react. (44089)
  • Refactor BlockTitle tests to @testing-library/react. (43811)
  • Refactor BlockVerticalAlignmentUI tests to @testing-library/react. (44029)
  • Refactor BlockView tests to @testing-library/react. (43818)
  • Refactor ComboboxControl to pass exhaustive-deps. (41417)
  • Refactor ContrastChecker tests to @testing-library/react. (43975)
  • Refactor DefaultBlockAppender tests to @testing-library/react. (43990)
  • Refactor DimensionControl tests to @testing-library/react. (43916)
  • Refactor DocumentOutline tests to @testing-library/react. (43772)
  • Refactor FocalPointPicker to function component. (39168)
  • Refactor MediaPlaceholder tests to @testing-library/react. (43991)
  • Refactor MenuItem tests to @testing-library/react. (43778)
  • Refactor NavigatorButton to pass exhaustive-deps. (42051)
  • Refactor NavigatorScreen to pass exhaustive-deps. (43876)
  • Refactor Panel tests to @testing-library/react. (43896)
  • Refactor PostTaxonomies tests to @testing-library/react. (44068))
  • Refactor Slot/Fill tests to @testing-library/react. (44084)
  • Refactor URLInputButton tests to @testing-library/react. (43899)
  • Refactor UrlPopover tests to @testing-library/react. (43898)
  • Refactor Warning tests to @testing-library/react. (43817)
  • Refactor withColors tests to @testing-library/react. (43976)
  • Refactor withFilters tests to @testing-library/react. (44017)
  • Refactor popover to use separate flip and resize props instead of forcePosition. (43546
  • Fix: Inexistent parameter passed to parseUnitFunction. (43920)
  • Minor code tweaks/optimizations (PHP). (43375)

Rich Text

  • Remove deprecated wrapperClassName prop. (44033)

Inspector Controls

  • Remove leftovers from previous iterations in block inspector. (43806)

PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party

  • Remove ‘gutenberg_rest_nonce’ method. (43805)

List View

  • ListViewBlock: Refactor to have locking data in a single place. (43803)

npm Packages

  • Block Serialization Default Parser: Include TypeScript type declarations. (43722)
  • Lodash: Remove _.omit() from wordpress/blocks. (43711)
  • Lodash: Remove completely from wordpress/format-library package. (43738)
  • Lodash: Remove completely from wordpress/i18n package. (43677)
  • Lodash: Remove completely from wordpress/redux-routine package. (43741)
  • wordpress/date: Rename __experimentalGetSettings() to getSettings(). (43884)

Global Styles

  • Elements: Check value and whitelist before building style nodes. (43622)
  • Prepare WP_Theme_JSON_Data class for backporting. (44109)
  • Safeguard for backportbackport A port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch. of get_template_hierarchy function. (44085)
  • Format Library: Remove redundant inline link test. (43912)
  • Layout: Unit tests for gutenberg_get_layout_style. (44006)

Block Editor

  • Rich text: Remove unused unstable list functions. (43614)

Data Layer

  • Add tsconfig.json to core-data package. (43638)
  • Add type signature for useDispatch. (43528)
  • Bundle TypeScript types with the data package. (43643)
  • Simplify TypeScript types in wordpress/core-data. (43515)

Navigation

  • Unskip navigation menu selector focus test. (43507)

Tools

Build Tooling

  • Update unstaged documentation error message. (43953)
  • Scripts: Change webpack configuration to include render files in the build folder. (43917)
  • Scripts: Update webpack configuration to allow modern image format. (43880)
  • Update scaffold.js. (43740)
  • Makepot: Fix translations object handling. (43797)

Testing

  • Add comments for the repeated move commands in draggable end-to-end tests. (43933)
  • Add stale issue workflow for flaky test reports. (43547)
  • Avatar: Add test to ensure that user image updates when user switched. (42657)
  • Fix PHP Tests: Try removing registry from WP_Block constructor calls. (43927)
  • Iframed editor: Fixed skipped tests. (43697)
  • Migrate draggable block tests to Playwright. (43798)
  • Migrate duplicating block test to playwright. (43171)
  • Migrate register block test case to playwright. (43170)
  • Migrate writing flow tests to Playwright. (43637)
  • Preview tests: Wait for the post-status change. (43874)
  • Skip draggable block end-to-end tests. (43736)
  • Skip navigation block end-to-end tests. (43571)
  • Update Playwright. (43887)

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~36,000 words, ~1,000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance.

Post Editor

VersionTime to first blockKeyPress Event (typing)
Gutenberg 14.06.9s33.5ms
Gutenberg 14.17.6s28.39ms
WordPress 6.01.5s41.03ms

Site Editor

VersionTime to first blockKeyPress Event (typing)
Gutenberg 14.08.4s25.1ms
Gutenberg 14.19,9s29.03ms
WordPress 6.03.26s13.11ms

Contributor Props

The following contributors merged PRs in this release:

@aaronrobertshaw @adamziel @afragen @amustaque97 @andrewserong @annezazu @aristath @BE-Webdesign @c4rl0sbr4v0 @carolinan @chad1008 @ciampo @colorful-tones @dcalhoun @dgwyer @draganescu @ellatrix @fabiankaegy @flootr @geriux @getdave @glendaviesnz @gziolo @jasmussen @jonathanbossenger @jorgefilipecosta @kevin940726 @kkoppenhaver @madhusudhand @MaggieCabrera @Mamaduka @matiasbenedetto @mikachan @mirka @mrobit @ndiego @niklasp @noisysocks @ntsekouras @oandregal @ockham @pavanpatil1 @petitphp @pooja-muchandikar @RahiDroid @ramonjd @ryanwelcher @SantosGuillamot @scruffian @SiobhyB @spacedmonkey @stokesman @sunyatasattva @t-hamano @talldan @tellthemachines @torounit @tyxla @youknowriad

The following PRs were merged by first time contributors:

Kudos to all the contributors that helped with the release! 

Props to @priethor @critterverse @bernhard-reiter @czapla @bph, @cbringmann @matveb, and @annezazu for their assistance with the release.

#block-editor, #core-editor, #gutenberg, #gutenberg-new