What’s new in Gutenberg 12.4 (19 January )

“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 12.4 has been released and is available for download!

This week we want to bring special attention to the 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) improvements that are continually happening in the project. Thanks to all those working to make Gutenberg usable by all!

Table of Contents

Accessibility improvements

Focus now correctly returns to the list view button after closing out of list view—saving a lot of trouble to get back to where you were before opening it.

More improvements are in place for the block inserter 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.. The search input now receives focus when it is opened. And, for screen readers, the close button was added to the desktop view to ensure consistency with the mobile view.

Post publish panel categories reminder

It can be easy to forget to add tags or categories to a post before publishing. A suggestion for adding tags already existed in the publish panel, but now there is also a suggestion for assigning a category to the post that will show up if a categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. is not already assigned.

New "Suggestion: Assign a category" section in the post publish panel

Site editor keyboard shortcuts help panel

As a part of the border work of UI parity with the post editor, the site editor now has a list of keyboard shortcuts available. They can be accessed by pressing CONTROL + OPTION + H on MacOS or CTRL + ALT + H on Windows or through the “More tools and options” (vertical ellipsis/kebab menu) dropdown. Enjoy streamlined workflows with these shortcuts in more places.

Keyboard shortcuts modal in the site editor

CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks recategorization

More blocks have been recategorized as theme blocks in the inserter to help encourage correct usage of these blocks and clarify their functionality. The following blocks can now be found in the theme category:

  • Post Template
  • Pagination
  • Next Page
  • Page Numbers
  • Previous Page

Props to new contributors

Kudos to the first-time contributors that joined during the last release cycle: @alberto-marin @ugljanin @mauteri. If you’re interested in contributing but don’t know where to start, join the Core Editor weekly meetings on Wednesdays @ 14:00 UTC in #core-editor focused on all things Gutenberg.

Changelog

Enhancements

Accessibility

  • Accessibility improvements for 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. Inserter. (37357)
    • Try possibly better method for Block Inserter Search focus. (37793)
  • Accessibility improvements for List View Part 1. (37798)
  • Improve successful draft save notification for screen readers. (37683)

Block Library

  • Audio: Add uploading state. (37739)
  • 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 to and from Post Content transformations. (37651)
  • Search: Improve escaping on the search block. (37829)
  • Page List: Add menu-item-home class to Navigation for front page. (37301)
  • Tag Cloud: Add outline style. (37092)

Components

  • ExternalLink: Update icon to be smaller, have no margin. (37859)

Post Editor

  • PostLockedModal: Display preview link as part of the text. (37852)
  • Try: Polish post takeover modal. (37821)
  • Suggest picking a category on the pre-publish panel. (37703)

Block Editor

  • Inserter: Update categories for theme blocks. (37723)

Site Editor

  • Add keyboard shortcut help modal. (37650)
  • Update copy on Snackbar that appears when a template is deleted. (37888)

Icons

Bug Fixes

Block Library

  • Code: Remove color from code theme.scss. (37816)
  • Code: Try: Polish code styles to properly apply border properties. (37818)
  • Columns: Avoid using CSSCSS Cascading Style Sheets. variables for block gap styles. (37436)
  • Comments Pagination Next: Fix accidental division by zero. (37788)
  • Gallery: Pass any custom attributes through the gallery v2 migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. script. (37812)
  • Gallery: Remove warning notice about mobile version required. (37842)
  • Navigation: HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. tags like inline images in nav links break submenu layout. (37665)
  • Navigation: Set the default for –navigation-layout-align to “flex-start” when using vertical orientation. (37696)
  • Navigation: Fix overlay menu errant focus style on scrim. (37824)
  • Page List: Show UIUI User interface warning if Pages cannot be retrieved in Page List block. (37486)
  • Page List: Update page list flex variables to match navigation. (37718)
  • Post Comments: Tidy up Post Comments default styling. (37709)
  • Post Content: Check for nextpage to display page links for paginated posts. (37672)
  • Post Excerpt: Fix previews. (37648)
  • 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.: Use gap for the grid view. (37711)
  • Query Loop: Check for zero queryId on initialization. (37867)
  • Site logo: Fix range control on landscape logos. (37733)
  • Simplify and unify a few modal dialogs. (37857)
  • Fix enqueueing additional styles for blocks only when rendered. (37848)
  • Fix typo (hanle -> handle). (37849)
  • Revert “[Paragraph Block] add font family support”. (37815)

Colors

  • Coloring panel is unusable in RTL. (37644)
  • Impossible to clear colors if color palettes are removed. (37791)
  • Use useCallback hook from wordpress/elements in color-picker. (37745)

Components

  • BaseControl: Fix VisualLabel styles. (37747)
  • ConfirmDialog: Use hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. from wordpress/elements. (37771)
  • CustomSelectControl: Stop keypresses being caught by other elements when they happen. (30557)

Post Editor

  • Restore canvas padding for classic themes. (37741)

History

  • Fix broken ‘Redo’ by removing faulty logic for discarding unsaved Logo changes. (37895)
  • Fix redo after update/publish with transient edits. (37840)

Templates 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.

  • Fix Home template description typo. (37843)
  • Improve user experience with blocks editor when a block is not registered. (37646)

Block Editor

  • Fix LinkPicker freeze when virtual keyboard is hidden. (37782)
  • RichText: Fix dead key input on Windows. (37777)
  • Link control: Translate empty link string. (36975)
  • Add post-type-x classname to 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.. (37429)

Global Styles

  • Reduce specificity of legacy font sizes defined by core. (37819)

Accessibility

  • Fix aria-modal attribution with multiple navs on page. (37813)

Template Editor

  • Template Mode: Trim long post titles in large viewports. (37720)

Site Editor

  • Add the “Help” link to the tools menu. (37647)
  • Contextualize “Export” string to differentiate it from other occurrences in WP Core. (37660)

Documentation

  • Block.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. Schema: Update fontSize and lineHeight props. (37853)
  • Theme.json Schema: Fix appearanceTools in theme.json schema. (37762)
  • Theme.json Schema: Update theme.json schema to allow for per-block management of settings. (36746)
  • Add checkbox for updating schemas if appropriate. (37780)
  • Fix issue template typo. (37825)
  • Add automated theme.json reference documentation. (37569)
  • Add link to block source for reference. (37750)
  • Add missing end tag for codetabs in stylesheet guide. (37827)
  • Fix broken URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org on block variation page. (37702)
  • Fix type of saved $content. (37688)
  • Fix type of saved content – part two. (37740)
  • Fix PHPCSPHP Code Sniffer PHP Code Sniffer, a popular tool for analyzing code quality. The WordPress Coding Standards rely on PHPCS. failure. (37742)
  • Update create block type how to guide for block.json. (37674)
  • Update stylesheets guide with using block.json file. (37679)
  • OSX Setup guide: Wrap lts/* in quotes for nvm commands. (37722)
  • Remove “experimental” from full site editing documentation. (37655)
  • Update copyright year to 2022 in license.md. (37689)
  • Update wp-plugin.md. (37846)
  • Updated ColorIndicator readme. (37638)
  • Update the Post Author block description. (37836)
  • Fixing broken links and adding colon. (37664)
  • Improve Gutenberg release documentation. (37898)

Code Quality

  • Add the WP version in which some JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. APIs will be removed. (37854)

Block Library

  • Late escape Categories block. (37835)
  • Late escape Page List block. (37873)
  • Late escape Query blocks. (37877)
  • Late escape RSS block. (37878)
  • Late escape Table of Contents block. (37882)
  • Late escape Search block. (37879)
  • Move escaping to point of output in Archives block. (37834)
  • Post Content: No need to pass default get_the_content args. (37701)

Post Editor

  • PostLockedModal: Update action buttons markup. (37837)

Parsing

  • Block API: Separate validation stage during block parsing. (37763)

Components

  • Refactor SuggestionsList to use hooks and change class to function component. (36924)

Tools

Testing

  • Allow type imports for ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. everywhere. (37862)
  • Change the performance job folder structure to avoid nested node_modules. (37775)
  • Fix flaky test by using waitForResponse to ensure the URL details request completes. (37901)
  • Marking test that consistently fails as skipped. (37729)

Build Tooling

  • wp-env: Replace TT1-Blocks with Empty Theme in the wp-env of gutenberg and CI. (37446)
  • wp-env: Show --help when no subcommand is passed. (32755)
  • Scripts: Scan block.json files to detect entry points for the build process. (37661)
  • Scripts: Add plugin-zip command to create a zip file for a WordPress 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. (37687)

Create Block

  • Allow custom folder name for a block. (37612)
  • Speed up scaffolding by omitting WordPress dependencies. (37639)

Performance Benchmark

Post Editor

VersionTime to first blockKeypress event
Gutenberg 12.47.4 s46 ms
Gutenberg 12.37.4 s46 ms
WordPress 5.88.0 s53 ms

Site Editor

VersionTime to first blockKeypress event
Gutenberg 12.46.9 s37 ms
Gutenberg 12.36.7 s38 ms
WordPress 5.85.9 s11 ms

Time to first block: firstBlock

Keypress event: type


Thanks to @priethor and @annezazu for helping write and proofread this post!

And kudos to all the contributors who have submitted bugs, written code, designed components, added documentation, reviewed others’ contributions, and everything else that goes into making Gutenberg. 👏

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

Editor Chat Agenda: 19th January 2022

Facilitator and notetaker: @get_dave.

This is the agenda for the weekly editor chat scheduled for 2022-01-19 14:00 UTC.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • 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/ 12.4.0.
  • WordPress 5.9 RCrelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). 3.
  • Updates based on updated scope for site editing projects:
    • Navigation 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..
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
    • Components Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have an update for the main site editing projects, please feel free to share as a comment or come prepared for the meeting itself.
  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

Editor chat summary: Wednesday, 12 January 2022

This post summarizes the weekly editor chat meeting on Wednesday, 12 January 2022, 14:00 UTC held in Slack.

WordPress and 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/ Releases

@jorgefilipecosta started the chat by saying Gutenberg 12.3 was released on the 5 of January. Details related to the Gutenberg release can be read in this post. The notable features are new blocks one can use and the gap and typography support additions to the group 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..

Regarding the WordPress release, @jorgefilipecosta said the RC2 was released on 11 of January and things are going smoothly with the WordPress release. The final WordPress 5.9 version is planned for 25 of January 2022.

From the editor side on 5.9 must-have board we still have 9 to-do items and 3 items are in progress.

Project updates

Native mobile app

Shipped

  • ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. Native v0.66 upgrade

Fixes

  • Line-height issue on Android
  • Link picker freeze when virtual keyboard is hidden
  • Text formatting issue when backspace is used
  • Cover block 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. related to the color settings

In progress

  • Final tweaks in the GSS Font size/color implementation
  • Finalizing reliability improvements of the mobile translations pipeline

Template editor, site editor, and styles

Two PR’s were submitted (#1, #2) that implement code editing for edit site and the ability to copy the template content. These PR’s when merged will bring UI parity between the site editor and post editor.

Regarding the styles project the focus was on testing things and improving what we have in the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. by fixing some bugs, improving the escaping of some parts, and fixing missed backports.

Task coordination

@mamaduka

@jorgefilipecosta

Worked on bringing parity between site editor and post editor. For the next week plans on:

Open floor

WordPress 6.0 project board

@paaljoachim shared the following:

As there are issues that are punted from WP 5.9. Will it be helpful to get a project board up as soon as possible for WP 6.0 to be sure that punted issues and other issues are handled early? Similar to how TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. has a 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.) for 6.0 early tickets.

@jorgefilipecosta answered that we don’t have a board for 6.0 because the assumption is everything that is being worked on will be part of 6.0.

Block editor dependency on user endpoints

@tomjn shared the following:

I had hoped to raise a subject I wanted to talk about last week but I will not be around tomorrow. I’d much appreciate anybody who can look into the issue of the editor making the invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. assumption that the user is always logged in and always has a usable active session.

This has crippled Frontenberg but also doesn’t account for expired WP sessions, cancelled sessions, etc, and does not have an appropriate fallback ( it results in a partial code editor view ). Default behaviour in WordPress has always been to show a modal dialog with the login window, and past Gutenberg behaviour has been to assume the user cannot publish and adjust the UIUI User interface accordingly e.g. submit for review rather than publish/update. It’s also prior precedent that these types of REST request are bundled with the initial page load to avoid the additional request so there are performance consequences

– https://make.wordpress.org/core/2022/01/04/editor-chat-agenda-5-january-2021/#comment-42271

– https://github.com/WordPress/gutenberg/issues/37682

@jorgefilipecosta said this seems like an issue we should address. We just need someone to work on the fix.

@tomjn said that his hunch at the moment is that getEntityRecords handles this and the same pattern would work for getCurrentUser but it’s mainly speculation. If that’s the case the fix is simple.

Typography settings consitency and list block class

@luminuu shared the following:

While testing the 5.9 RC1, I came across the inconsistency of the font family selection at the typography settings. It was reverted from the paragraph block but it is still in use in some other blocks. To avoid confusion with users, I suggested to remove the font family setting from the other blocks as well. Please have a look and share your thoughts: https://github.com/WordPress/gutenberg/issues/37826

I also want to request some help with the PR https://github.com/WordPress/gutenberg/pull/36676 as I’m struggling to have the checks running through properly. This PR is related to an issue of the 5.9 Must Have project: https://github.com/WordPress/gutenberg/issues/37388

@jorgefilipecosta said that regarding #37826 @ntsekouras created a PR to address it. Regarding #36676 the addition of a class to the list block was discussed as part of the fix to the issue #37388. @oandregal proposed an alternative fix and left his thoughts after the chat in this comment.

Unexpected style warnings

@joostdevalk shared the following:

Hey team! I have a problem I want to submit to you all.

  • In this PR an error was introduced that is thrown when Gutenberg thinks styles are not added properly.
  • As becomes clear from the content of the errors, only styles added by blocks or themes are taken into account. However, plugins can add styles as well. At Yoast we add a style sheet to add styling to our metaboxMetabox A post metabox is a draggable box shown on the post editing screen. Its purpose is to allow the user to select or enter information in addition to the main post content. This information should be related to the post in some way..
  • We haven’t changed the way we include those styles in years, but suddenly console errors started showing up. Even though nothing breaks functionally, errors are thrown, which means people will start blaming us if something actually breaks.
  • In this PR the level of the errors was lowered to warnings.
  • In October, Ella drafted a PR that would make sure no warnings were thrown anymore.
  • Because this was quite a big PR, it was decided to extract the fix related to the warnings to a separate PR. This PR has been open since about a month.
  • Earlier this week, the PR was removed from the WordPress 5.9 Must-Haves project board.

We’d really like to have Ella’s PR merged into 5.9 to prevent warnings from being thrown, to prevent support load and getting the blame for broken things that are unrelated to us.

@mamaduka said:

I’m a little worried about including the fix in RCrelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). that hasn’t been well tested.Maybe we should remove the warning from 5.9; since plugins that add CSSCSS Cascading Style Sheets. files to the editor have no way to fix it. And as @joostdevalk mentioned, it will just increase support overhead.Then we can try and ship #37466 in the point releaseMinor Release A set of releases or versions having the same minor version number may be collectively referred to as .x , for example version 5.2.x to refer to versions 5.2, 5.2.1, 5.2.3, and all other versions in the 5.2 (five dot two) branch of that software. Minor Releases often make improvements to existing features and functionality..

@aristath added:

At this point, the warning does more harm than good. The intention behind it is good, but if we can’t fix the current implementation for 5.9, then temporarily removing these warnings makes sense

@jorgefilipecosta we can have a PR disabling the warnings and discuss in more detail on the PR.

Escaping in bocks

@fabiankaegy said the following:

I just quickly wanted to throw in this discussion I opened regarding how block should handle late escaping the content of inner blocks in dynamic blocks here: https://github.com/WordPress/gutenberg/discussions/37823It is something that keeps popping up in for example WordPress VIP code reviews and there isn’t really any guidance in the docs or in the core codebase.

@jorgefilipecosta shared that applying wp_kses_post to the content like wp_kses_post( $content ) does not seem like a good idea as a block may legitimately need to output unsafe content like javascriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. events etc and if those come from the block they are expected and safe.

@jorgefilipecosta added that the issues arise when a block outputs any information the user can manipulate like attributes. Any kind of output containing use information should be escaped as close to the output as possible. Following the WordPress principle of sanitizing sooner escaping late. @jorgefilipecosta ended the subject by sharing that @getdave is making some improvements to how core escapes information.

#block-editor, #chats, #core-editor, #core-editor-summary, #gutenberg

Editor Chat Agenda: 12 January 2021

Facilitator and notetaker: @jorgefilipecosta

This is the agenda for the weekly editor chat scheduled for Wednesday, January 12 2021, 03:00 PM GMT+1.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • 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/ 12.4 RCrelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta).
  • What’s new in Gutenberg 12.3 ( 5 January)
  • WordPress 5.9
  • Updates based on updated scope for site editing projects:
    • Navigation 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..
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
    • Components Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have an update for the main site editing projects, please feel free to share as a comment or come prepared for the meeting itself.
  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

WordPress 5.9 Performance Improvements

Thank you to @aristath @piyopiyofox @bph @mkaz @flixos90 @youknowriad who helped review this post. 

Whether you’re using the latest and greatest with full site editing features or not, there are performance enhancements that everyone can look forward to with WordPress 5.9 set to launch January 25th, 2022. At a high level, you can expect improvements to the Inserter, 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. Themes, List View, and more. 

Editor performance

This section touches on the actual experience of creating content within the editor itself. Does the Inserter open quickly, allowing you to snag what you need? Does using List View feel smooth and snappy? These are the kinds of experiences that have been focused on and improved for 5.9. 

Inserter 

The Inserter is a very commonly used tool in the editing experience that allows you to select any block or pattern you’d like to build with. As the number of blocks and patterns grow, the Inserter needs to be able to keep up to make it easy to add what you need. To aid in usability, lazy render has been applied to the Inserter in two instances: when searching block types and patterns, and when displaying categories. 

By lazy-rendering search results, the initial results are provided faster when you search. With the same lazy-rendering approach applied to categories, they now render one by one. Both improvements allow the browser to do higher priority things and ensure a better experience (like actually opening the Inserter quickly) before continuing to take care of other processes, like displaying categories. 

Reusable Blocks

For larger sites with lots of reusable blocks, saved reusable blocks are now significantly faster when a site has thousands of them. This helps fulfill the promise of WordPress growing with you. The coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. of this improvement was achieved by implementing a method that extracts the tokenizer regular expression used in package block-serialization-default-parser, and uses it to match the very first block boundary found in a reusable block’s markup.

List View

List View is an increasingly used tool to help folks navigate complex content with ease. A big part of ensuring it can be done with ease comes down to performance considerations, especially if you have a large amount of content in a page or template. When we say large, we mean it–we tested posts with 10,000 blocks. Thanks to a windowing technique that now renders a fixed number of items at a time instead of every block, the enhanced List View continues to scale as your content does. 

Front end performance

This section touches on site visitor experience and the resulting impact on SEO. Does your site render quickly? Is only what’s necessary loaded as needed? What can one do as a 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 or theme author to ensure solid performance? While loads of things impact front end performance, there are quite a few enhancements coming to WordPress 5.9 that focus on these kinds of questions: 

Block Themes

If you’re using a Block Theme, you’ll be able to take advantage of enhanced site performance thanks to 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. enqueuing all styles from one place as a “global stylesheet”. This will reduce the amount of CSSCSS Cascading Style Sheets. shipped with a theme and result in fewer specificity wars.

Block Stylesheets & CSS Loading

In previous releases, all styles for all blocks were enqueued in a single file, leading to extra page load. With the 5.9 release, only what’s necessary is loaded when viewing content due to improvements that inline tiny stylesheets, and a tweak to only load a block’s CSS styles if the block exists on the page. Further, IE polyfills were removed from block front-facing scripts to reduce their size. By cutting down on the amount of CSS loaded, the 5.9 release increases performance and decreases loading time dramatically. 

Add additional stylesheets on a per-block basis to reduce CSS impact

Block and theme developers can now add additional stylesheets on a per-block basis instead of loading monolithic stylesheets– further reducing the CSS impact on a page. For Block developers, this allows for complex blocks to reuse styles they need from other blocks without the need to duplicate those same styles. For theme developers, you can now use a new wp_enqueue_block_style() function that allows you to register stylesheets on a per block basis to reduce any unnecessary styles loading. Here’s a dev note with more information.

Improvements to Lazy Loading images

Building on the excellent work to implement lazy loading images in WordPres 5.5, performance improvements are coming baked into WordPress 5.9 without needing any extra efforts from developers. At the core of this change is that WordPress will now skip the very first “content image or 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.” on the page from being lazy-loaded. As you can see in the comprehensive dev note that details this change, “an analysis taking into account 50 popular themes showed that the enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature. brought LCP improvements across the board, up to 30% faster page load”

What do the numbers show? 

Numbers help paint a picture that words can’t always. Below is a snapshot of this release where you’ll see decreased loading times in a variety of editor areas, with only two gaining nominal loading time increases in the build.

FeatureDescriptionWP 5.6WP 5.7WP 5.8WP 5.9Diff
LoadingTime to first block (ms)3311.884773.943457.623184.38-7.90%
TypingTime to type a character (ms)54.2564.2453.6341.52-22.58%
Block selectionTime to select a block (ms)78.2166.5689.82101.89+13.44%
Inserter openingTime to open the global inserter (ms)98.91124.21134.8637.87-71.92%
SearchTime to type in the inserter search input (ms)38.8669.46124.1173.26-40.97%
HoverTime to move the mouse between two block items in the inserter (ms)37.7924.7923.5226.23+11.52%

If you’re interested in improving performance in WordPress, join the performance meetings, review the current performance related Trac and Gutenberg issues, help with the performance plugin, and test everything with performance considerations in mind.

Changelog:

  • Jan 6 2022: Updated to correct the diff values in the chart. All values were updated.

#5-9, #core-editor, #performance

What’s new in Gutenberg 12.3? (5 January)

“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 tag) are published 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 12.3 has just been released and is available to download, making it the first Gutenberg release of 2022!

This release contains fewer contributions than usual due to the holiday season that took place in some parts of the world in the last two weeks. However, it still has many important contributions, which is an excellent reminder of WordPress’ contributor diversity. Let’s dive into some of them.

Table of contents

New blocks to build with

We have three brand new blocks at our disposal.

Author Name 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.

As part of an effort to split the Post Author block into separate blocks to allow for even more layout options, the Author Name block has been released. This means you will have extra options to customize the author name to your liking.

Post Author Name

More atomic author-related blocks will follow in the future, like Author 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. or Author Bio.

Comments pagination: Next and Previous blocks

Continuing with the work that has been done on the Comments Query Loop blocks in previous Gutenberg releases, the Comments Next Page and Comments Previous Page blocks have been released.

They are the counterparts of the Next Page, and Previous Page blocks of the Query Loop, but built for the Comments 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.. They display links to navigate the comments forward and backward when not all of the comments are shown on the current page.

Comments Previous and Next Page

With the release of these two blocks, we conclude all the planned inner blocks for the Comments Query Loop. However, work on the Comments Query Loop blocks has not finished yet: more improvements are in the works.

More controls to customize

Blocks keep getting more powerful and this release is no exception.

Spacer block: custom units

Custom units can now be used to configure the Spacer block:

  • EM: Relative to parent font size
  • REM: Relative to root font size
  • VH: Viewport height
  • VW: Viewport width
Custom Units in the Spacer block

Group block: gap support & typography support

The Group block can now use the new Gap support, which adds the ability to choose the distance between the children items of the block.

This new gap setting is also available in the Row variation (added in Gutenberg 11.5), except that the gap is added horizontally instead of vertically. This allows you to have even more options to customize the layout to your liking.

Typography was added to the Group/Row blocks. This can come in handy when you need to define the typography settings for a whole section, like a 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., and you don’t want to duplicate the same typography settings over multiple blocks.

Set your site icon using the Site Logo block

There is now a new option in the Site Logo block settings to sync the site icon* to the Site Logo image. When the toggle is switched on, any updates made to the Site Logo block image are also applied to the site icon. This is an important flow that allows for parity between the Site Editor experience and the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings..

* Site icons are what you see in browser tabs, bookmark bars, and within the WordPress mobile apps.

Set site icon with Site Logo settings

Restrict 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. creation for non-adminadmin (and super admin) users

From now on, only admins can create Navigation Menus. This matches the current menu system in WordPress.

When non-admin users add a Navigation block, they will now see a warning telling them they do not have permission to create Navigation Menus and instead will be presented with the option to select an existing one. This allows folks to still add navigation to their content in line with broader WordPress permissions.

Restrict Navigation Menu creation for non-admin users
Non-admin users can still add a Navigation block and select an existing menu.
If non-admin users create a menu, changes won't be saved
If a non-admin user tries to create a menu, changes won’t be saved.

CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Blocks Reference

There is a new Handbook page that lists all the core blocks included in the Gutenberg 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. It contains the name, description, categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging., supports, and attributes of each block and it is generated automatically using their block.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. properties. This resource makes it easier for anyone who wants to extend or customize the core blocks.

Core Blocks Reference section in the Handbook

Changelog

These are all the changes included in this release.

Features

Block Library

  • Group/row blocks:
    • Add Gap support. (37459)
    • Add Typography support. (37456)
  • New Author Name block. (36001)
  • Comments Pagination:
    • New Comments Pagination Next block. (36562)
    • New Comments Pagination Previous block. (36912)

Enhancements

Block Library

  • Navigation:
    • Enable an even more compact setup state. (37089)
    • Use rems for padding. (37478)
  • Site Logo: Add option to set site icon from Site Logo block. (35892)
  • Paragraph: Add font family support. (37586)
  • Comments Template: Add comments pagination. (37610)
  • Embeds: Simplify the embed loading state. (37548)
  • Spacer: Add custom units for height and width. (36186)

Global Styles

  • Make the global styles subtitles font smaller. (37600)
  • Add support for nameless font sizes. (37410)

Colors

  • Allow color gradient popover to be above the color toggle. (37430)
  • Make color style labels simpler. (37493)
  • Use subtitle styles for the palette names. (37460)

Design Tools

  • Border panel: Collapse color controls. (37425)

Document Settings

  • Add class name to post author on edit post sidebar. (36269)

Site Editor

  • Update save panel’s cancel button from icon to visible text. (37310)

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)

  • Latest Posts: Add aria-label to featured links. (36251)

Bug Fixes

Block Library

  • Navigation:
    • Restrict Navigation permissions and show UIUI User interface warning if cannot create. (37454)
    • Ensure the overlay menu works when inserting navigation block patterns and that inner blocks are retained. (37358)
    • Fix navigation appender. (37447)
    • Revert all margins on navigation-item in the editor. (37587)
    • Fix page list issues in the overlay. (37444)
    • Show a UI warning when the user does not have permission to update/edit an existing Navigation block. (37286)
    • Try cascading nav styles through class names. (37473)
  • Query Loop:
    • Fix editable post blocks in Query Loop with zero queryId. (37629)
    • Changed the letter case for Post Type to Post type. (37499)
    • Query Pagination Next: Hide block if the custom query has no results. (37553)
    • Revert Query Pagination Next/Previous placeholder(36681). (37520)
  • Site Logo: Fix block alignment issues. (36627)
  • Gallery: Fix block registration hook priority. (37409)
  • Post Content/Title: Reflect changes when previewing a post. (37622)
  • 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.: Specify paragraph as post excerpt 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.) name. (37412)
  • Reusable Block: Fix embed handling. (37554)
  • Site icon: Fix site icon styling to display non-square site icons within a square button. (37570)
  • Template Part: Only display a missing notice in debug mode. (37404)
  • ServerSideRender: Fix loading state. (37623)
  • Comments Avatar Block: Show avatar drag handles only when selected. (37567)

Global Styles

  • Color editor discards colors with the default name. (37496)
  • Gradients are not being applied by class. (37597)
  • Impossible to edit the theme and default colors. (37497)
  • Blank site editor when theme name contains a period. (37167)
  • Lower the specificity of font-size CSSCSS Cascading Style Sheets. Custom Properties in the editor. (37526)
  • Use inset shadow on color indicators and adjust spacing. (37500)

Block Editor

  • Fix Enter handling for nested blocks. (37453)
  • Restrict delete multi-selected blocks shortcut. (37595)
  • Avoid using CSS variables for block gap styles. (37360)

Themes

  • Add comment-form and comment-list to default html5 theme support. (37536)
  • Avoid Duplicated “Theme File Editor” menu. (37592)
  • Fix conditional check “Theme File Editor” menu. (37616)
  • Fix duotone theme cache. (36236)

Template Editor

  • Avoid undoing issues when resetting parent blocks for controlled blocks. (37484)
  • Change the color of the welcome dialog close icon, so it is visible against a black background. (37435)
  • Template Editing Mode: Fix options dropdown. (37442)
  • Try to fix auto-resizing in template part focus mode. (37394)
  • Update the template list action labels. (37576)

Site Editor

  • Add customized indicators to plugin templates that have been customized. (37329)
  • Register block editor shortcuts. (37577)
  • Update regex to handle 404 template slug. (37579)
  • Parse shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. blocks outside the content. (37545)

Accessibility

  • Editor: Focus when navigation toggle receives state false. (37265)
  • Navigation: Only add dialog role when modal is open. (37434)

npm Packages

  • Fix missing peer dependencies where ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. is used indirectly. (37578)

Testing

  • Fix flaky Navigation block end-to-end test by mocking out URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org details endpoint to avoid 404. (37501)

Post Editor

  • Multi-entity saving: Allow publishing a post while not saving changes to non-post entities. (37383)

Components

  • ToolsPanel: Allow items to register when panelId is null. (37273)

Design Tools

  • Make block support tools panels compatible with multi-selection. (37216)

Documentation

Packages

  • Add automated core blocks documentation. (36183)
  • Added README for GradientPicker. (37614)
  • Add a link to 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.-block example in gutenberg-examples repo. (37633)
  • Fix parameter type in the render function of file block. (36262)
  • Add changelog entry for __experimentalIsRenderedInSidebar gradient components flag. (37457)

Handbook

  • Switch code distinction to JSX & Plain. (37348)
  • Fix a grammatical error in the Create Block tutorial. (37636)
  • Fix plugin sidebar tutorial not publishing. (37505)
  • Update plugin sidebar to new how to guide template. (37490)
  • Update “Local by Flywheel” name and URL. (37512)
  • Update Meta Boxes to a single page how to guide. (37621)

Code Quality

Compatibility with Core

  • Adds missing block template class properties. (37556)

Formatting

  • Fix lint issues. (37618)
  • Move block patterns compatibility code to lib/compat folder. (37451)

Packages

  • Data:
    • Block top level useSetting paths. (37428)
    • Deprecate receiveUploadPermissions. (37508)

Site Editor

  • Remove dead code. (37581)

Components

  • Storybook: Tweak configuration for v6.4 update. (37544)

Security

Tools

Testing

  • End to end:
    • Switch to using a $eval to fill user creation fields. (37469)
    • Fix and enable remaining navigation block end-to-end tests. (37437)
    • Add block editor shortcuts end-to-end tests. (37624)

Build Tooling

  • Add npm-run-all package to simplify running scripts. (37558)
  • Update caniuse to latest. (37588)
  • Fix pre-commit hook to build block documentation. (37613)

Performance Benchmark

Post Editor

VersionTime to first blockKeypress event
Gutenberg 12.36.7 s50 ms
Gutenberg 12.26.7 s49 ms
WordPress 5.86.9 s53 ms

Site Editor

VersionTime to first blockKeypress event
Gutenberg 12.36.7 s41 ms
Gutenberg 12.26.7 s43 ms
WordPress 5.84.3 s12 ms

Time to first block: firstBlock
Keypress event: type


Thank you, @gziolo and @annezazu for helping me with the release process, proofreading this post, and helping to select the release highlights.

Thank you, @javiarce for creating the assets included in this post.

And finally, thanks to all those who contributed to this release!

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

Editor Chat Agenda: 5 January 2021

Facilitator and notetaker: @jorgefilipecosta

This is the agenda for the weekly editor chat scheduled for Wednesday, January 5 2021, 03:00 PM GMT+1.

Because of a misunderstanding the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. editor chat was not held this week.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • 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/ 12.3 RCrelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta).
  • What’s new in Gutenberg 12.2 ( 22 December)
  • WordPress 5.9
  • Updates based on updated scope for site editing projects:
    • Navigation 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..
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
    • Components Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have an update for the main site editing projects, please feel free to share as a comment or come prepared for the meeting itself.
  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

Miscellaneous block editor changes in WordPress 5.9

This dev notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. covers updates and changes made to the 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. editors for WordPress 5.9.

Blocks

Post Title

A div wrapper element around the post title in the post editor has been removed to align it better with the post title block. Some theme styles targeting the post title (that include the removed div’s class name) may no longer apply. Please use the wp-block-post-title class to style the post title, which will also style the post title block.

Data Module

batch function

New in the data module, the batch function triggers multiple consecutive actions to one or several data stores without re-rendering the components or notifying any data store subscriber. The store listeners are only notified when the batch callback ends.

This can be a performance improvement in situations when it’s unnecessary to rerender all the components while all the actions haven’t triggered yet. As an example, when typing in the canvas, the block editor generally triggers two actions on each character being typed: one action to update the content of the post and another one to track the current text selection. To avoid unnecessary re-renders that can impact the typing performance we batch these two actions together.

Example:

import { useRegistry } from '@wordpress/data';

function Component() {
  const registry = useRegistry();
  function callback() {
    // This will only rerender the components once. 
    registry.batch( () => { 
      registry.dispatch( someStore ).someAction(); 
      registry.dispatch( someStore ).someOtherAction(); 
    } );
  }

  return <button onClick={ callback }>Click me</button>;
}

Components

ColorPicker

The property onChangeComplete was deprecated to make the component more consistent with the rest of the codebase. Developers should update their code to the onChange property, a function that receives just a string with the color code.

The property onChangeComplete received an object instead of a string. We tried for backward compatibility, and in many cases, onChangeComplete can still be used (although not recommended). The following properties of the object passed to onChangeComplete are still valid hex, rgb, hsv, hsl, source, oldHue. The property color that contained a tinycolor2 color object is no longer valid. Code that relied on the color property must be updated as the property is not present anymore because we removed the tinycolor2 library from the project.


This change should have almost no impact as the ColorPicker component is a very low-level component used to implement the picking of custom colors, this component, although useful internally, is not particularly useful to outside 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 developers. Therefore, code that uses the higher level and useful components like ColorPalette or PanelColorGradientSettingsdoes do not require updates related to this change.

PostTaxonomyType 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.

The properties in the editor.PostTaxonomyType filter is no longer passed a value other than slug.

These following properties are no longer available debouncedSpeak, hasAssignAction, hasCreateAction, instanceId, onUpdateTerms, speak, taxonomy, and terms. To retrieve these values use the hook useSelect.

For example:

import { addFilter } from '@wordpress/hooks';
import { useSelect } from '@wordpress/data';
import { store as coreStore } from '@wordpress/core-data';
import { store as editorStore } from '@wordpress/editor';

const myEditorPostTaxonomiesFilter = ( OriginalComponent ) => {
    return ( props ) => {
        const { slug } = props;
        const { taxonomy, terms } = useSelect( ( select ) => {
            const { getEditedPostAttribute } = select( editorStore );
            const { getTaxonomy } = select( coreStore );

            const _taxonomy = getTaxonomy( slug );

            return {
                taxonomy: _taxonomy,
                terms: _taxonomy
                    ? getEditedPostAttribute( taxonomy.rest_base )
                    : [],
            };
        } );

        return <MyPostTaxonomyType terms={ terms } taxonomy={ taxonomy } />;
    };
};

addFilter(
    'editor.PostTaxonomyType',
    'myFilter/my-editor-post-taxonomies-filter',
    myEditorPostTaxonomiesFilter
);

Removed APIs

Some low-impact JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. APIs have been removed. These APIs have been initially deprecated on WordPress 5.3 and a warning message was being printed in the console to warn the developers.

  • The menuLabel prop in DropdownMenu component: without it, the Dropdown menu still works, it just might render a slightly different aria label. Prefer the usage of the menuProps prop instead.
  • The position prop in DropdownMenu component: without it, the Dropdown menu still works but might render a slightly different position. Prefer the usage of the popoverProps prop instead.
  • The onClickOutside prop in the Popover component: the component still works without it, it might not close when you click outside it. Prefer the usage of the onFocusOutside prop instead.
  • The getAutosave and hasAutosave selectors from the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./editor store: Prefer using the alternative selectors from the core data package. wp.data.select( 'core' ).getAutosave( postType, postId, userId ).

Props to @youknowriad, @jorgefilipecosta, @toro_unit, and @ellatrix for contributions to this post.

#5-9, #core-editor, #dev-notes

Editor Chat Agenda: 29 December 2021 (skipped)

This week’s meeting is being skipped due to anticipated low attendance at the end of year. Meetings will resume on January 5th, 2022. You’re encouraged to use this time to help test WordPress 5.9 Beta 4. For specific steps and areas to test, you can follow this post on how to test 5.9 features.

If you have anything you’d like to discuss or share asynchronously though, please share in the comments of this post. This includes the following:

  • If you have an update for the main site editing projects.
  • If you have anything to share for Task Coordination.
  • If you have anything you’d like to raise that typically would be discussed in the Open Floor section.

@paaljoachim and myself will follow up on any open ended questions or topics left on this thread.

#agenda, #core-editor, #core-editor-agenda, #meeting

Editor chat summary: Wednesday, 22 December 2021

This post summarizes the latest weekly Editor meeting (agenda, slack transcript), held in the #core-editor SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel, on Wednesday, December 22, 2021, 14:00 UTC.

General Updates

Updates on the key projects

Mobile

@hypest

Shipped

Functionality to customize color for selected words (GSS related).

Fixes

  • Heading 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. newline when splitting issue.
  • Bottomsheet back-button navigation issue.

In Progress

  • Upgrade to ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. Native v0.66.
  • Finalizing GSS Font size and line height.
  • Improving reliability of the mobile translations pipeline.

No other project updates at this time.

Task Coordination

@mkaz

A few bits on documentation:

  • In PR 37348 docs were refactored to use JSX/Plain as the toggles for code examples. We don’t need to limit examples to ES5 anymore, so this makes it clearer the difference. Documentation contributor guide was also updated for guidance.
  • PR 36183 adds generated coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. block documentation from the block.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. files. Published here. The item to note is if you change a block.json in a core block, you will need to run npm run docs:build. Your failing commit will tell you have a local change.
  • Take a look at WP 5.9 project board for docs and dev notes, I’m reached out to those listed. We have a goal of getting notes published before RC1, but with late fixes and holidays we won’t have them all. So, if you have any to write, try to make it a priority when you return in the new year.

@mamaduka

  • I’ve been working on WP 5.9 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. fixes for Site Editor and Template Mode.
  • Fixed embed handing in Reusable Blocks.
  • Plus removed a lot of unused code from Site Editor.

Note: Anyone reading this summary outside of the meeting, please drop a comment in the post summary, if you can/want to help with something.

Open Floor

@priethor

  • Congratulating first-time contributors for joining efforts during the 12.2 release cycle:
  • Kudos to @mikachan for becoming a member of the 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/ team

@fabiankaegy

  1. I’d love to get some eyes on this Dev Note I drafted here as I am not sure what the correct process for.
  2. I’d love to share discussion on ‘opening the editor interface to more extensibility‘ here and get some opinions on the topic.

Read complete transcript

#meeting-notes, #core-editor, #editor, #gutenberg, #core-editor-summary