What’s new in Gutenberg? (16 October)

Work on stability and performance continues, and these 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 have now been included in WordPress 5.3 RC 1.

In addition, this release starts the work on gradient backgrounds. First, the support is added to the Button 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.. Improvements to the gradients palette 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. and support in more blocks will be worked on for future releases.

Storybook

For Developers, this release also introduces a Storybook.

Accessible on this link for the master version, but also available on each Pull Request (https://deploy-preview-{PR_number}--gutenberg-playground.netlify.com/design-system/components/). Storybook is an isolated environment where the reusable WordPress UIUI User interface components (@wordpress/components) are developed, tested and showcased.

Down the road, the netlify integration and the exact URLs can be adapted. This tool is meant to be directly integrated into WordPress Developer Docs.

6.7 🇯🇵

Features

• Add gradient backgrounds support to the Button block.

Bug Fixes

• 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. : Include the plural version of the “remove block” string.
• Update dropdown menu items to match hover style in other places.
• Smoothly reposition Popovers on scroll.
• Fix margin styles for Gallery and Social links blocks.
• Fix popovers hidden on mobile.
• Ensure sidebar plugins do not get auto-closed when opened on small screens.
• Fix the design of the Checkbox component in IE11.
• Add has-text-color classname to heading block.
• Prevent figure margin reset CSS from being included in the frontend.
• Fix the scaling of the pinned plugins menu icons.
• Fix Heading and paragraph colors not applied inside the cover block.
• Close Nux tips when clicking outside the tip.
• Fix meta attribute source for post types other than post.
• Fix ”Open in New Tab” not being persisted.
• Fix redo behavior and expand test coverage.
• I18n: Fix missing translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. for the “All content copied” string.
• Fix the block preview padding in themes with custom backgrounds.
• Fix merging list blocks with indented list items.
• Fix inline image controls display condition.
• Fix clicking the redirect element focuses the inserted paragraph.
• Fix editing meta attributes with multiple set to true.
• Add No Preview Available text to the inserter preview panel.
• Prevent block controls from disappearing when switching the List block type.
• Avoid trailing space at the end of a translatable string.
• Fix left aligned nested blocks.
• Fix the top margin of the RadioControl help text.
• Fix invalid HTML used in the Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. panel.
• Make sure that all edits after saving are considered persistent by default.
• Ensure that sidebar is closed on the first visit on small screens.
• Update the columns block example to avoid overlapping issues.
• Remove unnecessary default styles for H2 heading inside Cover blocks.
• Fix Media & Text block alignment in IE11.
• Remove unnecessary padding in the Columns block.
• Fix the Columns block height in IE11.
• Correctly update RichText value after undo.
• Prevent the snackbar link components from hiding on focus.
• Fix block toolbar position in IE11.
• Retry uploading images on failures.

Performance

• Avoid continuously reset browser selection (improve typing performance in iOSiOS The operating system used on iPhones and iPads.).

Enhancements

• Polish FontSize Picker design.
• Use body color for the post publish panel.
• Limit the width and height of the pinnable plugins icons.
• Add a max width to the Search block input.

Experiments

• Menu Navigation block:
• Implement initial state containing top level pages.
• Fix menu alignment.
• Fix the classname in frontend.
• Block Directory
• Change the relative time string.
• Widgets Screen
• Fix the styling of the inspector panel.

Documentation

• Fix @wordpress/data-controls examples.
• Typos and tweaks: 1, 2.

Various

• Introduce the @wordpress/env package, A zero-config, self-contained local WordPress environment for development and testing.
• Add Storybook to develop and showcase UI components:
• Add ButtonGroup component.
• Add ScrollLock component.
• Add Animate component.
• Add Icon and IconButton components.
• Add ClipboardButton component.
• Add ColorIndicator component.
• Remove RichText wrapper and use Popover for the inline toolbar.
• Improve the way the lock file handles local dependencies.
• Refactor ColorPalette by extracting its design.
• Improve E2E test reliability by consuming synchronous data and bailing on save failure.
• Replace the isDismissable prop with isDismissible in the Modal component.
• Add eslint-pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party-jest to the default wordpress/scripts linting config.
• Update wordpress/scripts to use the latest version of webpack for build and start commands.
• Cleanup Dashicon component.
• Update the Excerpt help link.
• Release tool: fix wrong package.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. used when bumping the stable released version.
• Fix several typos in code and files.
• Update E2E tests to accommodate WP 5.3 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 changes.
• Define the “sideEffects” property for wordpress packages.
• Add nested embed e2e test.
• I18N: Always return the translation file prefixed with gutenberg-.
• Use wp.org CDN for images used in block preview.

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~ 36000 words, ~ 1000 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)
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/ 6.7.0	5.52s	51.98ms
Gutenberg 6.6.0	5.57s	51.47ms
WordPress 5.2	6.53s	61.13ms

---

👏 Kudos to all the contributors. Thank you.

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