annezazu 8:51 pm on March 4, 2021
Tags: core-editor, core-editor-improvement ( 5 )

Core Editor Improvement: Need for (page/post) Speed

Thank you to @aristath who helped with this post.

In today’s world, speed matters whether you’re trying to write a post in the editor or load a page as a visitor. Over the last couple of months, a lot has changed around performance to improve both of these aspects, but the changes might have happened so fast you missed them! This post will focus solely on front end performance with a future post in the works that covers performance-related changes to the editor itself. For now, read on to learn just how speedy the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. editor makes your site and get excited because what’s discussed here is currently available in Gutenberg 10.1!

Updates to front end performance

As most developers know, you can think of front end performance as the type of performance that impacts SEO and the experience visitors have when they check out your site. Lots of things contribute to the performance of your site including various CSSCSS Cascading Style Sheets. styles, 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/. files, and more. While your theme and plugins contribute to what needs to be loaded to create the magic of viewing a page or post, the core editor does as well!

With the merging of this PR, CSS styles are only loaded for blocks used on a page, which cuts down the amount of CSS needed and increases performance dramatically. For context, in previous GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ releases, all styles for all blocks were enqueued in a single file causing extra page load. This means that now only what’s necessary is loaded when you’re viewing content!

After the work was done to separate out block styles, an additional PR was merged for Gutenberg 10.1 to improve the performance of these 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. Since most blocks have fairly small stylesheets, it didn’t make sense to send requests to the server for these bite-sized styles. To resolve this, the tiny stylesheets were inlined, further improving the performance by including everything the browser needs in a single request. Think of this as sending one text message covering a few topics, rather than writing a bunch of individual messages one after the other.

Right now, both of the above changes are the default behavior in FSE, but they are opt-in for non-FSE templates to avoid backward-compatibility issues with CSS overrides in older themes. When FSE gets merged into Core, these improvements will be more widely available and make a big difference for all.

Stay tuned for more

As with many performance enhancements, it’s easier to notice when things break compared to when they are running smoothly. Hopefully, this post gave you a behind-the-scenes look into the work that goes into keeping your sites speedy while using the Core Editor. While a lot of work is put into democratizing publishing in the WordPress project, this kind of work helps democratize delivery, allowing people to get the content they want to consume easier and faster. With changes coming to Google Search related to the speed of webpages, performance improvements for both the front end and in the editor have never been more timely.

The work here is never done though so, if you’re interested in working on improving performance, make sure to join #core-editor, check out the current focuses, and attend the Core Editor weekly meeting Wednesday @ 14:00 UTC.

#core-editor, #core-editor-improvement

Paal Joachim Romdahl 5:19 pm on March 2, 2021
Tags: agenda ( 547 ), core-editor, core-editor-agenda ( 62 ), meeting ( 49 )

Editor Chat Agenda: 3 March 2021

Facilitator and notetaker: @andraganescu

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

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

WordPress 5.7 RC 2
Gutenberg 10.1
Monthly Plan for February 2021 (March monthly plan will be released soon) and key project updates:
- Global Styles.
- 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 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.
- Navigation block.
- Full Site Editing.
Task Coordination.
Open Floor.

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

If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

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

Nik Tsekouras 12:09 pm on March 2, 2021
Tags: core-editor, editor ( 174 ), gutenberg-new ( 86 )

What’s new in Gutenberg 10.1? (3 March)

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/ 10.1 has been released! This release includes a number of nice enhancements and as usual many 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. In addition Full Site Editing, Widgets and Navigation screens and Global Styles saw many improvements.

Reusable blocks improvements

With the ongoing effort to improve the different user flows related to Reusable blocks we’ve seen tons of enhancements recently that are worth mentioning 🙂 .

Visual clarity of Reusable blocks has been improved with the Reusable 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.’s title displayed next to the block type in toolbar, in Navigation List and in Breadcrumbs. Towards the same direction if a child block is selected, the Reusable block is outlined making it easier to identify where the block starts and where it ends.

Another enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature. is the ability to modify the saved title of reusable block 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. inspector and the newest one is the enhanced creation flow, that also allows you to cancel the action.

Better clarity on the Image toolbar

The Image block’s toolbar has now better clarity by following 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., block level, inline” order in the block toolbar. This makes the grouping so much clearer and other blocks are going to follow :).

Spacing options for Social Links and Buttons

You can now set how the space between and around Social Links will be distributed. In addition more options were added to Buttons block.

10.1

Features

Use a modal for the reusable blocks creation flow. (29040)
Normalize Image’s block toolbar. (29205)
Add Items Justification to Social Links. (28980)

Enhancements

Improve the sorting algorithm while searching parent pages. (29143)
Buttons: Add space-between justification controls. (29160)
Avoid focusing blocks when inserting them into the canvas. (28191)
Create Block: Use register_block_type_from_metadata to register blocks on the server. (28883)
Greatly improve dragging performance of the focal point picker. (28676)
Improve block search input’s accessible name and placeholder. (28393)

New APIs

Extend updateBlockAttributes to provide for different attribute changes for each block in the clientIds array. (29099)

Bug Fixes

Fix Slash Inserter position. (29288)
Fix issue with invisible reset template hover state. (28912)
InputControl: Fix labelPosition rendering with new ui/flex component. (29226)
Button sizing style fix. (29208)
Create Block: Fix the background color in esnext template. (29223)
Add border-collapse to default block styles in Table block. (27628)
Navigation Block:
- Fix Navigation Links when post type is not Page or Post. (28892)
- Fix inline style inheritance. (28868)
- Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notice shown when rendering a navigation link block. (28999)
Fix is-hovered event listener. (28715)
Fix function call in justify toolbar. (28955)
Fix footer icon color. (29199)
Show page titles special characters in the parent page selector. (29104)
Edit Post: Automatically connect a menu item with the pinnable sidebar 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. (29081)
Make Modal component use the aria.labelledby prop. (29020)
Fix adminadmin (and super admin) menu scroll on editor page. (28959)
Prioritize coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks in the inserter. (28945)
Make the __experimentalCaptureToolbars option work reliably. (28905)
Ensure sticky tabs are in front of their panel’s descendants. (28562)
Navigation Component: Increase color and padding specificity. (28619)
Add note to indicate why priority queue callbacks may be undefined. (28337)
Keep initial formatting on paste for Preformatted and Verse components. (27781)
Rich text: Keep block ID on split. (28505)
Fix cursor on rich text blocks when outline mode is active. (29106)

Experiments

Improve loading method for block styles. (28358)
Do not use __experimentalSelector to check the panel title. (29264)
Update documentation for social links & 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.. (29294)
Navigation Screen:
- Add block deselection when clicking canvas background. (28876)
- Improve experience for user creating their first menu. (28767)
- Fix positioning of nested submenus. (28934)
Full Site Editing:
- Use a modal for the template part creation flow. (29108)
- Add an ‘area’ term for Template Parts. (28410)
- Add content menu items preview in Navigation. (29225)
- Replace locate_template method. (28942)
- Site Editor:
  - Inject theme attribute into template parts too. (29080)
  - Organise semantic template parts. (29030)
  - Show contextual icon in the Inspector’s template tab. (29195)
  - Add template tab to sidebar. (28633)
Global Styles:
- Support skipping serialization in the color hook (block supports mechanism). (29142)
- Fix 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. font-family list. (28960)
Widgets:
- Use textarea for editing block widgets. (24899)
- Set container classname dynamically depending on 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. (26375)
- Add Widgets 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/. changes from Core-51460. (29242)
UIUI User interface Components:
- Add Surface Component. (28596)
- Add Elevation Component. (28593)
- Add FormGroup + ControlLabel components. (28568)
- Add spinner. (29146)
- Rename ui files to match simpler scheme. (28948)
- Add 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. based Scrollable component wrapper. (28979)
- Add createComponent unit tests. (28949)
- Add hooks based VisuallyHidden. (28887)
- Add ControlGroup. (28982)
- Add Portal. (28981)
- Update documentation (README + inline docsinline docs (phpdoc, docblock, xref)). (29128)
- Update color-picker snapshot tests to use diff matching. (28925)
Bugs:
- Fix Site Logo Styles. (29227)
- Template Part: Fallback to missing state if slug or theme is invalid. (29041)
- Site Editor:
  - Fix misalignment with navigation toggle and 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.. (29093)
  - Fix navigation editor block selection clearing. (29293)
  - Fix navigate to link error. (29239)
  - Fix position and style of “Dashboard” link. (29034)
  - Fix end-to-end test errors introduced by template sidebar. (28950)
- Widgets:
  - Fix widgets preview URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org typo. (29062)
  - Fix php error in the widget screen. (29137)
  - Fix legacy widgets not previewing and widgets saving issue. (29111)
  - Fix server rendered widget not previewing. (29197)

Documentation

Add 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) testing instructions. (28947)
Updates to Outreach Page. (28929)
Update Create a Block tutorial to use block.json. (29027)
Expose Block Directory references in the handbook. (29025)
Update “key concepts”. (28973)
Remove Font style, weight, decoration, and transform presets from the theme.json documentation. (29200)
Combobox Control: Update 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. doc. (28787)
Add block variations to FAQ. (29154, 29170)
Add templates and global styles to key concepts. (29071)
Update block metadata section to promote PHP API. (29023)
Fix the header links, add link to user documentation. (28857)

Code Quality

Replace store name literals in block-library. (28975)
Fix typos in PHP comments. (29198)
Format TS files according to coding styles. (29064)
WP_Theme_JSON_Resolver: Update translate terminology. (28944)
Improve code readability by not passing variables by reference. (28943)
Convert navigation link to use hooks and context. (28996)
Block props: Avoid memo (block mode). (29139)
Reduce memoized context:
- Block props. (29183)
- Block nodes. (29163)
Use ref callback:
- 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., selection clearer, typing observer. (29114)
- Canvas click redirect & typewriter hooks. (29105)
- Clipboard handler. (29090)
- Hover hook. (29089)
- useBlockProps. (28917)
- Block nodes. (29153)

Tools

Add support for native TypeScript. (28879)
Limit the npm version to be 6. (29204)
Run CI jobs on wp prefix branches. (29194)
Eslint plugin: Add suggestions to “data-no-store-string-literals” rule. (28974)
Update codeowners. (29280)
Scripts:
- Coerce live reload port to integer. (29196)
- Add Python 2.0 to other OSS licenses in license checker. (28968)
Create Block: Fix issue with processing unrelated engines. (29066)
Fix spacing in new contributor welcome message. (28958)
Add reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.-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. package with i18n React bindings. (28465)
babel-plugin-makepot: Don’t transpile the package code. (28911)
docgen:
- Don’t transpile the package code. (28910)
- Replace doctrine with comment-parser. (28615)
wp-env:
- Use Simple 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/. instead of NodeGit. (28848)
- Fix issue where mappings sources were not downloaded. (28930)
Changelog script: More fine-grained Changelogs for patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. releases. (28424)
End 2 End Tests:
- end-to-end Tests: Add gallery caption coverage. (29127)
- Add basic block preview coverage for inserter. (29117)
- Make navigation editor end-to-end tests more robust. (28936)
Testing: Add snapshot-diff. (28897)

Various

Add a 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. icon. (29232)
Update text color icon. (29212)
Blocks: Map block type definitions that use PHP naming convention for keys. (28953)
Safe access to window/document when in node context:
- FocalPointPickerGrid. (29070)
- Keycodes. (29069)
- dom-ready. (29068)
- ResizableBox utils. (29067)
- ScrollLock. (29038)

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.

Version	Loading Time	KeyPress Event (typing)
Gutenberg 10.1	5.3 s	30.11 ms
Gutenberg 10.0	5.7 s	29.62 ms
WordPress 5.6	4.1 s	35.47 ms

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

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

annezazu 5:54 pm on February 24, 2021
Tags: core-editor, core-editor-summary ( 61 )

Editor chat summary: 24 February 2021

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

Announcements

WordPress 5.6.2: a maintenance release with 5 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.
WordPress 5.7 RC: we’re officially in 5.7 RC period which means 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. will be published this week. Check out @noisysocks message here for more information about how you can help with some regressions.
Gutenberg 10.02: released yesterday to fix some bugs including a white screen on RTL languages.
Gutenberg 10.1 RC: released just before this meeting began!

As a reminder, 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/ 10.1 RC is being released this week to allow for a 1 week RC period before the stable release next week. Please test and report any problems.

Outside of the above, there are a few FSE Outreach Program updates to keep in mind:

Answers to Full Site Editing related questions have been shared across 5 posts found here. Check them out and expect future calls for questions! Big thank you to everyone who submitted questions, helped review answers, etc.
Help with the latest call for testing by building a simple homepage with 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. using site editing blocks. If you can’t test, it helps to also share the post with others if you’re open to it.

Monthly Priorities & Key Projects updates

With the Monthly Priorities detailed in this post in mind, key project updates were given:

Global Styles Update from @nosolosw

The main activity for the global styles focus has been around this effort to improve the block supports mechanism. A few things landed, but it still needs more work to be complete.

Navigation BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. Update from @mkaz

Making steady progress on improvements, bringing justification tools to sub-blocks, fix for CPT links, setup state, and a set of small tweaks. The biggest next up piece is menu overflow on mobile.

Full Site Editing Update from @youknowriad

All the big pieces needed for an MVPMinimum Viable Product "A minimum viable product (MVP) is a product with just enough features to satisfy early customers, and to provide feedback for future product development." - WikiPedia are already there and we need to iterate and improve the experience now. Riad has started exploring alignments/Group block and how themes should (or shouldn’t) define these alignments as a way to drastically improve the experience. For example, the wide/full flags we have for the post content editor are optimized for the post content and for backward compatibility but these notions don’t translate properly to a fully editable theme. Expect work to be done here!

Block Based 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. Update

The latest update for the Widgets Editor can be found here. The immediate priority is still to allow blocks to be added and edited in 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..

Task Coordination

@itsjonq

Updates on the new Component System project can be found here.
@sarayourfriend and I are continuing the integration into Gutenberg and are now ~20% of the way through.
Work continues on the UIUI User interface components along with ensuring the code/workflow feels right within the Gutenberg code base.
Have reached the stage where we’re looking to bring over the foundational systems over with the latest status here.

@mattchowning

Current work on Gutenberg for the mobile apps includes:

Reusable, embed, and search block
Finishing up Single-Page Starter Templates
Planning for global style support
Preparing to no longer allow users to switch to the Classic editor
Adding search to the block inserter
Dual-licensing Gutenberg

@annezazu

Launched 5 posts providing answers to FSE questions
Shipped the next call for testing.
Helped wrangle getting more translations in place for the current call for testing (have Spanish, Japanese, and Italian thus far thanks to some amazing people helping with translations)!

@paaljoachim

Triaging issues with the label “bug” and “needs design feedback” + made tracking issues.
Working on Learn Workshop for setup dev env site for coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
Looking into creating a new UI for the inline images and welcome thoughts.
Worked on issues included in WP 5.6.2.

@aristath

Block-styles loading improvements were merged this week, so now I’ll be focusing on ideas to allow for “hybrid” themes and allowing users to combine user-created templates with traditional themes. This will allow FSE to work on a per-template basis instead of a per-theme basis.
Lots of PR reviews to keep things moving.

@nosolow

Focused on the block supports mechanism.
Helped with some reviews, including help support TypeScript in the codebase or preparing dev notes for block supports.
Created a script that pulls data out of 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. ― if anyone is interested to take that and use it to improve our docs, they’ll be very welcome.
For next week: continue with block supports + unblocking quote block with inner blocks.

@bernhard-reiter

Big thank you to contributors who helped with a few PRs after my hallway hangout on e2e tests last week
I’d like to continue to increase our test coverage to make sure we don’t make the same mistake twice.
It’s greatly appreciated if people file issues to request those when they spot a 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. (Use the [Package] E2E Tests label.)

@ntsekouras

Prioritize core blocks in the inserter.
Query block setup with block patterns integration is ready and awaits for review.

Two open items that need help:

This tough issue causing duplicate uploads of a media file was raised by @paaljoachim > @bernhard-reiter is going to look into this more!
This issue around a problem with the custom gradient picker was raised by @thetwopct who would love feedback/help!

Open Floor

Is there a plan to support reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. router for navigation between adminadmin (and super admin) menu pages in the future? Raised by Mohamed Magdy.

After confirming this was asking about wp-admin, Riad and Miguel chimed in to say that this something JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors.-based isn’t in any Core WP plans right now and that it’s unlikely that will change. Riad mentioned that it might possibly happen iteratively in time but it isn’t currently an outright goal.

Is there anything you would like to include in March’s “What’s Next in Gutenberg” Post? Raised by @priethor.

@priethor is working on this post and asked for people to share any items they’d like to have included. Otherwise, a few contributors shared what they are planning to focus on in the month ahead:

FSE Outreach Program blurb.
Normalize toolbars and explore FSE alignments.
Block supports for Global Styles along with a link to the overall tracking issue.
Polishing the Query Block but no further foundation building work.
Add content-width option to global-styles & theme.json

Next Step: @priether will take the above and start writing the post.

Discussion around dropping IE11 support. Raised by @annezazu.

Here are some relevant links & previous discussions for context:

IE11 usage is below 1% according to https://gs.statcounter.com.
There was a previous discussion in early February in core-editor but it didn’t make it to a meeting as a topic.
There’s a tracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. issue with context here.
Here are three previous posts from 2017 related to a prior change in browser support shared by @desrosj: The New Editor and Browser Support, Continued Discussion on Browser Support, Target Browser Coverage.
Link to a yesterday’s discussion in the core-js meeting.
@youknowriad‘s exploration of the impact of dropping support on JS scripts showing that all scripts would end up being between 10% – 60% smaller.

The discussion was mainly in favor with a few warnings and words of wisdom. @youknowriad shared that last time support was dropped for older IE versions, it was around the same level of usage. @desrosjd noted that he’d love to see what exists in WP Core that is IE 11 specific, as this adjustment needs to be made in trunk as well and requires manually adjustments. @mkaz shared that there is an unknown question about screen readers and IE11, that we should get a solid answer to. Ultimately, we all agreed this makes for an ideal proposal on Make Core to discuss a policy before proceeding with specifics around implementation.

Next Step: @mkaz @annezazu @priethor will work on a proposal post focused on setting a policy before figuring out implementation with reviews from @youknowriad and @desrosj. If you’d like to help review this, just DM me (@annezazu on WP.org slack).

Who can help rename the main 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 trunk? Raised by @sarayourfriend.

Many months ago it was decided in this Make post to rename the main branch of git repositories to trunk. Sara opened an issue a while ago to plan this in Gutenberg but needs someone with both time and the right permissions to help out. Of note, this PR would need to be merged immediately after to fix CI issues and clean up the rest of the language in the repository.

There was some conversation about whether this could cause confusion or any unintended problems but it became clear that 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/ has made this quite seamless. Thankfully, as @mkaz pointed out, the PRs will automatically get updates, so it is more retraining yourself to git switch trunk or git rebase trunk.

Next Step: @youknowriad and @sarayourfriend are going to team up to take care of this on March 1st with planning details in this thread.

What’s the expected functionality for reusable blocks? Raised by @danstramer.

Dan re-flagged a prior question about reusable blocks trying to better understand what the expected functionality is. Specifically, he wanted to know where it was expected to be able to edit reusable blocks directly. This led to a conversation about improvements being shipped in 5.7 that should resolve these concerns!

#core-editor, #core-editor-summary

Ajit Bohra 7:15 pm on February 23, 2021
Tags: core-editor, core-editor-summary ( 61 ), editor ( 174 ), gutenberg ( 221 ), meeting notes ( 117 )

Editor chat summary: Wednesday, 17 February 2021

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.7 Beta 3

WordPress 5.7 Beta 3 is now available for testing!

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

Gutenberg 10.0 which means it’s the 100th release 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, the 100th release of a journey that started more than 4 years ago when Matt announced the project on WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. US 2016.

Monthly Plan

The monthly update containing the high-level items that Gutenberg contributors are focusing on for January are:

Global Styles.
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 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.
Navigation block.
Full Site Editing

For detailed plan check out monthly priorities post.

Updates on the key projects

@hypest

Global Styles side: working on scoping things out for native mobile for Colors Support.
Gallery Block: What changes we need to introduce to the Gallery block support on native mobile.

@nosolosw

Imporving global styles.
New area term in theme.json (@Addie)
PRs to improve code quality (@aristath) & consolidate APIs.
Expecting to start working on the new tasks for the 3rd iteration this, help us welcome.

@youknowriad

Good discussions with @aristath about potential upgrade paths and hybrid themes for FSE.
Please chime-in and review the attached PR

@vindl

Full Site Editing – Infrastructure and UI milestone update:

Foundational PR for semantic template parts has been merged. It registers wp_template_part_area 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. that allows us to assign categories to template parts. Currently, defined ones are 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., footer, 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 uncategorized.
Display of template parts has been grouped in the browsing sidebar.
Browsing sidebar now supports searching of content menus too.
The template tab has been added to Site Editor’s sidebar.
Block patterns can now be inserted at the non-root level. This allows the insertion of patterns into template parts among other things.
The persistent block navigator is getting close to being merged, awaiting for 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) feedback for it.

@Grzegorz

A brief update from the Navigation block:

Improved experience for the user creating their first menu.
Add menu name edition and moved it to the sidebar.

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.

@ajlende

A couple of PRs that I’ve been working on for a while now is finally ready for review!
Adding duotone filters to blocks, duotone is a lot like converting an image to black and white, but instead of just black and white, you can choose any two colors that you’d like (which makes it a lot more powerful than just a color or gradient overlay on top of the image).
Adding duotone filters to the image block. This one is probably best to review first as it’s more straightforward and doesn’t have any additional dependencies.
Adding duotone filters as a block supports the feature to make it easy for block authors to add duotone to their blocks. It shares a few of the commits from the image block PR, but was moved to a separate PR as it depends on some PHP changes in core for adding a render hook to WP_Block_Supports.
The video, media & text, and cover blocks have duotone support added via block supports in that PR.

@aristath

Work on improving performance & sustainability on the frontend is now finished & the PR was approved.
Working on finding a way to make hybrid classic/FSE themes possible.
Working on a prototype for skip-links in FSE.
Lots of PR reviews

@hypest

Quick update from the native mobile folks:

We now have support for setting Cover block focal point
Working on Reusable blocks, removal of the manual Classic editor switch, dual-licensing Gutenberg, the Search block, and Block transforms.

@youknowriad

Mostly focused on Reviews and Discussions.
Things like Gallery block refactor, Hybrid themes, and more flexible block supports are on the card.
Some small PRs in parallels like improving the creation flow for reusable blocks and template parts

@paaljoachim

Focus on triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors..
Helping to test bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes for WP 5.6.2.
Testing and improving docs for setup dev env + testing for CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..

@annezazu

Lots of FSE Outreach wrangling mainly focused on answering the wonderful 47 questions that came in.
Getting the next call for testing in place.
Discussing an approach to docs, and doing various testing/bug reporting.
Shipped an update to the Outreach page

@mcsf

following and discussing topics related to Global Styles and FSE

@itsjonq

Continuing work on adding/integrating the new components into Gutenberg (via WordPress/Components).
Work is lead by @sarayourfriend @gziolo, and me (additional help is welcome! Let us know if you’re interested)The immediate checklist we’re working through can be found in this 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/ issue.
For a simpler overview of the status, you can check out the status page
We’re almost 17% integrated! It’s still early, but it’s ramped up a ton from the earlier days where it was stuck around 3% for initial integration details.
Currently drafting up a post on this Components System project for make. I hope to publish it soon.

Open Floor

@paaljoachim

Asked about the list of various people and areas that are more focused on. The list will help to know whom to pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” while triaging. Some discussion around crafting list but no decision.
Aiming to conduct triage on Tuesday and hope that a few devs will also attend.
@mcsf suggested using intuition and experience to know who to ping instead of a scripted list.

Read complete transcript

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

annezazu 5:11 pm on February 22, 2021
Tags: core-editor, core-editor-agenda ( 62 )

Editor Chat Agenda: 24 February 2021

Facilitator and notetaker @annezazu

This is the agenda for the weekly editor chat scheduled for Wednesday, 24 February 2021, 14:00 UTC. This meeting is held in the #coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/.. All are welcome to join!

WordPress 5.7 RC 1 & WordPress 5.6.2
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/ 10.1 RC & a reminder of the celebration post for 100 releases.
Monthly Plan for February 2021 and key project updates:
- Global Styles.
- 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 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.
- Navigation block.
- Full Site Editing.
Task Coordination.
Open Floor.

Even if you can’t make the meeting, you’re encouraged to share anything relevant for the meeting in the comments below:

If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#core-editor #core-editor-agenda

Bernhard Reiter 3:23 pm on February 19, 2021
Tags: core-editor, e2e tests, end-to-end tests, gutenberg ( 221 ), hallwayhangout

Hallway Hangout: Fool me once — Writing end-to-end tests against regressions

On Thursday, I hosted a little walkthrough on how to write a simple end-to-end test to make sure a specific piece of editor functionality that had broken in the past wouldn’t break again.

As 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/ grows, the project sometimes experiences regressions: Features that used to work suddenly don’t anymore. In order to prevent these regressions from happening, contributors can write end-to-end (e2e) tests that cover a given piece of functionality and alert us when that functionality is broken. Combined with a Continuous Integration system such as 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/ Actions, this is a very powerful tool, since it can notify a PR author that their PR might break something before they even merge that PR.

I’ve recently tried to keep more track of such regressions, and have started filing issues requesting e2e tests to cover them. In the hangout, I’ve picked one of these issues and demonstrated how to write an e2e test for it.

Continue reading →

#core-editor, #e2e-tests, #end-to-end-tests, #gutenberg, #hallwayhangout

Riad Benguella 12:55 pm on February 17, 2021
Tags: core-editor, editor ( 174 ), gutenberg ( 221 ), gutenberg-new ( 86 )

What’s new in Gutenberg 10.0? (17 February)

This is 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/ 10.0, which means it’s the 100th release 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, the 100th release of a journey that started more than 4 years ago when Matt announced the project on WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. US 2016. (It’s also almost to the mark the 4th anniversary of the initial commit to the Gutenberg repository.)

I’m not going to lie, it was not an easy journey. Shipping something that impactful is not easy and, going in, there was no reason to believe in success: WordPress had already tried to replace TinyMCE a couple of times already. What would be different this time around? Not much probably, so initially very few people actually joined the project.

Six months later came WordCamp Europe 2017 and the first release of the plugin. The editor was nowhere close to being usable but it “clicked” for some, and the reactions to the presentation were hopeful.

However, then quickly came pushback. With all the attention that the project received, it became difficult to discern constructive debate from mere opposition. We each come with our own context, and some people had a fixed idea about what they wanted for the project. Some wanted to just reuse an existing page builder, others wanted to revive the Fields 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. project, some wanted it to be front-end-first, others wanted it to just replace the content area of the classic editor, some wanted it to be in Vue.JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors., others wanted no change at all. With a product used by 40% of the web, we need to find consensus, and when we make compromises it can be so difficult for those involved to avoid the feeling that their voice is being ignored.

We also made quite a few mistakes: stability of some releases wasn’t so great, performance suffered in others, 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) as well… Nonetheless, we kept pushing forward, improving the editor and the project in all aspects until its first inclusion in WordPress 5.0, and we haven’t stopped since.

It’s a delight to see some people who had very strongly disagreed with the initial vision or approach to Gutenberg gradually come to enjoy using the editor and join the project to carry on its vision. Others might still not like it, some won’t ever use it. One thing is certain though, we’ll continue doing our best to push forward, improve what’s already shipped and ship new exciting features; we’ll continue making mistakes and hopefully continue learning from them.

Today marks the 100th release of Gutenberg. Nothing extraordinary, just a regular release: it improves on the existing features, fixes bugs, adds new features and experiments with new ideas.

What I personally retain is the people, the ones who were with us from the start, the ones who were with us but left, the ones who joined in our journey, everyone who helped along the way, everyone who provided feedback, everyone who got their hands dirty and everyone who tried to use this editor, extend it, and provide ideas.

Thank you all.