What’s new in Gutenberg? (18 November)

While the work on Full Site Editing and Global styles is continuing, 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/ 9.4.0 introduced some nice additions to existing blocks and APIs. Let’s take a look at some of them:

Button widths

Instead of relying on dynamic widths, you can set percentage widths for button blocks.

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. Variations Transformations

Blocks can provide block variations. In Gutenberg, a variation switcher can be added to the block inspector for these blocks.

Social Icons size support

Users can change the size of the icons in the Social Icons block.

Font size support for the List block

9.4 🇸🇰

Features

  • Add Keyboard Input inline format. (26801)
  • Add Block variations transformations. (26687)
  • Add width selector for button block. (25999) (26781).
  • Add font size support to the List block. (26257)
  • Social Links: Add ability to change social icon sizes. (25921)

Enhancements

  • Unify the inserter search UIUI User interface. (26595)
  • Polish custom select menu styles. (26956)
  • Polish menu item styles. (26889) (26720) (25218) (26572)
  • Polish the link interface. (26551)
  • Code & Preformatted Blocks: Delete on backspace if empty. (26605)
  • File Block: Move the URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org button to the Block toolbar. (26602)
  • Allow adding a headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. by typing /h1, /h2 etc. (26597)
  • Polish 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. block styling. (26456)
  • Polish Search block styling. (26446)
  • Use a wider canvas for themes that don’t provide a custom width. (26357)
  • Show reduced UI on hover. (26882)
  • Update Legacy WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. toolbar button font to match UI when displayed in Widget Screen. (26841)
  • Update token field icon. (26726)
  • Windows 10 high contrast mode improvements. (26567)

New APIs

  • Create block: Add support for external templates installed from npm. (23712)
  • Add optional icon to snackbar notices. (26907)
  • wordpress/env: Add support for custom WP_HOME port. (26507)
  • wordpress/lazy-import: Allow importing local paths. (23751)
  • Format library: Introduce useAnchorRef. (26782)

Bug Fixes

  • Fix block context injection hook after CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. change in block rendering. (26998) (27011)
  • Fix Query block’s Toolbar popover width. (26992)
  • Fix IE11 interface bugs. (26944)
  • Improve arrow navigation between blocks. (26921)
  • Fix block alignments when theme styles are disabled. (26912) (26680) (26376)
  • Fix padding of text-only buttons mode. (26769)
  • Fix horizontal mover icon position. (26761)
  • Fix column width units. (26757)
  • FormTokenField input position when typing. (26741)
  • Fix applying colors to outlined buttons. (26707) (24626)
  • Render big font sizes properly in the font size picker. (26705)
  • Use currentColor in quote blocks to better support dark themes. (26684)
  • Fix “Browse All” in Quick Inserter for container blocks. (26443)
  • Fix responsive embeds in the widget screen. (26263)
  • Fix undefined index notice in Social Link Block. (25663)
  • Buttons block: Fix default alignment icon in toolbar to reflect the actual default alignment of buttons. (26910)
  • Block Support: Fix font size style when applying block support. (26762)
  • Do not invalidate the entity record cache during optimistic update in saveEntityRecord. (26627)
  • Provide a minimum of code wrapping for the code block. (26623)

Experiments

  • Full Site Editing Framework: Rework templates and template parts synchronization. (26650) (26383)
  • Full Site Editing Blocks:
    • 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. block: Allow editing of generated excerpts. (26637)
    • Post Excerpt block: Add missing closing div 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.). (26806)
    • Add wide and full alignment options to the post/site title blocks. (26601)
    • Template Part block: Render preview as div. (26873)
    • Post Taxonomies: Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 Fatal erroor for unregistered taxonomyTaxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies. (#26851). (26854)
    • PostAuthor: Safeguard to wait for authors to load. (26776)
    • Query block: Update the order of settings and filters in the 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.. (26647)
  • Site Editor:
    • Fix responsiveness. (26021)
    • Fix alignment of the new template button. (26934)
    • Add default block widths styles. (26853)
    • Refactor menu creation code. (26966)
    • Only show auto-draft template parts corresponding to current theme. (26948)
    • Polish the template 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.. (26933), (26930).
    • Add navigation panel back button slot. (26846)
    • Remove dashboard button focus on mount. (26845)
    • Saving flow: Use template and template parts entities titles. (26708) (26653)
    • Reorder template creation dropdown. (26610)
  • Global styles:
    • Fallback to theme color pallete. (26783) (26786)
    • Hide Block panels without content. (26609)
    • Update styles to rely on CSSCSS Cascading Style Sheets. variables for colors and gradients. (26319)
    • Fix Table block global styles selector. (26973)
    • Hide the line height panel if disabled 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. file. (26778)
    • Cache generated styles. (25680)
    • Add: Mechanism to detect if a block instance matches a global styles selector. (26945) (26991)
    • Extract theme json processor. (26803)
    • Add support for line height at the global level. (26767)
    • Add preset classes generation on the client side. (26224)
  • Navigation block: Fix color support declaration. (26928)
  • Popover: Add sticky boundary element prop. (26728)
  • Block Support:
    • Add font style and weight options with combined UI. (26444) (26868)
    • Add text transform block support flag. (26060) (26059)
    • Add Font Family picking mechanism. (24868), (26750), (26759).

Performance

  • Use 2-pass terser compression. (24821)
  • Memoize getEntityRecords to prevent infinite re-renders. (26447)
  • Resolve per-entity resolvers after receiving a list of records. (26575)

Documentation

Code Quality

  • Use date-fns and date-fns-tz instead of moment. (25782) (27002)
  • is-shallow-equal: Convert to ESM. (26833)
  • Minor code refactoring in template part previews. (26949)
  • Drop zone: Rewrite with 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. and simplify. (26893)
  • PostTitle: Rewrite with hooks (+ avoid globals). (26820)
  • Avoid relying on a the global document. (26834) (26814) (26813) (26657)
  • Format library: Use hooks for all components. (26779)
  • Sandbox: Use hooks and avoid withGlobalEvents. (26742)
  • Draggable: Use hooks and prepare for 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.. (26897)
  • PostLockedModal: Use hooks and avoid withGlobalEvents. (26743)
  • WpEmbedPreview: Use hooks and avoid withGlobalEvents. (26740)
  • FocusableIframe: Use hooks and avoid withGlobalEvents. (26737)
  • Navigation Component: Update styles to reference grid spacing helper. (26523)
  • Hooks: Type package. (26430)
  • Deprecated: Type package. (26429)
  • Movers: Small positioning refactor. (26353)
  • Use useAnimate for all Animate component usage. (26201)
  • Gallery block: Use 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. v2. (26145)
  • Gallery: Remove obsolete deprecation entry. (26736)
  • Cleanup: (24831), (23598), (27000).
  • Remove useMemo in Query inspector controls. (26658)

Build Tooling

  • Add eslint rule to warn against using globals for addEventListener. (26810)
  • Update workflows to use Node 14.x. (26835)
  • Add command to format PHP files. (26850)
  • Build Tooling: Rebuild stylesheets when imported styles are modified. (26649)
  • Fix GH actions “cancel” step. (27025)
  • Run assign fixed issues and first time contributor label tasks for PRs from forks. (26876)
  • Update .nvmrc to use latest LTS. (26855)
  • Update nodegit to 0.27.0 in wordpress/env. (26712)
  • Tests: Add fixture for Column deprecation. (26774)
  • Store screenshots of CI end-to-end failures as CI artifacts. (26664) (26957)
  • End 2 End Tests:
    • Fix improper assertion in template-part.test. (26709)
    • Fix RTL end-to-end tests. (26508)
    • Add regresion end-to-end test for the empty reusable block causing WSODs issue. (26913)
    • Add block drag and drop test. (26869) (26904)
    • Add Delete on backspace from empty code/preformatted blocks test. (26972)
    • Merge end-to-end test relying on order into one. (26883)
    • Add template part conversion end-to-end tests. (26788)
    • Make the allowed blocks test more stable. (26631)
    • Add end-to-end test utils to install and activate themes. (23685)

Various

  • TextControl: Support forwarding refs. (26209)
  • Update gutenberg_is_fse_theme function to make it filterable. (27021)
  • Windows: Use wp-env instead of file location. (26671)
  • Site Editor: Rename left sidebar → secondary sidebar. (26517)
  • Add State locks for concurrency control to wordpress/core-data. (26389) (26661)
  • Avoid PHP warnings when 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 folder isn’t writable. (17671)

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.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 9.46.2s26.6ms
Gutenberg 9.36.3s23.7ms
WordPress 5.56.7s22.1ms

Kudos for all the contributors that helped with the release. 👏

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

Editor chat summary: Wednesday, 4 November 2020

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, November 4, 2020, 14:00 UTC.

Thank you to all of the contributors who tested the BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. releases and gave feedback. Testing for bugs is a critical part of polishing every release and a great way to contribute to WordPress.

WordPress 5.6 Beta 3

WordPress 5.6 Beta 3 is now available to be tested. Released on 2nd novemebr.

WordPress 5.6

Project board to track issues for inclusion in WordPress 5.6.

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/ 9.3

Gutenberg 9.3 was released on 4th november

Monthly Plan

November Monthly Priorities.

Updates on the key projects

@youknowriad

  • The pace is increasing on the Full Site Editing related work, now FSE themes don’t need the experimental flag to work properly. A warning message about the experimental state is shown in the adminadmin (and super admin).
  • I expect some of us to focus more on template parts and templates auto-draft behavior (how to load theme templates and templates parts in the site editor).
  • I believe other folks are also working on the UIUI User interface and the Query 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..

@vindl

Full Site Editing – Navigation milestone update:

  • The PR for detaching blocks from Template Parts shipped.
  • Bunch of fixes and tweaks for some minor issues related to the navigation 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 template parts.
  • PR for adding incorporating search for templates and template parts is now open
  • Here is an attempt to create wp_templates entries on theme updates instead of on each 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. request
  • We started a new and simplified version of framework PR for introducing a custom status for templates provided by themes (or plugins) as HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. files, which haven’t been customized by the user yet

@ntsekouras
FSE: Query block

@jorgefilipecosta

Global Styles:

  • We now support other units and fluid typography on font size presets.
  • We now use the block settings on each global styles panel.
  • We now reference the preset variables on global styles so if for example global background color is set set to color X, and later we change color X, the background color also changes.
  • The UI is improved and we don’t show block panels without content.
  • We should have font family picker in the next few minutes (just finishing a last round of tests)

@nosolosw

  • For Global Styles the current focus is on tighten up things and fixing the flows, specially by testing what we have with the TwentyTwentyOne blocks theme.

Task Coordination

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.

@zieladam

Took a deep dive in coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. data:

  • Propose an update to useSelect to address every key stroke in the editor re-running all registered selectors.
  • Merged two fixes related to saveEntityRecord ending up with outdated state.
  • Proposed lock mechanism for core-data to ultimately fix all the timing issues.
  • I am also playing with taking screenshots of all e2e failures on GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ CI.

@youknowriad

  • I’m focusing on FSE efforts as raised above
  • I’m also thinking about dev notesdev 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. for the APIs introduced on WP 5.6 and hoping to find time to write these next week.  I believe we should start publishing some of the block editor dev notes.

@karmatosed

  • Navigation drop down improvements.
  • Link iterations again this one grew from improvments to link UI.
  • I’m trying to do some PR trashTrash Trash in WordPress is like the Recycle Bin on your PC or Trash in your Macintosh computer. Users with the proper permission level (administrators and editors) have the ability to delete a post, page, and/or comments. When you delete the item, it is moved to the trash folder where it will remain for 30 days. pickups as go and level up my skills there, thank you to everyone that has supported me (special calls to @itsjonq and @joen) Also continuing to work on options and going to post some flow updates to that this week.
  • Release continues, so I’m also navigation around that.

@annezazu

  • Quieter week for me, Working with others on communication for 5.6.
  • some light triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. for unlabeled items, and some quick FSE focused testing.
  • Excited to take 9.3 for a spin!

@ntsekouras

  •  Query block: Expose initial templates as block variations.
  • Fix double alignment controls in toolbar of Heading block.
  • Allow editing of extracted 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. in Post Excerpt block

@itsjonq

@paaljoachim

@retrofox

@bph

  • Thanks to  @afragen I am  almost ready for Gutenberg-Nightly version for non-dev testers.

@jorgefilipecosta

  • Iterated and merged support for other units and fluid typography on font size presets.
  • Iterated and merged PR to use the block settings on each global styles panel.
  • Iterated and merged PR to reference the preset variables on global styles so if for example global background color is set set to color X, and later we change color X, the background color also changes.
  • Submitted and merged PR to don’t show block panels without conten
  • Rebased and Iterated on font family picker in the next few minutes (just finishing a last round of tests).
  • Reviewed multiple PR including the moment removal PR.
  • Submitted multiple small fixes/enhancements to Global styles

For the next week, I plan on testing 2021 blocks deeply with global styles and submit fixes either for the theme or to Gutenberg. I plan to continue the typography work with font weight and  recheck a possible font loading global styles API.

@kjellr

  • I’ll be focused on Twenty Twenty-One Blocks.

Open Floor

@tomjn

  • Asked what’s the best way to register block for particular post type.
  • Current option is to 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. through blocks and unregister undesored blocks for the posttype.
  • Some discussion around defining posttype via 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. but no decision.

@meszarosrob

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

What’s new in Gutenberg? (4 November)

This is the first 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/ release that is not going to be included entirely in WordPress 5.6. The important bug fixes were backported to WordPress 5.6 betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. 2 and 3.

In addition to the stability work for WordPress 5.6, the contributors also focused on improvements to the Full-site editing flows. The FSE experiment will be automatically enabled if you activate a 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.-based theme.

The site editor and its navigation panel saw a lot of improvements as well.

Site Editor Screen

9.3 🇲🇾

Enhancements

  • Support for all units in Font Size presets. (26475)
  • Sort post formats alphabetically by translated name. (26305)
  • Ensure Alignment options are always rendered in the same order. (26269)
  • Buttons block: Overhaul alignment and justification controls. (23168)
  • a11yAccessibility 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): Retain focus position when tabbing back to the block toolbar. (25760)
  • Dark mode UIUI User interface enhancements. (26483) (26510)
  • Social Links: Add Patreon, Telegram, and Tiktok icons. (26118)

Bug Fixes

  • Fix Visual 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. on the color palette editor. (26614)
  • wordpress/scripts: Fix error in ignore-emit-webpack-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. (26591)
  • Cover block: Restore default overlay background. (26569) (26625)
  • 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.: Fix incorrectly pluralized strings. (26565)
  • Limit the editor interface to max-width 100%. (26552)
  • Ensure editor footer remains at the bottom of the screen when navigating regions. (26533)
  • URLInput: Use debounce() instead of throttle(). (26529)
  • Heading Block: Fix double alignment controls in toolbar. (26492)
  • Fix Block preview vertical offset. (26487)
  • Reusable Blocks: Make the number retrieved from the 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. unlimited. (26486)
  • Fix editor error when an empty reusable block exists. (26484)
  • Latest Posts: Add missing classname. (26477)
  • Fix single column block display for smaller screens. (26438)
  • Turn off autocomplete for ComboboxControl components. (26427)
  • Fix parent post selector initial value and search. (26397)
  • Fix gallery block undo issue. (26377)
  • Fix spellings in the Getting Started guide. (26310)
  • Fix embed blocks rendering in widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. (26307)
  • Fix design of color/gradient controls. (26255)
  • Fix drop zone indicators for non blocks. (25986)
  • Fix left and right alignments for video embeds. (24847)
  • Next Page block: Center text properly. (26515)

New APIs

  • Allow text buttons in DropdownMenu. (26425)
  • Support custom viewportWidth in block previews (example). (26346)
  • Change updateSelection property to false for InnerBlocks. (26312)

Experiments

  • Full Site Editing :
    • Disable 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. and widgets screens. (26594)
    • Automatically enable FSE experiment. (26500)
    • Remove the demo templates. (26419)
    • Strip post ids from template part blocks on export. (26268)
    • Allow themes to live in a subdirectory. (26391)
  • Introduce the layout prop to InnerBlocks. (26380)
  • Site Editor
    • Add Dropdown to Create Generic Templates. (26284)
    • Prevent inserter overscroll. (26432) (26583)
    • Fix dirty template and template parts on template creation. (26560)
    • Fix composite role warnings triggered by template part previews. (26406)
    • Reduce the Amount of Data Passed Through the Components Tree. (26463)
    • Add the option to convert a template part to regular blocks. (26488)
    • Fix Invisible Template Previews in the 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.. (26424)
    • Add convert to template part flow. (20445)
    • Fix custom template part theme 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.. (26587)
  • Query block:
    • Add initial variations. (26378)
    • Add sticky support. (26279)
  • Global Styles:
    • Use block settings on the block panels. (26218)
    • Fix: Font size picker regression on edit site global styles. (26603)
    • Process settings only once. (26330)
  • Navigation Component:
    • Add Support for RTL Languages. (26334)
    • Styling revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision.. (26338)
    • Fix focus behavior when opening the panel. (26296)
    • Fix the height of the Navigation panel and make it scrollable. (26187)
    • Search Control in Menu Titles. (25315)
  • Use a DropdownMenu for menu selection on the navigation screen. (25390)

Documentation

  • Update glossary to include more block-based terminology. (26478)
  • Update triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. documentation for clarity around closing issues and labels. (26480)
  • Update WordPress versions document to include 5.6. (26365)
  • Typos and tweaks: (26491), (26553), (26437), (26400), (26566).
  • Storybook: Fix broken BlockDraggable story. (26457) (26431)

Code Quality

  • Remove anonymous components from global styles sidebar. (26604)
  • Add types to components:
    • Tip. (26173)
    • BaseControl and VisuallyHidden. (26078)
  • Improve wordpress/I18n types. (26171)
  • Migrate to builtin data controls. (25993) (25949) (25773) (25990) (26509) (25772)
  • Chore: Ensure WordPress packages share the same hoisted dependencies. (26453)
  • Use CSSCSS Cascading Style Sheets.-in-JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. in wordpress/components:

Build Tooling

  • Components: Copy SCSS file from reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.-dates to components package. (26534)
  • webpack: Replace legacy namedChunks/namedModules options with chunkIds/moduleIds. (26502)
  • Rewrite sideEffects flags to use only positive patterns. (26452)
  • Load the Twenty Twenty-one theme by default in Gutenberg’s local environement. (26414)
  • Build: Assign the library exports to window.wp rather than this.wp. (26272)
  • Move to Dart Sass compiler. (25628)
  • Fix composer test failures due to 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. lock. (26472)
  • Update node-watch to 0.7.0. (26403)
  • Release tool: Support multiple RCs. (25971)
  • jest-puppeteer-axe: Migrate to @axe-coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./puppeteer. (25659)
  • Improve End-to-End tests stability:
    • Fix autosave end-to-end tests. (26416)
    • Fix ‘Multi entity saving -> site editor’ end-to-end failures. (26371)
    • Fix Twenty Twenty One related end-to-end test failures. (26341)
    • Fix demo test by disabling the welcome dialog. (26314)
    • Disable BlockPreviews from axe-core tests. (26527)
    • Site editor: Fix end-to-end tests navigation panel. (26454)
    • Consolidate sequential multi-entity-saving tests. (26373)
    • Make the adding patterns test stable. (26345)

Various

  • Create Block: Update the list of categories to pick from. (26448)
  • Removes extra full stop from preferences. (26586)
  • wordpress/scripts: Configure all the tools to skip vendor folder. (26450)

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.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 9.36.6s27.16ms
Gutenberg 9.26.2s26.62ms
WordPress 5.56.4s27.53ms

Kudos for all the contributors that helped with the release. 👏

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

What’s new in Gutenberg? (21 October)

9.2 was the final release to make it into 5.6 BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process.! Featured goodies in this release are:

Support for video subtitles 🎉

Subtitles dropdown on video 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.. Props to @jorgefilipecosta for the screenshot.


Ability to transform multiple selected blocks into a Columns block:

Transforming three images into a three-column columns block.


And background patterns in Cover blocks!

Adding background patterns to a Cover block. props to @retrofox for the gif.

9.2 🇭🇺

Features

  • Add video tracks functionality. (25861)
  • Transform multiple selected blocks to Columns block. (25829)
  • Cover: Add repeated background option. (26001)

Enhancements

  • Add dropdown button to view templates in 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.. (26132)
  • Gallery block: Use image caption as fallback for alt text. (26082)
  • Table block: 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. + 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. v2. (26065)
  • Refactor document actions to handle template part titles. (26043)
  • Info panel layout improvement. (26017)
  • Remove non-coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks from default editor content. (25844)
  • Add very basic template information dropdown. (25757)
  • Rename "Options" modal to "Preferences". (25683)
  • Add single column functionality to the Columns block. (24065)
  • Add more writing flow options: Reduced UIUI User interface, theme styles, spotlight. (22494)
  • Add option to make 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. a link. (25714)
  • Widgets Screen:
    • Add legacy widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. inspector card component. (26142)
    • Show the legacy widget name in list view. (26138)
    • Add unsaved changes warning to widgets screen. (26081)
    • Display Widget Area’s name and description in the sidebar. (25943)
    • Widgets editor: Add basic options for extensibility. (25758)
    • Disallow multiple instances of reference widgets. (26148)
    • Embed widget type. (26093)
    • Add widget type endpoint. (26042)
    • Make edit-widgets package public. (26016)
    • Uncollapse widget area when block is dragged over. (25992)
    • Add meaningful labels for the Widgets screen ARIA landmarks. (25867)
    • Load custom block assets. (25826)
    • Test for storing raw htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. in widgets. (24886)

New APIs

  • Make block supports server-side explicit. (26192)
  • New hook: UseDebounce for speak function. (25948)
  • Make the custom spacing theme support flag and block support API stable. (25788)
  • Mark the line height support flag as stable. (25769)
  • Mark the font size support flag as stable. (25695)
  • Mark the color support flag as stable. (25694)
  • Add a button to allow resetting the ComboboxControl value. (25692)
  • Block API: Light block edit/save symmetry. (25644)
  • Block API: Stabilize light block hook. (25642)
  • Inner blocks: Try hook approach. (25633)
  • API: Stabilize localAutosave() as autosave( { local: True } ). (20149)

Experiments

  • Query Block:
    • Add Custom Post Types support in Query block. (25903)
    • Set focus on Query block on insertion. (26267)
    • Add loading message to Query block while fetching results. (26199)
    • Add no results placeholder in Query block. (25984)
  • Site Editor:
    • Clear the active menu state when closing the sidebar. (25957)
    • Add missing localization to the templates sidebar. (25897)
    • Mount both wp_template and wp_template_part EntityProviders to avoid remounting. (25870)
    • Navigation templates. (25739)
    • Update Navigation Panel Toggle UI. (25622)
    • Move page switcher to navigation panel. (25620)
    • Add template switcher to navigation panel. (25615)
    • Pass editor features dynamically. (25795)

Bug Fixes

  • Fix for current_parsed_blocks value when block has inner blocks. (26291)
  • Fix updating clientId mapping. (26290)
  • Fix typo in wrapper attributes. (26282)
  • Fix: Keep the ‘Insert from URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org’ entered value on ImagePlaceholder. (26262)
  • Fix align order in heading block. (26260)
  • Widgets screen: Add a 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. function to registerCoreBlock. (26259)
  • Use ToolbarButtons instead of Buttons in the Legacy Widget block’s toolbar. (26258)
  • Widgets screen: Add "Browse all" option to the inserter. (26256)
  • Fix: Post schedule label showing wrong time if site and user timezones did not match. (26212)
  • Fix Site Title block’s heading levels appearance. (26202)
  • Writing flow: Fix in-between inserter for aligned blocks. (26197)
  • Fix Site Tagline block’s text alignment. (26191)
  • Fix separator and spacer blocks after api v2 refactoring. (26157)
  • Global Styles sidebar (blocks tab): Protect against not registered blocks. (26149)
  • Block templates: Recognize and convert old or derivative block types to their canonical form. (26147)
  • Fix editing Legacy Widgets doesn’t enable "Save" button. (26144)
  • Fix Cover width 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.. (26143)
  • Fix tabbing in widgets not triggering auto-scrolling. (26139)
  • Cover block: Improve overlay opacity handling. (26133)
  • Fix icons type annotation. (26129)
  • FullscreenMode: Remove the is-fullscreen-mode CSSCSS Cascading Style Sheets. class from body on unmount. (26103)
  • Make sure Global Styles CPT includes a theme reference. (26061)
  • Restrict legacy widget block to only being a child of widget area. (26053)
  • Fix/wrong classes search block. (26052)
  • Fix drag and drop in empty widget area. (26051)
  • Fix unit tests by updating cover block fixtures. (26044)
  • Upgrade autoprefixer to fix fit-content in firefox. (26019)
  • Fix widget area title font. (26018)
  • Widgets screen: Fix WP Adminadmin (and super admin) Bar Widgets screen link. (26015)
  • Hide parent selector in widget area. (26011)
  • Document Actions: Fix unexpected label wrapping. (26004)
  • Fix template part theme identifier. (25995)
  • Show all widget areas on widget screen. (25977)
  • Fix block editor example in storybook. (25976)
  • Fix 9:16 aspect ratio styling. (25972)
  • Fix gallery caption not centered in the front-end issue. (25962)
  • Widgets screen: Add save keyboard shortcut. (25944)
  • Widgets screen: Remove default hover background in panel title. (25939)
  • Fix failing previews end-to-end test. (25938)
  • Fix input control drag and box control change. (25933)
  • Fix end-to-end tests related to template parts. (25923)
  • Fix insertion indicator margin. (25893)
  • Fix blue line indicator not showing at the end. (25849)
  • Fix incorrect attribute type specified in Search block. (25813)
  • Document Actions: Fix Block Editor Inserter Overlap with Document Titles. (25801)
  • Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 warning in widget utils REST controller. (25797)
  • Include edit-widgets php files in build. (25792)
  • Docs: Fix typo in GitGit Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/. Workflow. (25779)
  • Widgets screen: Fix widget-area 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). (25732)
  • Widgets screen: Fix insertion point in widget areas. (25727)
  • Document Settings: Fix document title hover and select animations. (25719)
  • Define text color for warning message component. (25713)
  • RichText: Remove native props for web. (25700)
  • Use h3 in the legacy widget title. (25690)
  • Navigation block: Use unbounded query when requesting top level pages. (25689)
  • Document Actions: Fix document title misalignment with an open nav sidebar. (25630)
  • Fix ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. error in wordpress/block-editor documentation usage example caused by applying args to setState call. (25492)
  • Cover Block: Show spinner while uploading. (25401)
  • Button block: Reduce chance of style conflicts. (24919)
  • Fix skipped 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. transforms in raw handling. (22840)
  • Media links: Fix linking for images inserted from URL. (22195)
  • Refactor reusable block edit component using hooks (and fix interactions with multiple instances of the same reusable block). (21427)

Performance

  • Paragraph: Avoid selector to improve performance. (26150)
  • Remove transition on block selection indicator. (25974)
  • Widgets screen: Preload request to /sidebars. (25726)

Documentation

  • Bring the block-based theme tutorial up to date. (25830)
  • Add more CI status badges to README. (26090)
  • Getting started: MAMP: Add tip to fix WP-CLIWP-CLI WP-CLI is the Command Line Interface for WordPress, used to do administrative and development tasks in a programmatic way. The project page is http://wp-cli.org/ https://make.wordpress.org/cli/. (26057)
  • Update colors readme with additional definitions. (25954)
  • Document isMultiBlock param for block transforms. (25952)
  • Update CI status badge in README. (25907)
  • Adds missing Curly brace. (25748)
  • Add documentation for colors component. (25567)
  • InspectorAdvancedControls: Add README.md. (25566)
  • Add documentation for useResizeCanvas. (25558)
  • Add/block navigation component readme. (24882)
  • Update Block Based Themes Documentation. (25710)

Code Quality

  • Pass all extra attributes down in get_block_wrapper_attributes. (26280)
  • Editor: Refactor PostFormatPanel to use React hooks. (26273)
  • BlockListBlock: Reduce passed props. (26251)
  • Editor: Refactor PostFormat to use React hooks. (26238)
  • Latest posts: Use hooks + API v2. (26122)
  • Latest comments: API v2. (26113)
  • Categories block: Use API v2. (26112)
  • Rename ReusableBlocksButtons to ReusableBlocksMenuItems. (26099)
  • Reusable block: Use API v2. (26091)
  • Gallery block: Use hooks. (26088)
  • Pullquote block: Use hooks + API v2. (26068)
  • Components: Start adding types progressively. (26066)
  • File block: Use hooks + API v2. (26063)
  • HTML block: Use hooks and API v2. (26055)
  • Update all blocks to API v2. (26054)
  • editor: Remove two unused registry controls. (26048)
  • Tweak styles of the document actions area. (26038)
  • Site Editor: Navigation panel replace hardcoded menu strings with constants. (26026)
  • Move left sidebar state to redux. (26003)
  • Refactor Categories to function component. (25806)
  • Classic block: Use hooks. (25737)
  • Remove animation from mover buttons. (25728)
  • Move widget-area to edit-widgets. (25673)
  • InnerBlocks: Add select dependencies. (25672)
  • Refactor Buttons block native edit component to use hooks. (25636)
  • Data: Build the basic data controls into every store. (25362)
  • Block Editor: Use optional chaining and nullish coalescing instead of Lodash.get. (23632)
  • Refactor Latest Comments block to use function component. (23557)
  • WordCount: Add types. (22077)

Security

  • PostCSS Plugins Preset: Update vulnerable dependency. (26140)

Breaking Change

  • Add separate widgets endpoint. (25958)

Various

  • Stabilize batching endpoint as v1. (26295)
  • Make batch opt-in more expressive. (26292)
  • Remove experimental sidebars endpoint shim. (26288)
  • Warn about using core/batch-processing store. (26287)
  • Remove WP_REST_Widget_Utils_Controller class. (26274)
  • Minor iterations to grouping for preferences panel. (26198)
  • Allow transform to Columns from a single block. (26185)
  • Use batch processing in edit-widgets package. (26164)
  • Minor updates to wordpress/edit-widgets for easier Core integration. (26136)
  • TextareaControl: Use CSS-in-JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors.. (26131)
  • Add template lock attribute to column and group. (26128)
  • Reusable blocks support for widgets editor. (26097)
  • Bump @actions/core from 1.0.0 to 1.2.6. (26087)
  • First pass at using the new sidebars and widget endpoints. (26086)
  • Don’t rely on the exact count of registered widgets. (26085)
  • Try: Make class and style tests less brittle. (26079)
  • Components: Remove size prop from Dashicon. (26067)
  • Adjust media-text attributes to default stacked on mobile to true. (26041)
  • Support batch requests in data layer. (26024)
  • Fallback for dropcap when experimentalFeatures is not present. (25979)
  • Social Links: Update Placeholder experience when first inserting Social Links. (25941)
  • Check that get_current_screen is callable. (25935)
  • Social Link: Rename mail to email. (25924)
  • Autocomplete: Use hooks. (25922)
  • Skip broken template-part end-to-end test until it can be fixed. (25918)
  • Heading block: Add wide and full width options. (25917)
  • Social Links: Avoid conflictconflict A conflict occurs when a patch changes code that was modified after the patch was created. These patches are considered stale, and will require a refresh of the changes before it can be applied, or the conflicts will need to be resolved. with themes ul text-indent. (25916)
  • Site editor: Store navigation panel’s active menu state in the store. (25906)
  • Version bump to 9.1.1. (25904)
  • Export and document LinkControl’s building blocks. (25901)
  • Prevent networknetwork (versus site, blog) requests related to ephemeral posts in the widgets editor. (25899)
  • FSE Navigation Sidebar: Move navigation sidebar in DOM hierarchy. (25884)
  • Template part selection component – fix keyboard controls. (25881)
  • FSE Document actions – wrap with heading. (25874)
  • Extract wordpress/reusable-blocks from wordpress/editor. (25859)
  • Unify help description text styling. (25852)
  • BaseControl: Use CSS-in-JS. (25842)
  • Iterations on options modal. (25837)
  • BlockSelectionClearer: Use hooks. (25824)
  • Update pull request documentation URLs. (25815)
  • Add a dark mode to the post title. (25796)
  • Automatically generate required preset classes. (25768)
  • Ensure focus of input when InputControl spinner arrows are pressed. (25753)
  • External Link: Use CSS-in-JS. (25751)
  • Update improve backward compatibility for deprecated settings. (25738)
  • Initialize the state before rendering widgets editor. (25736)
  • Add color palette edit functionality to global styles. (25711)
  • UnitControl: Enable keyboard access (via tab) to unit select by default. (25704)
  • Add EditorStyles CSS to the widgets editor. (25699)
  • Display before_widget/after_widget when rendering WP_Widget_Block. (25693)
  • Remove the right margin for the right-most list items in the lastest posts block. (25688)
  • Update and move some Query filters. (25674)
  • Remove duplicate key from tsconfig.base.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.. (25664)
  • Try adding a ‘spotlight mode’ type effect when template part or child is selected. (25656)
  • Gallery: Add labels to img, figure and figcaption elements for accessibility. (25560)
  • Navigation component: Add back button click handler. (25556)
  • Hide the quick side inserter when the user is typing. (25548)
  • Add border to block "Edit as HTML" style. (25539)
  • Show PostFeaturedImage in editor. (25412)
  • Don’t allow duplicate selectors in styles. (25399)
  • Gallery: Add a margin declaration. (25291)
  • Page parent selector with ComboboxControl. (25267)
  • Add Align support to Separator block. (25147)
  • 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/.: Introduce batch controller. (25096)
  • Upgrade TypeScript to v4. (24892)
  • Use UnitControl instead of RangeControl for column width. (24711)
  • Add UI tests to unsupported block editor. (23729)
  • Add a description to the Site Title block. (23462)
  • Add storybook story for the FocusableIframe component. (22324)

Performance benchmark

VersionLoading TimeKeyPress Event (typing)
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/ 9.25.1s31.29ms
Gutenberg 9.15.3s31.03ms

Kudos to all the contributors that helped with the release! 👏

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

What’s new in Gutenberg? (30 September)

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/ 9.1 is out with almost 200 commits and 77 contributors! The main focuses for this release are iterations on the main projects for WordPress 5.6: the Widgets Screen and 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. 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..

Important progress has been made on the Global styles project with the possibility to use the 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. config file to control the block editor features and presets (color palette, font sizes, enabling/disabling features).

Also, the release includes some nice little improvements to the UIUI User interface and several blocks. Among these changes, the block patterns are now organized per categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. in the block inserter to help navigate the list of available patterns.

9.1 🇲🇹

Features

  • Add “open in new tab” feature to Social Links Block. (25468)
  • Add Image Size control to the Media & Text block. (24795)

Enhancements

  • Inserter: Add block pattern category selection. (24954)
  • Reduce minimum height to 1px for the Spacer block. (25528)
  • Show the Fullscreen keyboard shortcut. (25395)
  • Improve the Audio block 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. transform to account for all sources. (25114)
  • Code block: Allow HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. editing & rich text content. (24689)
  • Remove appender from unselected Buttons and Social Icons block. (25518)
  • Widgets Screen:
    • Match the post editor inserter design. (25681)
    • Register legacy widgets as block variations. (24905)
    • Use the default block list appender for the widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. (25635)
    • Add titles to Legacy Widgets. (25638)
  • Buttons block: Lighten editor DOM. (23222)
  • Copy: Reword block settings menu item labels. (22955)
  • Add a tooltip to the Drag & Drop handle. (25606) (25614)
  • A11yAccessibility 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):
    • Add aria-haspopup property to the BlockNavigation component. (25605)
    • Add aria-haspopup property to the TableOfContents component. (25603)
    • Add aria-haspopup to the ToolSelector. (25600)
    • Add aria-haspopup to the MediaReplaceFlow button. (25597)
    • Add aria-haspopup attribute to CustomGradientBar component. (25571)
    • Add aria-haspopup to CircularOptionPicker component. (25564)
    • Add aria-describedby to featured-image button. (24888)
  • Don’t show heading ancestor blocks in Document Outline. (25599)
  • Support the default link config for the Gallery and Image blocks (image_default_link_type). (25578) (25582)
  • Social Icons Block: Let icons wrap. (25334)

New APIs

  • Add new ComboboxControl. (25442)
  • Data Controls: Add new syncSelect control. (25336)
  • DateTimePicker: Add support for highlighting days. (22032)

Bug Fixes

  • Widgets Screen:
    • Auto expand the last selected widget area when opening the inserter. (25669)
    • Ensure all widgets are properly initialized when they’re added, do not unmount widgets once they’re mounted. (25645)
    • Fix Legacy widget block previews and use iFrames. (25443) (14643)
    • Report save errors. (25408)
    • Fix global inserter. (24908)
  • Fix RangeControl direct entry in input field. (25609)
  • A11y:
    • Fix the color contrast in the code editor. (25593)
    • Fix Publish 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. Cancel button not usable through screen readers. (25441)
    • Fix keyboard navigation on the Image block toolbar. (25127)
    • More block: Use an actual placeholder for input text. (23836)
  • Fix nested container smart margins. (25527)
  • Fix add_filter instead of apply_filters. (25512)
  • Fix the WordPress embed preview in the editor. (25370)
  • Remove Embed block aspect ratio classes on url change. (25295)
  • Remove duplicate help item. (25283)
  • Fix Block Directory author average rating formating. (24732)
  • wordpress/api-fetch:
    • Fix preloading middleware referencing stale data. (25550)
    • Check nonce headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. value before skipping adding it. (25458)
  • Use esc_html instead of esc_attr in the Archives block. (25476)
  • Fix Canceling Drag and Drop using ESC key. (25317)
  • Cover block: Add explilcit box-sizing style. (25115)
  • Use a ComboboxControl for the post author selector to fix loading issues for sites with a big number of authors. (23237)

Performance

  • Avoid relying on DOM events to measure the loading time. (25288)

Experiments

  • Site Editor Screen:
    • Fix wrong close label in the block inspector. (25424)
    • Add basic template information to editor header. (25320)
    • Fix the footer styling. (25152)
    • Add a reset button to global styles sidebar. (25426)
    • Show document subtext if template part child is selected. (25544)
    • Add navigation panel. (25506)
    • Fix site base URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org. (25409)
  • Post and Site Blocks:
    • Add link option in PostTitle block. (25341) (25397)
    • Register the Site Logo block using register_block_type_from_metadata. (25289)
  • Themes and global styles:
    • Support defining colors and gradients config from theme.json. (25419)
    • Support defining font sizes config from theme.json. (25516)
    • Support custom units on theme.json. (25217)
    • Add separate support keys for color and background color. (25314)
    • Allow themes to enqueue custom CSSCSS Cascading Style Sheets. variables via theme.json. (25446) (25619)
    • Refactor theme.json format. (25301) (25407)
    • Update theme json documentation to account for latest changes. (25369)
  • Block API: Introduce useBlockWrapperProps hook to use light block DOM in the editor. (23034) (25679) (25554) (25515)
  • Navigation block and screen:
    • Handle block menu items. (24846)
    • Avoid auto-focusing Navigation block in Navigation screen. (25592)
    • Change the block description. (25531) (25555)
    • Allow Social Links within Navigation Block. (25357)
    • Wrap navigation editing features with filters. (25329)
    • Add move markers to list view. (25205)
  • Iterating on the Navigation Component (25608) (25495) (25572) (25540) (25520) (25507) (25367) (25364) (25340) (25327) (25281) (25280)

Documentation

  • Add a data format and flow architecture document. (25299)
  • wordpress/env: Add documentation for inspecting the docker compose file. (25666)
  • Add new block supports page to the handbook. (25647)
  • Block Directory: Add developer documentation. (25591)
  • Move custom-fields note to the ‘Register 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. Field’ documentation. (25584)
  • Add Block Editor Components documentation:
    • AlignmentToolbar (25210)
    • BlockFormatControls (25573)
  • Add Caveats section for MAMP. (25444)
  • Add FormTokenField story. (25439)
  • Improve documentation for the data registry control and selector creators. (25335)
  • Update git workflow documentation. (25164)
  • Refresh the Getting Started guide. (25090)
  • Update 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/. troubleshooting guide. (24105)
  • Enhance the Block Context documentation. (25272)
  • Typos: (25359) (25653)

Code Quality

  • Update the Dashicon component to rely on the font that ships with WordPress. (20003)
  • Add new $gray-200 SASS variable and use for skeleton borders. (25491)
  • Block Editor: Remove empty module focus-detector. (25561)
  • Image block: Avoid remounting to focus caption. (25493)
  • Add explicit boxSizing style to Placeholder component. (25463)
  • Remove classic block code used to support WP 4.9. (25365)
  • Add RichText value type definition. (25363)
  • Avoid global DOM dependencies. (25332)
  • Use controls from the Data Controls package instead of local ones. (25235)
  • RichText: Simplify withFormatTypes as hook. (23145)
  • Video block: 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.. (25513)
  • Remove wp_area custom post typeCustom Post Type WordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept.. (25497)
  • 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.: Remove redundant condition. (25490)
  • Move legacy-widget block over to edit-widgets package. (25371) (25404)
  • Don’t use percent units for line-height. (25398)
  • Change wording and names to not include “whitelist”. (25396)
  • Don’t discard all promises results when one of them rejects. (25302)
  • Block Directory: Switch to blocks.registerBlockType 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.. (25264)
  • Fix some javascript warnings. (24996)

Various

  • Remove the Block-based widgets editor from 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.. (25626)
  • Cover block: Remove default position (center/center) className from rendering. (25346)
  • Fix the default label position in SelectControl. (25427)
  • DropdownMenu tooltip default to true. (25391)
  • Pass block pattern name when using replaceBlocks and insertBlocks. (25165). (25433)
  • Babel Preset: Update Babel version to 7.11.x. (25351)
  • InputControl: Remove floating label variant. (25308)

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.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 9.16.9s29.04ms
Gutenberg 9.06.5s29.19ms
WordPress 5.56.5s28.01ms

Kudos for all the contributors that helped with the release. 👏

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

Editor chat summary: Wednesday, 16 September 2020

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, September 16, 2020, 14:00 UTC.

Thank you to all of the contributors who tested the BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. releases and gave feedback. Testing for bugs is a critical part of polishing every release and a great way to contribute to WordPress.

WordPress 5.6

Project board to track issues for inclusion in WordPress 5.6.

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/ 9.0

Gutenberg 9.0 was released on 16th September: 

Monthly Plan

September Monthly Priorities.

Updates on the key projects

@andraganescu

  • Both the navigation editor and the widgets editor need all the help they can get. The current target to get the Navigation editor out of experimental is Gutenberg 9.1, and if not it will not make it into WP 5.6 due to too little time for testing and consideration before beta 1
  • The work continues on the widgets editor with a lot of feedback since it was removed from experimental 
  • More details can be tracked on project boards for Navigation editor and Widgets editor

@ntsekouras

  • There is some ongoing work on Query 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. and here is where design is discussed/iterated: https://github.com/WordPress/gutenberg/issues/25198.Since there are many things to consider, feedback is more than welcome.

@nosolosw

There’s been some momentum around the Global Styles project lately (with Jorge, Riad, myself, and others working on this), these are the highlights:

  • Gutenberg 9.0 is the first to come with a UIUI User interface for users to update the theme styles (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. at the site editor).
  • Most of the add_theme_supports have been ported to theme.json  allowing themes to have more fine-grained control about the features.
  • There’s been a reorganization of the 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. (docs) to better clarify its purpose.
  • Discussion on allowing creating your own CSSCSS Cascading Style Sheets. variables via Global Styles

Task Coordination

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.

@ntsekouras

  • Added search in Query block
  • Added option to make PostTitle block a link
  • Fixed aspect ratio related classes on embed block
  • Reviews, issues, and triaging

@zieladam

  • Fixed global inserter in widgets editor
  • Moved legacy-widget block to edit-widget package
  • Working on registering widgets as block variations

@nosolosw

  • I’ve been helping others land features related to theme.json (reviews), plus landed some bugfixes and minor follow-ups related to that.

@mcsf

  • Added tiny improvements to Gallery block, ID-less shortcodes fall to 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. block
  • Discuss server-side solutions for block-supports
  • Discuss global styles architecture
  • Release 8.9.3
  • Explore dynamic content solutions for FSE templates
  • Reviews

@addiestavlo

@soean

@mapk

  • Query block iterations
  • WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor feedback and followups

@andraganescu

  • I’ve picked up some issues from Navigation
  • Wrap navigation editing features with filters
  • Added edit in place for menu name

@vindl

@itsjonq

  • Continue to explore/refine Component 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. / style ideas in G2 Components
  • Lately, been focused on the figuring out structure details for control variations that render within Gutenberg via this G2 Layouts/Segmenting controls thread

@aristath

  • I’ve been working on FSE & Global styles, trying to build a theme as a way to discover issues and fix them. Lots of PR reviews, I’ll start working on the Query block next since I’m finding things as I go.

@annezazu

  • Launched the guide for devs navigating the community
  • Focusing on triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. and testing this week to get back up to speed on the latest!

@copons

  • The main focus on the new Navigation component.
  • I’ve recently merged the initial PR which is not used anywhere yet and is exported as experimental.
  • The interface is in active development and will change a lot, though; while it works, it’s really not supposed to be used yet.
  • Meanwhile, it can be tested in the Storybook.
  • I’ve opened several issues for the next steps and discussions about style and accessibility.
  • Once the component is polished and fine-tuned enough, the plan is to start using it as template selector in the Site Editor

@jorgefilipecosta

  • Updated the global styles setProperty mechanism and solved an issue that made custom gradients not work on global styles
  • Refactored the global style’s shape
  • Added separate support keys for color and background-color
  • Continued the iterations on the font-family and font-weight PR’s
  • Did some PR’s reviews and participated in discussions around the repository

Open Floor

@jonsurrell

Some discussion around more descriptive post title for “The Gutenberg Release notes”. suggestion to add the 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 version for more clarity. There was no decision and further discussion for same to be done before next release post.

@pierlo

Asked if extending the external preview links dropdown would be included for WP 5.6. A PR is in the work which should very likely be merged well before the 5.6 beta begins 20th October.

@aristath

Some discussion around Query block to inherit default from the global query and allow the user to customize them as needed. This will avoid overriding the global query and replacing loops. No decision, to be discussed further.

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

What’s new in Gutenberg? (16 September)

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/ 9.0 is out! The main focuses for this release are improvements to the Navigation Screen and to the Query 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..

The Navigation screen has a new and improved look, and now supports drag and drop inside the list view:

Lots of cool features have been added to the Query block, including search, filtering by author and support for tags. Here are some pics of the updated interface:

9.0

Features

  • Query block:
    • add search. (25222)
    • add filtering by author support in Query block. (25149)
    • add order and order by support. (24691)
    • add tags support. (25005)
  • Navigation screen:
    • add drag and drop to List View. (23952)
    • implement redesign of screen. (25178)
    • add support for advanced menu item properties. (25062)

Enhancements

  • Drag&Drop: add drag handle to block toolbar. (24852)
  • Drag&Drop: improve single block case. (25107)
  • Include the block variations on the inserter selector. (25182)
  • List view styling improvements. (25143)
  • Update pencil icon. (25135)
  • Refactor and make consistent post and site headers. (25134)
  • Limit the block slash inserter to 9 items and show most used by default. (25113)
  • Polish menu item icon locations. (25106)
  • Improve the block and patterns search algorithm. (25105)
  • Template part: attribute feature parity with group block. (25029)
  • Allow sharp gradients. (24967)
  • Post content: show placeholder if trying to render itself. (24010)
  • Add reusable block icon. (23552)
  • Let ID-less gallery shortcodes fall to 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. block. (25144)
  • Mirror 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 install text for blocks. (25084)
  • Allow inserting an h1 using # + space. (25075)
  • Widgets screen: add plugin area. (25074)
  • Add title attribute to Navigation Link block. (24993)
  • Add a way to change template parts. (24990)
  • Transform multiple heading blocks to list or paragraphs. (24977)
  • Remove redundant type badges in navigation link control. (24885)
  • Fix multiple trailing inserters for nested InnerBlocks. (24836)
  • Search Block: Add button, label, and width options. (24666)
  • Display labels instead of icons in top toolbar. (24304)
  • Add option to show icon labels. (24234)
  • Add a "reinstall" button when a block type is not found. (22631)

Bug Fixes

  • Template part: fix rename before customize 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.. (25206)
  • Template part: fix auto-drafting to support sub-directories. (25063)
  • Template part: use cleaned slug to query. (25030)
  • Classic block: optional chain on possibly null editor. (25163)
  • Classic block: show contents on load. (25162)
  • Embed Block: Fix crash in isFromWordPress helper if preview.htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. is false. (25140)
  • Cover block: fix width 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.. (25103)
  • Navigation block: reduce subnavigation arrow padding. (24200)
  • GlobalStyles: fix nested features algorithm. (25215)
  • GlobalStyles: fix settings name. (25040)
  • Widgets screen: convert the toolbar to ARIA toolbar. (25111)
  • Widgets screen: add labels for settings and close button. (25101)
  • Navigation screen: fix creating Navigation from pages or menu with HTML in title. (24673)
  • Element: add and upgrade @types/{reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.,react-dom} dependencies. (25086)
  • Add safeguard to AuthorSelect component until authors are fetched. (25214)
  • Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 error when users don’t have access to the Appearance menu. (25073)
  • Polish horizontal movers. (25037)
  • Fix PHP Notice: Check that the query arg exists before using it. (25006)
  • Fix gradient swatches stacking badly with scrollbar. (25002)
  • Fix unlinked padding controls JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. error. (25000)
  • Show external icon on help button. (24622)
  • Check if block attributes exist before splitting. (25229)
  • Revert "InnerBlocks: Introduce prop to specify render callback for each block.". (25196)
  • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Data: Bring back support for nested _fields values. (25083)
  • Prevent TypeError for projects without a local Prettier configuration. (25068)
  • Image Block: Properly show errors on drag n drop. (25004)
  • Add block inspector virtual bubbling option. (24991)
  • Remove extra slash from $block_json_file. (24829)
  • Inserter: Test to make sure the Inserter menu is closed. (24610)
  • Date: Update moment-timezone package to support string timezones. (22866)
  • Fix enqueue presets for global styles. (25286)
  • Fix stylesheet generation. (25293)

Experiments

  • Group block: add padding support. (24966)
  • Control the block editor via 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.:
    • support for custom link color. (25148)
    • support for custom spacing. (25141)
    • support for custom line heights. (25043)
    • support for custom font sizes. (25038)
    • support for custom gradients. (24964)
  • Navigation component: composition proposal. (25057)
  • Replace accessibilityLabel by label on RadioGroup. (25128)
  • Global styles:
    • add 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. at edit site screen. (24250)
    • print minified css. (24924)
    • centralize style & support mappings for blocks. (25185)
    • centralize client side global styles mappings. (25056)
    • set property to change one property accept all lodash paths. (25159)

Documentation

  • Add readme for UngroupButton. (25142)
  • Fix typo in AlignmentMatrixControl readme. (25125)
  • Update AlignmentMatrixControl readme. (25124)
  • Add preview options component readme. (25104)
  • Add block types list component readme. (25066)
  • Fix typo in block base themes tutorial URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org (25024)
  • Update block inspector component readme. (24998)
  • Add block variation picker component readme. (24995)
  • Update Versions in WordPress doc to include 5.5.1. (24988)
  • Add block parent selector component readme. (24962)
  • Add block icon component readme. (24947)
  • Update dev environment setup. (24871)
  • Correct since version for block parser package. (24819)
  • Add BlockCard component readme. (25150)
  • Fix link to ubuntu docker notes. (25060)
  • Fix/block parent selector component readme. (24997)
  • Update Storybook URL from text to a real link. (24974)
  • Update triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. doc to include pull request mentions. (23105)

Code Quality

  • Repo: Add .gitattributes to specify text=auto. (25224)
  • Block Directory: Use Array.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. to implement new/unused block selectors. (25211)
  • Data: Remove flowRight call from metadata reducer. (25180)
  • Data: Add a comment about why we normalize resolvers to objects with fulfill method. (25102)
  • Api-fetch: Remove redundant next parameter from middleware calls. (25001)
  • Api-fetch: Simplify the code that executes the handlers. (24999)
  • Block Supports: Ensure consistent output in different PHP versions. (25240)
  • Add regression end-to-end test for the classic block initialization issue. (25169)
  • Update or retire deprecated colors. (25213

Build Tooling

  • Env: Update docker volumes during wp-env start. (24778)

Various

  • Update package-lock.json. (25223)
  • Update gradle-node-plugin to use actively maintained fork. (25208)
  • Bump @storybook/react major version. (25161)
  • Use WordPress Menu 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.. (25132)
  • Update modularity.md. (25007)
  • Remove Embeds for Facebook and Instagram. (24472)

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.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 9.06.96 s28.99 ms
Gutenberg 8.96.97 s28.98 ms
WordPress 5.56.97 s27.54 ms

Kudos for all the contributors that helped with the release. 👏

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

What’s new in Gutenberg? (2 September)

The big focuses throughout this release cycle were full site editing (FSE) and the widgets screen. On the FSE front, multiple FSE blocks were implemented and are now available for testing in the FSE experience (“Site Editor”). With regards to the widgets screen, more details are shared below.
Aside from these two focuses, 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/ 8.9 contains some small new features, multiple 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, and some performance improvements.

Widgets moved out of experiments

One of the objectives of WordPress 5.6 is to allow using blocks in widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. This is a complex task, and for now there is no decision on whether the new screen should be available for all users or a subset of users. Your feedback may help weigh the options.

In Gutenberg 8.9, 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.-based widgets screen is enabled by default and replaces the default WordPress widgets screen. Themes and plugins are able to opt out of this screen by calling remove_theme_support( 'widgets-block-editor' ) or by using the gutenberg_use_widgets_block_editor filter respectively.

Your testing, feedback, and insights are very useful to inform the direction of the next iterations. If you come across any bugs, please submit a new issue in the Github repository.

8.9.0 🇧🇯

Features

  • Enable the block-based widgets screen. (24843), (24087)
  • Add character count to the info panel. (24823)
  • Latest Post Block: Allow adding links to featured images. (24548)
  • List block: Add color controls. (21387)

Enhancements

  • Disable the tools menu while the code editor is enabled. (24923)
  • Add picture keyword to the Image block. (24755)
  • Adding a maximum height to the long blocks previews. (24493)
  • Add “read more” keyword to the More block. (24794)
  • Improve the UXUX User experience of inactive widgets area on the widgets screen. (24790)
  • Trim whitespace from rendered widgets. (24789)
  • Block Directory: Explicitly close the inserter on block add. (24709)
  • Make strings translatable in block patterns. (24647)
  • Improve the UIUI User interface of the custom gradient pickers. (23802)
  • Adds suggestions for categories and formats to link controls. (22600)
  • Clarify the font size control label. (24619)
  • Convert all px values in front-facing styles to relative (em) units. (24523)

Bug Fixes

  • Fix infinite 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. in the Disabled component. (24935)
  • Fix wp-env start for non-english WordPress coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. sources. (24884)
  • 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. HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. structure on the widgets screen. (24866)
  • Fix 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. flickering caused by the block preview border. (24739)
  • Don’t use an offset when dragging using a draggable chip. (24707)
  • Fix Image alignment controls styles in the Latest posts block. (24655)
  • Improve the focus state of the tags control remove button. (24632)
  • Fix Crash after undoing with the top toolbar on. (24629)
  • Avoid double borders on the 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. boxes panels. (24627)
  • Fix Inline text-color regex edge-case. (24621)
  • Fix inserter z-index. (24614)
  • Missing selected block highlighting in the list view. (24609)
  • Fix the Pullquote block text color after unsetting the main color. (24600)
  • Fix style specificity for Button blocks with outline style and background colors. (24599)
  • Remove references to $default-font from front-facing styles. (24567)
  • Center-align the block variations buttons. (24547)
  • Fix categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. select in QueryControls component. (24516)
  • Image Block: Prevent Alt and caption written during image upload from being discarded. (24471)
  • Correct the Unicode character used to represent the macOS Control key. (24452)
  • Fix undefined $block_type->supports PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 error. (24411)
  • Fix adminadmin (and super admin)-theme colors in the editor canvas. (24408)
  • Limit the number of fetched tags to avoid infinite queries. (23841)
  • Fix error when inserting 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.) with an apostrophe. (21693)
  • Fix the alignment of the trashTrash Trash in WordPress is like the Recycle Bin on your PC or Trash in your Macintosh computer. Users with the proper permission level (administrators and editors) have the ability to delete a post, page, and/or comments. When you delete the item, it is moved to the trash folder where it will remain for 30 days. post button. (24889)
  • Make legacy widgets support for non-class-based widgets. (24861) (24792)
  • Remove WP_Widget_Block from the legacy dropdown list. (24787)
  • Fix isSavingWidgetAreas selector. (24788)
  • Inserter: Update the search form placeholder text when changing tabs. (24697) (24802)
  • Avoid lossy HTML entities encoding by setting charset. (24645)
  • Embeds: Don’t transform into specialized embed block variation if it’s not registered. (24559)

Performance

  • Fix getBlocks selector performance issues causing typing lags on Gutenberg 8.8.0. (24835)
  • Preload widgets on the widgets screen. (24855)
  • Only request the required fields to populate the parent page list. (23637)

New APIs

  • Core Data: Implement _fields data reuse for entities. (19498)

Experiments

  • Site Editing: Blocks
    • Add Post Comment block. (24781)
    • Add Post Comment Date block. (24854)
    • Add Post Comment Author block. (24824)
    • Add Post Hierarchical Terms Block. (24091)
    • Adds icons and descriptions to Post blocks. (24603)
    • Make Site title block render a link. (24725)
    • Add heading level toolbar to the Site title block. (24758)
  • Site Editing: UI
    • Alert when trying to leave the Site Editor with unsaved changes. (24659) (24719)
    • Update Template Part Block Placeholder Button Styles. (24633)
    • Template Part block – add border states in the editor. (24498)
  • Global Styles and 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. APIs:
    • Allow enabling/disabling custom colors from theme.json config. (24761) (24932)
    • Rename features.colors to features.color. (24933)
    • useEditorFeature: Take block context into account. (24416)
  • Navigation block and screen:
    • Add Post, Page, Category and Tag variations to Link. (24670)
    • Add block inspector to nav screen. (24669)
    • Add opt-in Navigation block rendering. (24503)
    • Support drag-and-drop for submenus of navigation blocks. (24479)
    • Fix invalid textarea markup. (24641)
    • Add unit tests for edit-navigation store. (24681)

Documentation

  • Document Components
  • Update tutorial Creating a block-based theme. (24736)
  • Correct BoxControl values in README examples. (24717)
  • Add ToggleControl at related components section in FormToggle documentation. (24636)
  • Typos and tweaks: (24857), (24811), (24695), (24650), (24628).

Code Quality

  • Keep the default color CSSCSS Cascading Style Sheets. variables for npm package consumers. (24890)
  • Refactor components as functional components:
  • Refactor and move drag and drop geometry code. (24715)
  • Only update state if we have a valid reference. (24496)
  • Add state for storing dragged block client ids to block-editor store. (24782)
  • Remove commented-out blank line. (24858)
  • Simplify gutenberg_widgets_init when $hook === ‘widgets.php’. (24793)
  • Refactor block drop event handlers into a single hook to support drag and drop in List View. (24649)
  • Move DOM utility functions from wordpress/blocks to wordpress/dom. (24618)
  • Fix ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. warning on text color formatter. (24686)

Build Tooling

  • Update package lock file. (24815)
  • Update the minimum version and the tested up to flag of 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. (24693)
  • Build: Make the watch rate slower to avoid using a lot of CPU while developing. (23998)
  • Fix Performance Tests on CI. (24925)
  • Add tests for slashing behavior. (24785)
  • Add permissions PHPUnit tests. (24784)
  • Update browserlist dependency. (24756)
  • Allow local Prettier configuration to take precedence in the recommended ESLint configuration. (24590)

Performance Benchmark

Gradual changes in the editor have made its rendering pipeline more asynchronous. As a result, the usual metrics (loading time, typing time) that we collect in the performance benchmarks may have not always represented the performance gains and losses experienced by some users.

We are improving the way times are measured to account for the more async nature of the editor rendering. We will update this post with performance results once we are confident that they accurately measure the performance of the editor.

The synchronicity changes in question only affect Gutenberg 8.8 and 8.9.
The numbers shared for previous releases are still an accurate way of measuring the editor’s performance.

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

What’s new in Gutenberg (August 19)

With the release of WordPress 5.5 (🎉) comes a new release of 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/! Gutenberg 8.8. Contributors have continued to squash bugs, refine experiences, and make progress on several big projects.

Full site editing has progressed with updates to Global Styles, the Post 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. suite, and Template management. The back-compatibility of the new Widget Screen was improved. The Widgets screen is a project that’s part of a wider effort to add more block enabled sections to the WordPress experience.

This release also saw important 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) and mobile improvements to user-interfaces like the Toolbar, navigation menus, and Popovers.

All this and more in the wonderfully jam packed change log below:

8.8.0 🇳🇬

Enhancements

  • Copy: Use “block patterns” strings consistently. (24457)
  • Remove hardcoded color from the Recent Comments block. (24410)
  • Remove hardcoded styles from the Separator block. (24366)
  • Block toolbar: Split switcher from mover and simplify styles. (23971)
  • Use the block label 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 BlockTitle component. (23847)
  • 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.: Translate all strings inside the Large HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. Button block pattern. (24499)
  • Block Movers: Use a bigger mobile touch target. (23761)
  • Block Movers: Use a bigger visible focus rectangle. (23760)
  • Update the top toolbar buttons color. (24420)
  • Remove editor styles from front-facing stylesheets. (24439)
  • Block Toolbar More Menu: Switch back to the vertical ellipsis icon. (24426)
  • Removes hardcoded body text color from some block patterns. (24424)

New APIs

  • Support the default block classnames in dynamic blocks. (24546)
  • Support the custom classnames hook in dynamic blocks. (24483)
  • Stabilize the accessible Toolbar component and deprecate the old usage. (23316)
  • Add store icon to Icons package. (23867)
  • Allow POST requests in <ServerSideRender>. (21068)

Bug Fixes

  • Fix inserter expecting experimental settings to exist in the context. (24554)
  • Fix Image block caption jumps on Safari. (24540)
  • Fix Media Text block: Always show images on top on mobile. (24468)
  • Hide Preview menu on small viewports. (24537)
  • Fix canInsertBlockType selector returning true for blocks that don’t allow inner blocks. (24514)
  • Fix the huge font size on the editor when using the default font sizes presets. (24492)
  • Fix Cover block: Impossible to reset the minimum height value. (24490)
  • Fix Post preview button only appearing on small screens. (24487)
  • Fix deduplication of style rules for server-side block support flags. (24486)
  • Fix the quick inserter results limit for block variations. (24481)
  • Fix tiny editor preview when using Mobile or Tablet options with metaboxes enabled. (24478)
  • Fix custom gradient picker unable to change predefined gradients with hex colors. (24470)
  • Fixing duplicated wp-block classes in block-list. (24466)
  • A11yAccessibility 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):
    • Make the inserter behave as a popover. (24429)
    • Fix incorrect aria description in the Block List View. (24533)
    • Add arrow navigation in Preview menu. (24465)
    • Add arrow navigation to Warning dropdown menu. (24333)
    • Add an example to the buttons block to avoid focus loss issue. (24434)
  • Fix rendering non-Latin characters on aligned Cover blocks. (24447)
  • Remove --wp-admin-theme-color reference from frontend styles. (24436)
  • Prevent links from being focusable inside the Disabled component. (24397)
  • Image Editing: Fix alignment of aspect-ratio button. (24343)
  • Fix retrying of post-processing of edited images. (24081)
  • Set error state when there is an upload error in during file upload. (24017)
  • Block Directory: Decode entities in block title & description. (24172)
  • Preview menu: Remove redundant “opens in a new tab” hidden text. (24427)
  • Fix uploading PDFs in the File block. (24318)

Experiments

  • InnerBlocks: Introduce prop to specify render callback for each block. (24232)
  • Navigation:
    • Display children of inner block controllers in the block navigator. (24083)
    • Add font-size support to the the Navigation block. (24531)
  • Template Parts and saving flow:
    • Move the title to the block toolbar. (24450)
    • Fix Template Part renaming error. (24500)
    • Fix Site Title Save Bug. (24302)
  • Post Blocks:
    • Post Tags block: 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. where no tags are rendered. (24082)
    • Post Tags block: Support color, font-size and line-height customization. (24069)
  • Full Site Editing:
    • Load php files only if experiment is enabled. (24182)
  • Global Styles:
    • Consider any user changes to global styles as publishable. (24293)
    • Add support for more style properties in the global context. (24298)
  • Widgets screen:
    • Refactor the widgets screen to rely on dedicated endpoints. (24290)
    • Make the list of widgets excluded from the legacy widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. block extensibleExtensible This is the ability to add additional functionality to the code. Plugins extend the WordPress core software. via a 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.. (24271)

Documentation

  • Add undocumented global styles blocks & properties. (24421)
  • Remove “experimental” from title of editor filters. (24382)
  • Add instructions for disabling the Block Directory. (24357)
  • Remove duplicate questions in FAQ. (24355)
  • Indicate custom-fields support is required for registering 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.. (24325)
  • Add block directory submission guidelines. (23545)
  • Typos and tweaks: (24511) (24244) (24491) (24361) (24340)
  • Update the “Create a Block” Tutorial. (24545)
  • Getting started: Add a MAMP section. (24241)

Code Quality

  • Refactor embed block to single block with block variations. (24090)
  • Upgrade ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. version to 16.13.1. (21289)
  • Update lodash to 4.17.19. (24401)
  • Register the block attributes server-side for blocks with support flags. (24400)
  • Refactor components as functional components:
  • Remove unnecessary selector from the PostTitle block. (24418)
  • Remove unnecessary ad-hoc class application for dynamic blocks. (24223)

Build Tooling

  • Run wp-env start before PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 unit tests in package scripts. (23797)
  • Upgrade eslint-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-jsdoc to latest version. (24586)
  • Add full parameters for emulateNetworkConditions. (24144)
  • Add an end-to-end 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. test for the “Browse All” inserter button. (24396)

Performance Benchmark

Update: Gradual changes in the editor have made its rendering pipeline more asynchronous. As a result, the usual metrics (loading time, typing time) that we collect in the performance benchmarks may have not always represented the performance gains and losses experienced by some users.

We are improving the way times are measured to account for the more async nature of the editor rendering. We will update this post with performance results once we are confident that they accurately measure the performance of the editor.

The synchronicity changes in question only affect Gutenberg 8.8 and 8.9.
The numbers shared for previous releases are still an accurate way of measuring the editor’s performance.

A big thanks to all the wonderful contributors that helped with this release! 👏

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

What’s new in Gutenberg (August 5)

WordPress 5.5 is around the corner 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/ contributors have been busy fixing a number of important issues to make sure the editor on 5.5 is as stable as possible. Gutenberg 8.7 changelog reflects that with a number of fixes including important a11yAccessibility 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) ones.

At the same time, contributors are increasing the development pace on the next big projects. Global styles are being worked heavily on with the hope of shipping it by WordPress 5.6.

This release also saw a lot of improvements to the Post 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. suite that constitutes one of the important bricks for the Full Site Editing project.

8.7.0 🇹🇼

Enhancements

  • Make “Attempt Block Recovery” the default option of block invalidation. (24263)
  • Add a block example to the Buttons block. (24249)
  • Make the padding for the nav block inserter content the same for all sides. (24084)
  • Improve margin within the media replace popover. (24309)
  • Move “Convert to regular blocks” button to the reusable block toolbar. (24066)
  • Consistently autosave edits. (23962)
  • Use Post Type label for Document tab in Settings HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes.. (17311)
  • Update the Group block description. (24297)
  • Remove bottom margin of components dropdown menu item. (24227)
  • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Block Patterns improvements:
    • Adds “Heading and paragraph” pattern. (24143)
    • Updates “Large header and a paragraph” pattern. (24142)
    • Updates the “Large header” pattern. (24141)
    • Updates the “Quote” pattern. (24140)
    • Updates “Two images” pattern. (24139) (23856)
    • Updates “Three columns of text with buttons” pattern. (24138)
    • Updates “Three buttons” pattern. (24137)
    • Updates “Two buttons” pattern. (24136)
    • Updates ‘”wo columns of text” pattern. (24135)
    • Update “Two columns of text with images” pattern. (24134)
    • Update the “Large header and button” block pattern. (24177)
  • Block Directory: Use local assets with automatic asset detection. (24117)

New APIs

  • Add support for delete operations to @wordpress/core-data entities. (21557)
  • Add server-side handling for the block ‘align’ supports flag. (24122)
  • Add isDestructive style to Button. (22921)
  • wordpress/create-block: Enable loading translations for created blocks. (24125)

Bug Fixes

  • Fix htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. mode for non light blocks. (24335)
  • Fix block movers overlapping. (24349)
  • Fix List RichText backward compatibility for multiline root 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.). (24324)
  • Block patterns: Fix translatable strings. (24317)
  • Preserve the seconds when editing dates using the TimePicker component. (24305)
  • A11y:
    • Announce block selection changes manually on windows. (24299)
    • Fix arrow navigation in the LinkControl suggestions. (24222)
    • Avoid focus style from being cut on the categories panel. (24197)
    • Avoid focusing the block selection button on each render. (24195)
    • Avoid rendering the clipboard textarea inside the button. (24194)
    • Fix missing focus outline in Add New Tag. (24187)
    • Fix dropdown menu focus loss when using arrow keys with Safari and Voiceover. (24186)
    • Fix the gallery buttons focus style. (24157)
    • Update the editor landmark regions. (24196)
    • Mover control: Remove drag cursor. (23759)
  • Fix block insertion place after clicking Browse All in the inline inserter. (24285)
  • Fix last.fm svg icon alignment. (24278)
  • Cover: Fix padding controls showing null units. (24251)
  • Consistently show the default style variation if none provided. (24217)
  • Fix gradient RGBA/HSLA inputs’ width. (24214)
  • Popover: Fix arrow color to match content border color. (24208)
  • Fix dragging multiple blocks downwards resulted in blocks inserted in wrong position. (24183)
  • Fix Button block colors in the editor. (24153)
  • Fix the save shortcut in the code editor. (24151)
  • Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 notices when a block hasn’t declared ‘supports’. (24131)
  • Fix Block Directory icons. (24086)
  • Block Breadcrumb: Fix arrow direction in RTL. (24074)
  • 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.:
    • Fix missing plural forms for block related strings. (24071)
    • Merge similar translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. strings in the RSS block. (24159)
    • Merge similar translation strings – tables. (24169)
  • useBlockSync: Fix race condition when onChange callback changes. (24012)
  • Allow enter to insert line breaks even if template is locked. (23330)

Experiments

  • Full Site Editing and Site editor:
    • Add alignment support to post content block. (24014) (24077)
    • Post Title Block: Add style attributes. (24246)
    • Remove more initial PHP state. (23775)
    • Template Part: Improve title editing interactions. (23661)
    • Update the Post author, 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. and Comment blocks to use lightBlockWrapper. (24253)
    • Query blocks: Support wide alignments in the editor. (24229)
    • Post Comments Block: add block alignment support. (24226)
    • Post Excerpt block: Added icon and description to Post Excerpt block. (24203)
    • Post Date block: Added Post Date icon and updated block with icon and desc. (24178) (24225)
    • Post Author block: Added a description. (24171)
    • Post Comments Counts: Add style attributes. (24167)
    • Post Comments Form: Add style attributes. (24162)
    • Post Author and Post Excerpt: change editor selector class. (24104)
    • Post Comments block: add style supports for text and background settings. (24080)
    • Post excerpt block: Add color, fontSize, lineHeight, and text alignment. (23945)
    • Add Post Tags block description and icon. (23496)
    • Add a description to the Post Title block. (23494)
    • Update Post Author block to use __experimentalColor and __experimentalLineHeight. (23044)
  • Global styles:
    • Fix link color style property name in global styles. (24296)
    • Fix merge algorithm. (24294)
  • Navigation Block and screen:
    • Fix Navigation Block submenu being overlapped by Cover block overlay. (24062)
  • APIs:
    • Add initial support for themes to control the editor. (24275)
    • Prefix useSimulatedMediaQuery __experimental. (24279)
    • URLInput Customizable control rendering. (24115)

Documentation

  • Update Gutenberg FAQ with more recent information. (24202)
  • Clarify custom link color documentation for themes. (24056)
  • Add a link to the WordPress Data guide. (24327)
  • Document the new block tools theme support and core block patterns. (24265)
  • Replace the demo link of the Gutenberg Storybook in the documentation. (24212)
  • Docs: Update default values for Popover props ‘noArrow’ and ‘position’. (24207)
  • Added missing documentation link for contributor handbook. (24179)
  • Docs: Convert Block Registration RFC to the Block Metadata document. (23832)
  • Typos and tweaks: (23899) (24057) (24033) (24211) (24100)

Code Quality

  • Improve rootClientId comparison in useBlockDropZone. (24307)
  • Clarify wp.blocks.createBlock error message. (24287)
  • Convert blocks to function component with 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.:
    • BlockInvalidWarning. (24284)
    • ReusableBlockConvertButton. (24015)
  • Add missing prop to WPBlockVariation type definition. (24110)
  • Remove deprecated blockType.context support. (24155)
  • Wrap LinkControlSearchInput in forwardRef. (24119)

Build Tooling

  • Perf Tests: Set up branchbranch A directory in Subversion. WordPress uses branches to store the latest development code for each major release (3.9, 4.0, etc.). Branches are then updated with code for any minor releases of that branch. Sometimes, a major version of WordPress and its minor versions are collectively referred to as a "branch", such as "the 4.0 branch". only once for all test suites. (24123)
  • Revert “Build: Use .min.js suffix for bundled 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/.”. (24239)
  • Add a GitGit Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/. Diff to the output of the static checks job on failure. (24154)

Various

  • Fix intermittent Navigation block test failure. (24146)

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.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 8.76.97 s26.63 ms
Gutenberg 8.66.84 s27.15 ms
WordPress 5.49.55 s43.81 ms

Kudos for all the contributors that helped with the release. 👏

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