A Week in Core – July 12, 2021

Welcome back to a new issue of Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Let’s take a look at what changed on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. between July 5 and July 12, 2021.

  • 49 commits
  • 44 contributors
  • 67 tickets created
  • 28 tickets reopened
  • 62 tickets closed

Please note that the WordPress Core team released WordPress 5.8 RC 2 last week. Everyone is welcome to help testing the next major releasemajor release A release, identified by the first two numbers (3.6), which is the focus of a full release cycle and feature development. WordPress uses decimaling count for major release versions, so 2.8, 2.9, 3.0, and 3.1 are sequential and comparable in scope. of WordPress 🌟

Ticketticket Created for both bug reports and feature development on the bug tracker. numbers are based on the Trac timeline for the period above. The following is a summary of commits, organized by component and/or focus.

Code changes

Build/Test Tools

  • Add assertions to ensure version-controlled files are not modified during CI, and fix the grunt clean command – #53606
  • Replace assertInternalType() usage in unit tests – #53491, #46149
  • Use caching built into actions/setup-node#53584
  • Add missed file update in [51370]#53497
  • Expand tests for get_block_editor_settings()#53458
  • Move loading compatibility layers for PHPUnit 6+ and 7.5+ closer together – #53363
  • Update the wp-api-generated.js fixture – #53606
  • Use more appropriate assertions in various tests – #53123, #53363
  • Use more appropriate assertions in various tests – #53363
  • Use more appropriate assertions in various tests – #53363
  • Use more appropriate assertions in various tests – #53363
  • Use more appropriate assertions in various tests – #53363
  • Use more appropriate assertions in various tests – #53363

Bundled Themes

  • Correct customzier typo – #53598
  • Correct comment formatting in inc/block-patterns.php#53359, #52627
  • Update 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. patterns to match the latest versions of core/* blocks – #53617
  • Remove inline comment that is not relevant in WordPress Core – #53576
  • Remove mention of “FSE” in Core – #53497
  • Twenty Fifteen: Use strict comparison in inc/custom-header.php#53359

Coding Standards

  • Only check collation in wpdb methods if the query is not empty – #53635
  • Add missing semicolon to endforeach keywords in media templates – #46103
  • Fix WPCSWordPress Coding Standards A collection of PHP_CodeSniffer rules (sniffs) to validate code developed for WordPress. It ensures code quality and adherence to coding conventions, especially the official standards for WordPress Core. issue in [51404]#53363
  • Fix WPCS issues in [51367]#53363
  • Remove wrapping HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. tags from translatable strings – #53359
  • Rename the $ID variable to $user_id in wp_insert_user() and wp_update_user()#53359

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.

  • Skip animations when they have no duration – #53562, #53542

Documentation

  • Correct the @since tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) for the user_erasure_fulfillment_email_headers 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.#44314, #53461
  • Miscellaneous docblockdocblock (phpdoc, xref, inline docs) improvements – #53399
  • Some documentation improvements for wp_check_widget_editor_deps()#53437, #53569
  • Update the IRCIRC Internet Relay Chat, a network where users can have conversations online. IRC channels are used widely by open source projects, and by WordPress. The primary WordPress channels are #wordpress and #wordpress-dev, on irc.freenode.net. link from Freenode to Libera.chat – #53590

Editor

  • Merge conflicting wp.editor objects into single, non-conflicting object – #53437
  • Fix for 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.: color.duotone and spacing.units should allow empty sets – #53175
  • Update packages with latest fixes for 5.8 RC2 – #53397
  • Update packages with latest fixes for 5.8 RC2 – #53397
  • TinyMCE: ensure initialization runs in all cases on ‘interactive’ and ‘complete’ readyState. Fixes a rare 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. when the init code is inserted in the DOM after the page has finished loading – #53632

Help/About

  • Update placeholder links on About page – #52775
  • Update the About section for 5.8 – #52775

Internationalization

  • Correct recurring lenghts typo – #53600
  • Translate _doing_it_wrong() messages in wp_check_widget_editor_deps()#53437, #53569

Multisitemultisite Used to describe a WordPress installation with a network of multiple blogs, grouped by sites. This installation type has shared users tables, and creates separate database tables for each blog (wp_posts becomes wp_0_posts). See also network, blog, site

  • Log error/warnings/notices from ms-files.php#53493

Posts

  • Allow the list of wrapper blocks to be filtered – #53604
  • Fix Spelling in inline docsinline docs (phpdoc, docblock, xref)[23105], [51375], #53604
  • Prevent an empty 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. when groups and nested column blocks are present – #53604

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

  • Add the $request parameter to methods checking permissions – #53593
  • Ensure a sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.’s widgets property is a list – #53612

Script Loader

  • Update jQuery version to 3.6.0 following the update in [50520]#52707

Users

  • Return earlier from wp_update_user() in case of error – #53627

Widgets

  • Use wp_sidebar_description() to retrieve a sidebar’s description#53646

Widgets

  • Warn when wp-editor script or wp-edit-post style is enqueued in widgets editor – #53437, #53569

Props

Thanks to the 44 people who contributed to WordPress Core on Trac last week: @audrasjb (4), @SergeyBiryukov (4), @desrosj (4), @aristath (3), @zieladam (3), @johnbillion (2), @ntsekouras (2), @jorbin (2), @nosolosw (2), @andraganescu (2), @TimothyBlynJacobs (2), @spacedmonkey (2), @timothyblynjacobs (2), @sabernhardt (2), @kapilpaul (2), @jrf (2), @isabel_brison (1), @johnjamesjacoby (1), @pbearne (1), @empatogen (1), @gziolo (1), @mikaelmayer (1), @spytzo (1), @hellofromTonya (1), @alanjacobmathew (1), @ryokuhi (1), @javiarce (1), @kellychoffman (1), @chanthaboune (1), @stevehenty (1), @iandunn (1), @peterwilsoncc (1), @kevin940726 (1), @felipeelia (1), @Collizo4sky (1), @walbo (1), @azaozz (1), @youknowriad (1), @vishitshah (1), @dlh (1), @mukesh27 (1), @nielslange (1), @mikeschroder (1), and @dd32 (1).

Congrats and welcome to our 2 new contributors of the week! @mikaelmayer and @spytzo ♥️

Core committers: @sergeybiryukov (19), @desrosj (13), @johnbillion (3), @noisysocks (2), @jorbin (2), @ryelle (2), @azaozz (1), @mikeschroder (1), @jorgefilipecosta (1), @ocean90 (1), @timothyblynjacobs (1), @peterwilsoncc (1), @iandunn (1), and @youknowriad (1).

#5-8, #week-in-core

Miscellaneous block editor API additions in WordPress 5.8

WordPress 5.8 brings several additions and tweaks to the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor 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..

Contextual patterns for easier creation and block transformations

We’ve all been there. Staring at a blank page sometimes with an idea of what you want to create; often with a mind as blank as the page. To make the creation process easier, there is now a way to suggest patterns based on the block being used. This is now implemented for the Query block and includes some coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. patterns to start with.

In addition, there is an API to suggest pattern transformations that are contextual to the currently selected blocks. So how this is different to the patterns current behaviour? Previously, patterns insert demo content that must be updated after insertion. With this feature, it’s possible to use some patterns and retain existing attributes or content.

So it’s for existing blocks!

An important thing to note here is that a pattern transform can result to adding more blocks than the ones currently selected. You can see this with an example like the below where we have a Quote block but the pattern consist of more blocks:

This is the first iteration of the feature that covers most simple blocks (without innerBlocks). A new experimental API has been created where we can mark what block attributes count as content attributes. You can see more details in the PR.

In the long run as this work continues and spreads to more blocks, it will be easier to create content and get inspired without leaving the editor.

Pattern Registration API

if you’re creating your own custom block patterns, there’s a new blockTypes property that will allow your patterns to show up in other contexts like the transform menu. blockTypes property is an array containing the block names.

/register_block_pattern(
     'heading-example',
     array(
         'title'         => __( 'Black heading' ),
         'categories'    => array( 'text' ),
         'blockTypes'    => array( 'core/heading' ),
         'viewportWidth' => 500,
         'content'       => ' <!-- wp:heading {"level":3,"backgroundColor":"black","textColor":"white"} -->
    <h3 class="has-white-color has-black-background-color has-text-color has-background">Demo heading</h3>
<!-- /wp:heading -->',
     )
 );

To learn more about block patterns, see this WordPress News article: So you want to make block patterns.

BlockControls group prop

In WordPress 5.8, core blocks toolbars have been updated and made more consistent across blocks by splitting them into 4 areas like shown in the following screenshot.

To do so a new group prop has been added to the wp.blockEditor.BlockControls component. Third-party block authors are encourage to use this prop in their block code to follow the core blocks design pattern.

<BlockControls group="block">
    <ToolbarButton onClick={ doSomething }>{ __( 'My button' ) }</ToolbarButton>
</BlockControls>

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

Dev Chat summary, July 7, 2021

With just two weeks left in the 5.8 release cycle, @jeffpaul led the devchat on this agenda.

Announcements

RC 2 has landed! And it needs you, to help test it in as many ways as possible and chase down any last-minute bugs. For details, check out the RC 2 release post here.

As it happens, @desrosj reported in and said the release is in great shape:

The milestone only has three 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. tickets remaining that may require changes (excluding release related task tickets and two tickets needing only to be backported). We are in great shape heading into RC3 and final release. 

@desrosj

Blogblog (versus network, site) Post Highlights

In the afternoon chat, @jeffpaul led off with the RC 2 release post above, and it is indeed worth a second read, if you’re so inclined.

Other posts of note:

The 5.8 Field Guide is out. Docs lead @milana_cap has done a masterful job of pulling it all together. So if you’re getting a theme or a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party ready for 5.8, the Guide is your most reliable source of timely, topical information on the changes that will affect your products and the processes you use to get them out the door.

Catch up on the latest feedback the Full Site Editing crew has received with this post from @annezazu. And while we’re at it, here’s the FSE team’s latest chat summary.

And @audrasjb is back with another Week in Core, celebrating 52 contributors (five who are brand-new!) and nine committers who got things going this week.

@jeffpaul thanked the authors and everyone who commented or otherwise helped share news or knowledge this past week and shared this reminder:

We are now in the RC period. That means we’re in a hard string freeze, and the final planned release candidaterelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta)., RC 3, is now just FIVE days away, on July 13. The 5.8 release is TWELVE days away, on July 20.

(Ed. note: Where has the year gone?)

With no seemingly urgent business connected to the release (see @desrosj on the state of the milestone, above) @jeffpaul referred the group to a post from @mapk on care and influence in the WordPress community.

Components check-in

@sergeybiryukov reported in on Build/Test Tools. Referring the community to this ticket on PHPUnit 8.x, he described the challenges that come with adding support for PHPUnit 8.x and 9.x, since they’re not compatible with versions of PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher older than 7.1.

@marybaum commented that Help/About is looking good and then took a minute to thank all the people involved with the About page.

Open Floor

Pivoting from @sergeybiryukov‘s discussion of PHPUnit 8.x and 9.x, @azaozz opened a discussion of when WordPress might stop supporting PHP versions earlier than 7.1. The upshot, according to @sergeybiryukov: WordPress ends support for a PHP version when it’s running fewer than 5% of sites. At the moment, 8.83% of WordPress sites run PHP 5.6, and 5.23% are running on PHP 7.0.

Marketing Rep and Help/About co-maintainer @webcommsat would like to know what your favorite 5.8 feature is, so the Marketing team can write some social-media posts about it. You can share your favorites with her or @marybaum directly or in threads on this week’s marketing meeting, which run asynchronously through Friday.

@webcommsat would also like some more posts on key features in the release. To add one or more, use the commenting feature in this Google Doc.

#5-8, #core, #dev-chat, #summary

Dev Chat Agenda for July 7, 2021

Here is the agenda for this week’s developer meetings to occur at July 7, 2021 at 20:00 UTC.

Blogblog (versus network, site) Post Highlights

5.8 Schedule Review

  • RC 1 released last week and RC 2 yesterday, now under hard string freeze
  • Working on Field GuideField guide The field guide is a type of blogpost published on Make/Core during the release candidate phase of the WordPress release cycle. The field guide generally lists all the dev notes published during the beta cycle. This guide is linked in the about page of the corresponding version of WordPress, in the release post and in the HelpHub version page. email to 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/theme authors
  • No further 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. scrubs scheduled, so please highlight issues of concern directly in #core
  • RC 3 in 6 days on Tuesday, July 13th
  • 5.8 release in 13 days on Tuesday, July 20th

Components check-in and status updates

  • 5.8 plans and help needed
  • Check-in with each component for status updates.
  • Poll for components that need assistance.

Open Floor

Do you have something to propose for the agenda, or a specific item relevant to the usual agenda items above?

Please leave a comment, and say whether or not you’ll be in the chat, so the group can either give you the floor or bring up your topic for you accordingly.

This meeting happens in the #core channel. To join the meeting, you’ll need an account on the Making WordPress Slack.

#5-8, #agenda, #dev-chat

A Week in Core – July 5, 2021

Welcome back to a new issue of Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Let’s take a look at what changed on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. between June 28 and July 5, 2021.

  • 64 commits
  • 52 contributors
  • 65 tickets created
  • 16 tickets reopened
  • 67 tickets closed

Please note that the WordPress Core team released WordPress 5.8 RC 1 last week. Everyone is welcome to help testing the next major releasemajor release A release, identified by the first two numbers (3.6), which is the focus of a full release cycle and feature development. WordPress uses decimaling count for major release versions, so 2.8, 2.9, 3.0, and 3.1 are sequential and comparable in scope. of WordPress 🌟

Ticketticket Created for both bug reports and feature development on the bug tracker. numbers are based on the Trac timeline for the period above. The following is a summary of commits, organized by component and/or focus.

Code changes

Build/Test Tools

  • Add the 5.8 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". to the workflow for testing branches
  • Add the artifacts directory to svn-ignore and .gitignore#53549
  • Replace assertInternalType() usage in unit tests – #53491, #46149
  • Revert [51259-51256,51265] – #53397
  • Split packages and blocks to their webpack configs – #53397

Bundled Themes

  • Correct @since tags for blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. patterns – #52628, #53461
  • Remove mention of “FSE” in Core – #53497
  • Twenty Seventeen: Avoid JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. errors when displaying legacy widgets – #53512
  • Twenty Twenty-One: Add missing documentation for some filters – #52628, #53461
  • Twenty Twenty-One: Ensure Duotone images are displayed correctly in Dark Mode – #53531
  • Twenty Twenty-One: Ensure the dropdown arrow displays for <select> elements when focused – #53560
  • Twenty Twenty-One: Improve documentation per the documentation standards: – #52628, #53461
  • Twenty Twenty: Add missing documentation for some filters – #52628, #53461

Coding Standards

  • Add missing visibility keywords to WP_Theme, WP_Theme_JSON, and WP_Theme_JSON_Resolver tests – #52627
  • Apply an alignment fix after composer format#53375
  • Remove redundant type casting to array in WP_Query::get_posts()#53359

Documentation

  • Add @since tags for WP_Theme class properties – #53399
  • Add @ticket references to some WP_Theme_JSON tests – #52628, #53461
  • Add and correct examples of common names for various dynamic 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.#53581
  • Add missing @since tags for some 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/. methods added in 5.8 – #52628, #53461
  • Add missing @since tags for some WP_Theme_JSON methods
  • Adjust wp_dashboard_browser_nag() DocBlockdocblock (phpdoc, xref, inline docs) per the documentation standards – #52628, #53461
  • Correct @see references for hooks in the get_option() description – #52628, #53461
  • Correct @since annotation for WP_Block_Type->view_script#53397
  • Correct description for the $image parameter of the wp_save_image_file 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.#53399
  • Correct description for the upgrader_pre_install filter – #53546
  • Correct documentation for rest_{$post_type}_query and rest_{$taxonomy}_query filters – #53568
  • Corrections and improvements to types used in docblocks for symbols, properties, and filters – #53399
  • Descriptive improvements and corrections for various docblocks – #53399
  • Document common names for dynamic hooks relating to metadata – #53581
  • Document the globals used in WP_REST_Widget_Types_Controller and WP_REST_Widgets_Controller#52628, #53461
  • Document the globals used in some REST API methods – #53399
  • Fix the documentation for the $tests parameter of the site_status_tests filter – #53399, #46573
  • Further Improve documentation for wp_should_load_separate_core_block_assets() – #53505
  • Further type corrections and improvements for various docblocks – #53399
  • Improve documentation for wp_should_load_separate_core_block_assets()#53505
  • Improve documentation for optional parameters in WP_Theme_JSON_Resolver methods per the documentation standards – #52628, #53461
  • Improve documentation for optional parameters in WP_Theme_JSON methods per the documentation standards – #52628, #53461
  • List the expected type first instead of WP_Error in some REST API methods added in 5.8 – #52628, #53461
  • Miscellaneous docblock improvements – #53399
  • Miscellaneous formatting corrections for docblocks – #53399
  • Remove an empty line between @param and @return tags in some newly added REST API methods, per the documentation standards – #52628, #53461
  • Undo the accidental revert of [51299] made in [51300]#53399
  • Update documentation for WP_Widget_Block per the documentation standards – #52628, #53461
  • Update syntax for multi-line comments per the documentation standards – #52628, #53461
  • Update the IRCIRC Internet Relay Chat, a network where users can have conversations online. IRC channels are used widely by open source projects, and by WordPress. The primary WordPress channels are #wordpress and #wordpress-dev, on irc.freenode.net. link from Freenode to Libera.chat – #53590

Editor

  • Ensure global styles are loaded in the footer when loading core assets individually – #53494
  • Ensure the Query block pattern categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. is translatable – #53577
  • Prevent block stylesheets from loading when they do not exist – #53375
  • Remove the experimental experimental-link-color feature – #53175
  • Include the latest fixes targetted for 5.8 RC1 – #53397
  • Package updates including fixes from 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/ for WordPress 5.8 RC1 – #53397
  • Remove unnecessary function_exists check in get_the_block_template_html – #53578, #53176

Help/About

  • WordPress 5.8 About Page – #52775

Query

  • Check each post-type’s capabilities when querying multiple post-types – #48556

REST API

  • Allow multiple widgets to be deleted in a single batch request – #53557

Script Loader

  • Add file block assets to the svn-ignore list – #53397
  • Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notice caused by the viewScript for the core/file block – #53397
  • Revert [51267] – #53397
  • Use the provided block version when registering styles – #53507

Security

  • Add 5.8 to the list of versions receiving security updates

Site Health

  • Improve readability of site titles – #53535

Upgrade/Install

  • Notify users of deactivated plugins during upgrade – #53432
  • Widgets REST API: Fix non-multi widgets not appearing in wp_inactive_widgets – #53534

Props

Thanks to the 52 people who contributed to WordPress Core on Trac last week: @desrosj (9), @walbo (6), @aristath (5), @jorbin (5), @SergeyBiryukov (4), @audrasjb (3), @peterwilsoncc (3), @hellofromTonya (3), @gziolo (3), @nosolosw (2), @swissspidy (2), @isabel_brison (2), @zieladam (2), @pbiron (2), @nalininonstopnewsuk (1), @meher (1), @yvettesonneveld (1), @femkreations (1), @oglekler (1), @alanjacobmathew (1), @milana_cap (1), @courane01 (1), @annezazu (1), @matveb (1), @shaunandrews (1), @javiarce (1), @ryokuhi (1), @Jorbin (1), @Clorith (1), @Boniu91 (1), @ryelle (1), @empatogen (1), @melchoyce (1), @noisysocks (1), @pbearne (1), @jrf (1), @dd32 (1), @ilovecats7 (1), @mcsf (1), @poena (1), @dlh (1), @andraganescu (1), @marybaum (1), @leogermani (1), @jeffpaul (1), @ipstenu (1), @azaozz (1), @youknowriad (1), @chanthaboune (1), @cbringmann (1), @webcommsat (1), and @timothyblynjacobs (1).

Congrats and welcome to our 5 new contributors of the week! @femkreations, @courane01, @javiarce, @empatogen, and @ilovecats7 ♥️

Core committers: @sergeybiryukov (26), @desrosj (20), @johnbillion (8), @youknowriad (3), @jorbin (2), @peterwilsoncc (2), @ryelle (1), @clorith (1), and @noisysocks (1).

#5-8, #week-in-core

WordPress 5.8 Field Guide


UPDATE on 12 July 2021: The Miscellaneous block editor API additions in WordPress 5.8 dev notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. was added to the BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. Editor section.


Whether you are a WordPress website user, builder, or developer, WordPress 5.8 brings exciting changes and a hint of even more goodies coming in WordPress 5.9. But we’re getting ahead of ourselves; let us take a look at what to expect in when 5.8 is released.

The WordPress 5.8 release cycle is different from previous ones in several ways, but the release squad navigates it with ease, even though not entirely without pressure. One of these differences is a decision to include an unplanned Beta 4 into the release cycle. This is not such a surprise, given that there are 96 enhancements and feature requests, 170 bug fixes and 24 other blessed tasks, which brings us to 290 Trac tickets in total.

In this Field GuideField guide The field guide is a type of blogpost published on Make/Core during the release candidate phase of the WordPress release cycle. The field guide generally lists all the dev notes published during the beta cycle. This guide is linked in the about page of the corresponding version of WordPress, in the release post and in the HelpHub version page., you will notice what is relevant to you and your users among the many improvements coming in 5.8.

Block Editor

The block editor moves onward with regular releases. 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/ version 10.7 is bundled with WordPress 5.8; that totals eight Gutenberg releases (versions 10.0, 10.1, 10.2, 10.3, 10.4, 10.5, 10.6, and 10.7) all merged into this WordPress release (as the related Gutenberg handbook page makes clear)! Bug fixes and performance improvements from Gutenberg versions 10.8 and 10.9 are also part of 5.8.

The WordPress 5.8 Beta 1 post highlights a lot of the version’s new features and improvements:

  • New site editing blocks
  • The powerful query block
  • The block List view
  • Duotone image effects
  • Updates to existing blocks
  • Recommended patterns

As well, those recommendations integrate with the Pattern Directory on WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/, template editor, theme.json, and 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 among other changes.

In the block editor-related 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. below are important details on how theme.json delivers editor style control and associated Global Settings and Global Styles, plus:

  • Blocks in widget areas
  • block.json as canonical way to register block styles
  • deprecation of filters and introduction of context-aware replacements
  • Removal of previously deprecated EditorGlobalKeyboardShortcuts component, hasUploadPermissions selector, and hidden Subheading block
  • The iframed template editor portion of Full Site Editing
  • Block-styles loading enhancements

Media

Amongst all Media changes, the highlight is support for the WebP image format. Accompanied by new image_editor_output_format 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. (see #52867), it will set foundation for a real performance boost. You will also notice some UIUI User interface improvements, such as replacing infinite scroll with AJAX response (#50105 and #40330) and copy-link button on media upload screen (#51754).

Plugins

Changes in the Plugins component aim to make pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party developers lives easier. From better docs search (#50734) and standardizing 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. terminology (#50531) to ability to mark plugins as unmanaged (#32101) and avoid overwriting plugin files caused by update conflicts.

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

REST API changes are mainly focused on Widgets and sidebars but there is also a new operator for 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. queries within post collections, support for the eagerly awaited AND comparison, which allows posts meeting all passed criteria are matched (#41287).

Site Health

Amongst the UI fixes, Site Health changes bring new actions for extending the navigation in the Site Health screen (#47225). You will also find new info provided by Site Health via a list of the supported file types for the active image editor (#53022).

Themes

Across the Themes changes you will find two new action hooks, delete_theme and deleted_theme (#16401), a few UI improvements such as clearly showing if a theme is a child themeChild theme A Child Theme is a customized theme based upon a Parent Theme. It’s considered best practice to create a child theme if you want to modify the CSS of your theme. https://developer.wordpress.org/themes/advanced-topics/child-themes/. (#30240), update counter in adminadmin (and super admin) menu item (#43697), and removal of “Featured” tab in Add Themes screen (#49487).

Also, older bundled themes are refreshed with some really nice block patterns for your pleasure and inspiration.

Other Developer Updates

There are even more goodies in 5.8! Read through the dev notes below to see details on how Internet Explorer 11 support is being dropped as well as assorted changes to the Bootstrap/Load, Build/Test Tools, Formatting, General, Media, Posts/Post Types, 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., Themes, and Users components.

Alongside the dev notes below, also worth noting is that work has continued during the 5.8 release cycle to increase the compatibility with PHP8 and its new features. Please continue to test your code against PHP8 as we all work towards raising the entire WordPress ecosystem compatibility with PHP8, thank you!

But Wait, There is More!

5.8 offers so much more! Over 170 bugs, 96 enhancements and feature requests, and 24 blessed tasks have been marked as fixed in WordPress 5.8.

Here are a few that haven’t been highlighted:

  • Build/Test Tools: Remove @babel/polyfill in favor of core-js/stable, requires explicit addition of regenerator-runtime as script dependency if IE11 support is still required (#52941).
  • Bundled Theme: Add Block Patterns to Twenty Ten to Twenty Fifteen default themes (#51107, #51106, #51105, #51104, #51103, #51102).
  • Comments: comments_pagination_base missing in get_comment_reply_link() function (#51189).
  • Comments: Comments list’s link should point to an actual article (#52353).
  • Embeds: Process embeds for block widgets (#51566).
  • Emoji: Bump Twemoji from 13.0.1 to 13.1.0 (#52852).
  • External Libraries: Bump jQuery from 3.5.1 to 3.6.0 (#52707).
  • External Libraries: Bump Moment.js from 2.27.0 to 2.29.1 (#52853).
  • External Libraries: Bump Requests from 1.7.0 to 1.8.1 (#53101 and #53334).
  • External Libraries: Bump Underscore from 1.8.3 to 1.13.1 (#45785).
  • Media: Remove infinite scrolling behavior from the Media grid (#50105).
  • Media: Add a copy-link button at the media upload page (#51754).
  • Menus: Add ability to delete multiple menu items (#21603).
  • Revisions: a new dynamic filter to specify post type for number of revisions to save, wp_{$post->post_type}_revisions_to_keep (#51550).
  • Role/Capability: user_can() changed for exist capability for anonymous users (#52076).
  • Upgrade/Install: Remove parsing of readme.txt files from validate_plugin_requirements() (#48520).
  • Upgrade/Install: Fatal error during update to 5.8 of a site with an active Gutenberg plugin (version less than 10.7) (#53432).
  • Widgets: Make sure WP_Widget constructor creates a correct classname value for a namespaced widget class (#44098).
  • And much, much more!

Please, test your code. Fixing issues that your code has with WordPress coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. helps you and millions of WordPress sites.

Props to @jeffpaul and @desrosj for contributing to this guide.

#5-8, #field-guide

Block-styles loading enhancements in WordPress 5.8

WordPress 5.8 improves the way we load 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.-styles by introducing 2 new features:

  • Load styles only for rendered blocks in a page
  • Inline small styles

Only load styles for used blocks

This is an opt-in, non-breaking change. Using the should_load_separate_core_block_assets 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., developers can opt-in to this feature:

add_filter( 'should_load_separate_core_block_assets', '__return_true' );

Prior to WordPress 5.8, styles for all blocks were included in a style.css file that gets loaded on every page. By opting-in to separate styles loading, the following will happen:

  • The wp-block-library stylesheet changes: Instead of loading the wp-includes/css/dist/block-library/style.css file which contains all styles for all blocks, this handle will now load the (much smaller) wp-includes/css/dist/block-library/common.css file, which contains generic styles like the default colors definitions, basic styles for text alignments, and styles for the .screen-reader-text class.
  • Styles for blocks will only get enqueued when the block gets rendered on a page.

The above changes will only apply to the frontend of a site, so all editor styles will continue to work as they did before.

The difference between block themes and classic themes

Block themes

In a block theme, blocks get parsed before the <head> so we always know which blocks will be present prior to rendering a page. This makes it possible to add the block styles to the <head> of our document.

Classic themes

In a classic, php-based theme, when a page starts to render, WordPress is not aware which blocks exist on a page and which don’t. Blocks gets parsed on render, and what that means is that block-styles don’t get added in the <head> of the page. Instead, they are added to the footer, when print_late_styles() runs.

If you have an existing theme and you want to opt-in to this improvement, you will need to test your theme for style priorities. Opting-in to separate styles loading in a classic theme means that the loading order of styles changes. Block styles that used to be in the head will move to the footer, so you will need to check your theme’s styles and make sure any opinionated styles you add to blocks have a higher priority than coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. styles.

Taking advantage of separate styles loading to add 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/theme styles to blocks

It is possible to use this new feature to attach styles to existing block-styles, by inlining them.

If your theme adds styles to blocks, instead of loading a single file containing all styles for all blocks, you can split styles and have a single file per-block. This will allow you to only load your theme’s (or plugin’s) block styles only when a block exists on a page.

The function below is an example implementation of how to do that, with some additional tweaks:

  • It works both in WordPress 5.8 and previous versions
  • It has a fallback in case the should_load_separate_core_block_assets filter is disabled
  • It adds styles both in the editor and frontend
  • Checks for specific editor block styles.

Feel free to use this as an example, tweaking it to suit your needs and implementation.

/**
 * Attach extra styles to multiple blocks.
 */
function my_theme_enqueue_block_styles() {
	// An array of blocks.
	$styled_blocks = [ 'paragraph', 'code', 'cover', 'group' ];

	foreach ( $styled_blocks as $block_name ) {
		// Get the stylesheet handle. This is backwards-compatible and checks the
		// availability of the `wp_should_load_separate_core_block_assets` function,
		// and whether we want to load separate styles per-block or not.
		$handle = (
			function_exists( 'wp_should_load_separate_core_block_assets' ) &&
			wp_should_load_separate_core_block_assets()
		) ? "wp-block-$block_name" : 'wp-block-library';

		// Get the styles.
		$styles = file_get_contents( get_theme_file_path( "styles/blocks/$block_name.min.css" ) );

		// Add frontend styles.
		wp_add_inline_style( $handle, $styles );

		// Add editor styles.
		add_editor_style( "styles/blocks/$block_name.min.css" );
		if ( file_exists( get_theme_file_path( "styles/blocks/$block_name-editor.min.css" ) ) ) {
			add_editor_style( "styles/blocks/$block_name-editor.min.css" );
		}
	}
}
// Add frontend styles.
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_block_styles' );
// Add editor styles.
add_action( 'admin_init', 'my_theme_enqueue_block_styles' );

Inlining small assets

In some cases small stylesheets get loaded on WordPress sites. These stylesheets require the browser to make an additional request to get an asset, and while they benefit from caching, their small size doesn’t justify that extra request, and performance would improve if they were inlined.

To that end, an inlining mechanism was implemented. This is an opt-in feature, and can be handled on a per-stylesheet basis. Internally, only assets that have data for path defined get processed, so to opt-in, a stylesheet can add something like this:

wp_style_add_data( $style_handle, 'path', $file_path );

When a page gets rendered, stylesheets that have opted-in to get inlined get added to an array. Their size is retrieved using a filesize call (which is why the path data is necessary), and the array is then ordered by ascending size (smaller to larger stylesheet). We then start inlining these assets by going from smallest to largest, until a 20kb limit is reached.

A filter is available to change that limit to another value, and can also be used to completely disable inlining.

To completely disable small styles inlining:

add_filter( 'styles_inline_size_limit', '__return_zero' );

To change the total inlined styles limit to 50kb:

add_filter( 'styles_inline_size_limit', function() {
	return 50000; // Size in bytes.
});

Inlining these styles happens by changing the src of the style to false, and then adding its contents as inline data. This way we avoid backwards-compatibility issues in themes and any additional styles attached to these stylesheets using wp_add_inline_style will still be printed.

Please note that if a stylesheet opts-in to get inlined, that is no guarantee that it will get inlined.

If for example on a page there are 30 stylesheets that are 1kb each, and they all opt-in to be inlined, then only 20 of them will be converted from <link rel="stylesheet"/> to <style> elements. When the 20th stylesheet gets inlined the 20kb limit is reached and the inlining process stops. The remaining 10 stylesheets will continue functioning like before and remain <link> elements.

If your theme opts-in to the separate block-styles, core block styles by default have path defined so they can all be inlined.

Props @sergeybiryukov for proofreading this dev-note.

#5-8, #dev-notes

Dev Chat Summary: June 23, 2021

Chats were led by @peterwilsoncc and @jeffpaul. Opened with intros and welcome.

Highlighted Posts

  • 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. are shipping!
  • 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. Editor 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. Changes to Support Multiple Adminadmin (and super admin) Screens in WP 5.8
  • Bundled themes changes in WordPress 5.8
  • Extending the Site Health interface in WordPress 5.8
  • Block API Enhancements in WordPress 5.8
  • Meeting notes and stuff
  • Regular posts on A Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. plus CSSCSS Cascading Style Sheets. and Editor chat summaries are also available to peruse.

WP5.8 Things

  • Test the beta! https://wordpress.org/news/2021/06/wordpress-5-8-beta-3/
  • We added a 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.! Beta 4 is Thursday
  • RC1 is next Tuesday
  • Call for help! https://core.trac.wordpress.org/tickets/major/workflow everything in the Has Patch/Needs Testing and Needs Patch sections could use input. 

Component Check-in

  • Build/Test Tools: sourceMaps are now ignored for non WordPress Core files to avoid a build failure for custom plugins or themes located in build/wp-content. See ticketticket Created for both bug reports and feature development on the bug tracker. #52689 for more details.
  • 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/. is now used when fetching the WordPress Importer for unit tests. Previously, SVNSVN Subversion, the popular version control system (VCS) by the Apache project, used by WordPress to manage changes to its codebase. was used and the commands were not correctly run within the Docker container. See ticket #52909 for more details.
  • Bundled themes: There are a few tickets related to polishing the new blocks added in 5.8 that need testing. And the default themes also need more testing in general for 5.8. If that’s within your area of expertise, please feel free to help out with that.

Open Floor

  • Request for feedback on https://core.trac.wordpress.org/ticket/53450 (additional context in the original comment)
  • theme.json testing program is open: https://make.wordpress.org/test/2021/06/24/call-for-testing-thrive-with-theme-json/
  • FSE Outreach schedule is posted: https://make.wordpress.org/test/2021/06/09/upcoming-fse-outreach-program-schedule-june-july/

#5-8

A Week in Core – June 28, 2021

Welcome back to a new issue of Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Let’s take a look at what changed on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. between June 21 and June 28, 2021.

  • 60 commits
  • 64 contributors
  • 79 tickets created
  • 8 tickets reopened
  • 78 tickets closed

Please note that the WordPress Core team released WordPress 5.8 beta 3 and beta 4 last week. Everyone is welcome to help testing the next major releasemajor release A release, identified by the first two numbers (3.6), which is the focus of a full release cycle and feature development. WordPress uses decimaling count for major release versions, so 2.8, 2.9, 3.0, and 3.1 are sequential and comparable in scope. of WordPress 🌟

Ticketticket Created for both bug reports and feature development on the bug tracker. numbers are based on the Trac timeline for the period above. The following is a summary of commits, organized by component and/or focus.

Code changes

Build/Test tools

  • Add the regenerator-runtime script as a dependency to wp-polyfill#52941
  • Correct PHPUnit version requirement in tests using ::createPartialMock()#52625
  • Replace assertEquals() with assertSameSets() in text 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. tests – #52482, #52625
  • Require PHPUnit >= 6 in tests using ::createPartialMock()#52625
  • Use assertSame() in _wp_to_kebab_case() tests – #52482, #52625, #53397
  • Use more appropriate assertions in a few tests – #52625

Bundled Themes

  • Improve display of blocks in widget areas – #53422
  • Improve 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/ check before activating an FSE theme – #53410
  • Prevent a Full Site Editing theme from being activated when Gutenberg is not active – #53410
  • Remove mention of “FSE” in Core – #53497
  • Remove unexpected border around the Theme Details button – #53473
  • Twenty Nineteen: Update margins on full- and wide-aligned blocks in the editor – #53428
  • Twenty Thirteen: Improve the display of the Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. 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.#53438
  • Twenty Twenty-One: Add margins around content in Post Template block – #53389, #53398
  • Twenty Twenty-One: Add spacing around Query block when there is a background color – #53398
  • Twenty Twenty-One: Use the theme version when enqueueing theme assets – #53502
  • Twenty Twenty: Remove extra margin within the Query Loop block – #53482

Coding standards

Docs

  • Document api_version and variations properties in WP_Block_Type::__construct()#53518
  • Fix typo in widgets-block-editor feature documentation – #53424
  • Remove inaccurate @since 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.)#53461, #50105
  • Shorten the copyright notice for the WP_REST_Sidebars_Controller class – #41683
  • Update documentation for WP_Widget_Block per the documentation standards – #52628, #53461
  • Various docblockdocblock (phpdoc, xref, inline docs) corrections for code added in 5.8 – #53461
  • Various 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. docblock improvements – #52920

Editor

  • Allow custom-units to be an array – #53472
  • Correct variable names in get_block_editor_settings()#53458
  • Ports 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. changes for 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. 3 – #53397
  • Do not load a default font family for themes with theme.json
  • Move caching to endpoint for unique responses – #53435
  • Package updates for Beta 3 – #53397
  • Package updates including fixes from Gutenberg for WordPress 5.8 RC1 – #53397
  • Remove empty blocks/query-loop directory – #52991
  • Send localeLocale A locale is a combination of language and regional dialect. Usually locales correspond to countries, as is the case with Portuguese (Portugal) and Portuguese (Brazil). Other examples of locales include Canadian English and U.S. English., version with remote pattern requests – #53435
  • Update the packages with a number of fixes targeted for Beta 4 – #53397

General

  • Ensure svn:eol-style is consistently set for all recently added files – #53528

Media

  • Add lazy-loading support to block-based widgets – #53463, #53464
  • Correct undefined variable in wp_ajax_query_attachments – #50105
  • Improve upload page media item layout on smaller screens – #51754
  • Prevent uploading and show an error message when the server doesn’t support editing of WebP files and image sub-sizes cannot be created – #53475
  • Prevent uploading and show an error message when the server doesn’t support editing of WebP images, take II. Add new, better error message for it – #53475
  • Revert r51211 to restore ms-files.php assets – #53492, #53475

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

  • Include 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. ID when saving a widget – #53452
  • Retrieve latest widgets before loading sidebars – #53489

Site Health

  • Add a unique wrapper for dashboard widget content – #53521

Widgets

  • Fix non-multi widgets not appearing in wp_inactive_widgets – #53534
  • Add editor styles to the widgets block editor – #53344. – #53388
  • Add missing label and description to 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. controls – #53487
  • Add support for the Widgets Editor on after_setup_theme instead of widgets_init#53424
  • Avoid a TypeError when adding a widget in the Customizer – #53488, #53421, #53419
  • Fix an “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. value” warning when adding a new widget in the Customizer – #53479
  • Fix widget preview not working if widget registered via a instance
  • Remove unnecessary gutenberg_ functions – #53441
  • Stop loading wp-editor and the Block Directory assets on the widgets screen – #53437, #53397

Props

Thanks to the 64 people who contributed to WordPress Core on Trac last week: @noisysocks (10), @desrosj (9), @ryelle (7), @hellofromTonya (5), @nosolosw (4), @zieladam (4), @SergeyBiryukov (4), @spacedmonkey (4), @aristath (3), @scruffian (3), @peterwilsoncc (3), @azaozz (3), @audrasjb (3), @gziolo (3), @johnbillion (3), @walbo (3), @caseymilne (3), @youknowriad (2), @jorbin (2), @Mamaduka (2), @dd32 (2), @joedolson (2), @kevin940726 (2), @jamesros161 (2), @chanthaboune (2), @timothyblynjacobs (2), @jorgefilipecosta (2), @marybaum (1), @ocean90 (1), @daisyo (1), @tellyworth (1), @sumaiyasiddika (1), @danieldudzic (1), @mkaz (1), @Presskopp (1), @joen (1), @sabernhardt (1), @andraganescu (1), @sunxiyuan (1), @isabel_brison (1), @kraftner (1), @onemaggie (1), @jffng (1), @otto42 (1), @Boniu91 (1), @Clorith (1), @alanjacobmathew (1), @mbabker (1), @ntsekouras (1), @strategio (1), @poena (1), @naoki0h (1), @ixkaito (1), @antpb (1), @aleperez92 (1), @iandunn (1), @barry (1), @mukesh27 (1), @herregroen (1), @jeherve (1), @hellofromtonya (1), @adamsilverstein (1), @cbringmann (1), and @AlePerez92 (1).

Congrats and welcome to our 3 new contributors of the week! @sumaiyasiddika, @sunxiyuan, and @alanjacobmathew ♥️

Core committers: @desrosj (24), @sergeybiryukov (11), @ryelle (4), @youknowriad (3), @noisysocks (3), @iandunn (3), @jorbin (2), @azaozz (2), @jorgefilipecosta (2), @clorith (1), @timothyblynjacobs (1), @joedolson (1), @flixos90 (1), @peterwilsoncc (1), and @antpb (1).

#5-8, #week-in-core

Blocks in an iframed (template) editor

The new template editor is loaded in an 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. to isolate it from the rest of the adminadmin (and super admin) screen. This has the following benefits:

  • Admin styles no longer affect the editor content, so there’s no need to reset any of these rules.
  • Content styles no longer affect the admin screen, so 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 theme CSSCSS Cascading Style Sheets. rules no longer need to be prefixed.
  • Viewport relative CSS units will work correctly. The dimensions of the editor content is usually not the same as the dimensions of the admin page, so without an iframe units like vw will be relative to the admin page.
  • Media queries will also work natively, without needing to fake them, as we did before, which is fragile.
  • In general, it makes the lives of block and theme authors easier because styles from the front-end can be dropped in with very little, if nothing, to adjust. This also applies to lighter blocks, where the editor DOM structure matches the front-end, which we highly recommend when possible.
  • With a separate window for the editor content, it’s possible for the selection in the editor to remain visible while also having a (collapsed) selection in the editor UIUI User interface, for example an input field for a URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org.

We currently only iframe new editors. While the new template editor has been iframed, the post editor remains unchanged. We do this to gradually test how existing blocks from plugins work within an iframed editor, since there are cases where a block could look broken or (less likely) error. We hereby urge 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 authors to test their blocks with the new template editor and contact us if they need help to adjust blocks to work in the iframe.

Document and window

The iframe will have a different document and window than the admin page, which is now the parent window. Editor scripts are loaded in the admin page, so accessing the document or window to do something with the content will no longer work.

Most blocks written in ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. should continue to work properly, except if you rely on document or window. To fix, you need to create ref to access the relative document (ownerDocument) or window (defaultView). Regardless of the iframe, it is good practice to do this and avoid the use of globals.

const ref = useRef();
useEffect( () => {
  const { ownerDocument } = ref.current;
  const { defaultView } = ownerDocument;
  // Set ownerDocument.title for example.
}, [] );
const props = useBlockProps( { ref } );

If you attach event handlers, remember that the useEffect callback will not be called if the ref changes, so it is good practice to use the new useRefEffect 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., which will call the given callback if the ref change in addition to any dependencies passed.

const ref = useRefEffect( ( element ) => {
  const { ownerDocument } = element;
  const { defaultView } = ownerDocument;
  defaultView.addEventListener( ... );
  return () => {
	defaultView.removeEventListener( ... );
  };
}, [] );
const props = useBlockProps( { ref } );

Other frameworks and libraries

For the editor, scripts such as jQuery are loaded in the parent window (admin page), which is fine. When using these to interact with a block in the iframe, you should pass the element reference.

const ref = useRefEffect( ( element ) => {
  jQuery( element ).masonry( … );
  return () => {
    defaultView.jQuery( element ).masonry( 'destroy' );
  }
}, [] );
const props = useBlockProps( { ref } )

But what if the library is using the global window or document and it’s out of your control?

Submit an issue or PR for the library to use ownerDocument and defaultView instead of the globals. Ideally, any library should allow initialisation with an element in an iframe as the target. It’s never impossible. Feel free to contact us to mention the issue.

In the meantime, you can use the script that is loaded inside the iframe. We’ve loaded all front-end scripts in the iframe to fix these cases, but note that ideally you shouldn’t use scripts loaded in the iframe at all. You can use defaultView to access the script.

const ref = useRefEffect( ( element ) => {
  const { ownerDocument } = element;
  const { defaultView } = ownerDocument;

  // Use the script loaded in the iframe.
  // Script are loaded asynchronously, so check is the script is loaded.
  // After the dependencies have loaded, the block will re-render.
  if ( ! defaultView.jQuery ) {
    return;
  }

  defaultView.jQuery( element ).masonry( … );
  return () => {
    defaultView.jQuery( element ).masonry( 'destroy' );
  }
} );
const props = useBlockProps( { ref } );

And that’s it! In summary, any problem that a block might have in the iframe is caused by using the document or window global at the root of it, either in the block’s code or a third party library. Ideally, all code uses the ownerDocument and defaultView relative properties.

#5-8, #dev-notes, #gutenberg