Dev Chat summary: December 11, 2019

@davidbaumwald facilitated based on this agenda; @marybaum is your faithful reporter.

You can find the full transcript here.

Announcements and highlighted posts

No announcements, but David and the crew highlighted these posts. If you have thoughts, be sure to get your comments in as soon as possible if you want them to hit the 5.4 milestone:

@audrasjb added this dev note from 5.3.1:

Upcoming Releases

5.3.1

@audrasjb updated the group on 5.3.1.

Before Tuesday’s release of the RC1, the team got the milestone completely clear, to the tune of 44 tickets, and issued props to @sergeybiryukov and @azaozz for final commits and the build.

Some new/reopened tickets landed in the milestone after the release, so @audrasjb planned at RC2 for shortly after the chat and then the final release of 5.3.1 on Thursday. (ed. note: That all did happen as planned.)

5.4

Taking back the mic, @davidbaumwald reminded the group about the 5.4 call for tickets. Please publicize!

Components

@davidbaumwald formally welcomed @imath to the group. He and David have adopted the Comments component.

Two other Components, the Filesystem API and Rewrite Rules, still need maintainers.

Open Floor

Holiday scheduling

@carike asked if #devchat would meet this coming week, on December 18.

After a bit of discussion, @azaozz confirmed that we would, but would not meet on December 25 or January 1.

Happy holidays if you celebrate any; please accept two more hours in your week(s) otherwise!

Webfonts API

@carike brought up ticket #46370, a new feature request, that proposes building a webfonts API to register and enqueue web fonts.

You can find the discussion here.

#5-3-1, #5-4-2

JavaScript Chat Summary: December 10, 2019

Below is a summary of the discussion from this week’s JavaScript chat (agendaSlack Transcript).

Have a topic for discussion for the next meeting? Leave a suggested edit on next week’s agenda.

Follow-Up: JSDoc Guidelines

(Slack conversation, previous meeting summary)

Proposed JSDoc guidelines were merged since the last meeting. They are available in a readable format in its own section in the Coding Guidelines for Gutenberg.

Discussion:

In the previous week, we talked about having some new conventions to support what we need for the types effort summarized in the tracking issue on GitHub.

@aduth shared that as he’s been working through these tasks (PR for Priority Queue package), he’s already found a few other things that might be worth contemplating. He has a sense this could be an evolving standard or at least a need for some additional clarity in specific cases as noted in the agenda:

  • Explicit recommendation on types capitalization ({Object} vs. {object}).
  • @see vs. @link correctness – the current guidelines are mistaken in treating @link as a non-inline tag.

The eslint-plugin-jsdoc plugin we now use in Gutenberg has most of the “defaults” we had already been preferring for some time. The point is to make this explicit in the recommendations, as well.

Prettier

(Slack conversation)

There were proposed revisions to JavaScript Coding Standards for Prettier compatibility.

Discussion:

There have been a couple of comments on the post already. Still, they don’t seem to be directly relevant for what’s being considered in these revisions, and more to the quality of the document generally-speaking.

There is also this question of how we document the expected way of using Prettier. @aduth assumed there’s some need for editor integration or pre-commit script for these formattings to take effect. He also emphasized that when doing anything on that front, we should be preemptive about making this as minimally-disruptive as possible.

Actions:

  • Let’s wait until next Tuesday to make any “decisions” since one day of soliciting feedback might not be enough.

Date Library in Gutenberg

(Slack conversation)

@davilera tried to use wp.date and encountered an issue, which somebody had already reported. We need some feedback on the proposed PR from those who worked on dates more closely in the past. In the current shape, the library is currently hard to work with, and therefore developers are forced to implement workarounds.

Open Floor

Currently, there is only simple support for block scaffolding in WP-CLI that generates code that runs in the browser without the need for a build step. It’s documented here.

@gziolo ported this script to work with Node.js without the need to have an active installation of WordPress. The plan is to introduce the concept of templates and provide the default support for ESNext, JSX and all modern JavaScript tooling installed out of the box with the single command from CLI:

npm init wordpress-block
npm init wordpress-block
Npm package in action.

Bonus item:

https://react.christmas/

#core-js, #javascript

WordPress 5.3.1 RC 2

WordPress 5.3.1 Release Candidate 2 (RC 2) is now available for testing!

You can test it in one of two ways:

What’s in this release candidate?

Beyond the tickets that were already fixed in WP 5.3.1 RC 1, this second release candidate includes three new patches, on these three tickets:

  1. #48943: comment_form() expects optional “email” field to be passed
  2. #47069: The admin bar on the front end has reduced functionality and bugs when jQuery not being used (reopened for some improvements)
  3. #48927: Aesthetic Issues with Language Select on Install introduced in 5.3.1 RC1

Final release is planned for December 12th.

Thanks @marybaum for proof-reading this post and @sergeybiryukov for building the packages.

#5-3-1, #minor-releases

Editor chat summary: Wednesday, 11 December 2019

This post summarizes the latest weekly Editor meeting, held in the #core-editor Slack channel, on Wednesday, December 11, 2019, 14:00 UTC.

Gutenberg 7.1.0

  • Gutenberg 7.1.0 is released.
  • Massive progress on full site editing experience.
  • Some of the feature highlights:
    • New welcome UI in place of tips.
    • Table captions and UI to toggle between edit and select mode.
    • New fixed toolbar for mobile.
    • Improved multi-block selection experience.
  • This is a big release with 161 pull requests merged, for details checkout release post.

Weekly Priorities

  • Full site editing / block content areas
  • Block patterns API
  • Improvements to the Block UI  
  • Tightening up items

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.

@youknowriad

@karmatosed

@mkaz

@aduth

@gziolo

  • Refactoring to the block toolbar, including some visual tweaks
  • Iterations to Build Tools: Integrate DependencyExtractionWebpackPlugin in the JS build https://core.trac.wordpress.org/ticket/48154
  • Reviews, including some learnings about TypeScript, JSDoc, etc.
  • Ported wp-cli scaffold block to npm init wordpress-block – this generates ES5 JS code, I plan to provide ESNext +JSX template as an option next week

Open Floor

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

Admin form controls height and alignment standardization in WordPress 5.3.1

WordPress 5.3 introduced some notable Admin CSS changes to improve administration accessibility and consistency with the block editor.

These changes made more obvious that form controls heights and alignments were not consistent across WP Admin.

Before WordPress 5.3, there were already some inconsistencies between form controls. For reference, WordPress 5.2 form controls various alignments and heights are grouped in the screenshot below:

Form controls alignment and height inconsistencies in WordPress 5.2

WordPress 5.3 Admin CSS changes brought more attention to those general inconsistencies on form controls. And several users and contributors reported these inconsistencies as regressions from 5.3.

Example of form controls inconsistencies in WordPress 5.3

Although these inconsistencies cannot be considered as regressions from 5.3 since they existed before 5.3 Admin CSS changes, WordPress 5.3.1 introduces some fixes on heights and alignments.

5.3
5.3.1
5.3
5.3.1
5.3
5.3.1

WordPress 5.3.1 changes include:

  • Standardized height basis of 30px for all form controls
  • Consistent line height basis of 30px across the interface
  • 14px font size basis for select controls option text
  • Remove various top/bottom margin and padding

These changes are part of a continuous effort to improve styling and consistency of all form controls in the WordPress admin pages. In general, plugin authors and WordPress developers are encouraged to:

  • remove any fixed height: flexible heights are now the WordPress recommended standard to allow form controls to better scale with text zoom
  • remove any custom top and bottom padding values
  • remove any custom line-height value
  • remove any custom min-height value
  • update custom focus/hover styles on custom UI components to match the new WordPress focus/hover styles

For full details about these changes, see the related changeset on WordPress Trac. WordPress developers and plugin authors may also want to visit the related Trac ticket: #48420

#5-3-1, #core-css, #dev-notes

What’s new in Gutenberg? (11 December)

Gutenberg 7.1 is a big release with 161 pull requests merged. Thank you to all the contributors of this release!

The release contains many refactors to the code base to make future changes possible, e.g., refactors to functional components so it is possible to use new hooks that are available.

This release tries to make block development using standard features like color picking UI easier. To do that the release expands the useColors hook to have new functionalities like color contrast checking and default color detection.

There was huge progress on the full site editing work, with the merge of the template part block. Documentation efforts for the FSE (full site editing) work are now in progress.

Gutenberg 7.1 brings a new welcome UI for new users:

This release also Introduces table captions and implements a UI mechanism to toggle between edit and select modes:

The last two enhancements to note are the new fixed-mobile toolbar and the improved multi-block selection experience:

7.1 🇲🇽

Features

Enhancements

Bug Fixes

APIs

Experiments

Documentation

Performance

Various

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)
Gutenberg 7.1.0 7.45s 88.56ms
Gutenberg 7.0.0 6.84s 94ms
WordPress 5.3 6.33s 75.19ms

#core-editor, #editor, #gutenberg

Dev Chat Agenda for December 11, 2019

Here is the agenda for the weekly meeting happening later today: Wednesday, December 11, 2019, at 09:00 PM UTC.

Announcements

Upcoming Releases

Highlighted Blog Posts

Blog Posts Needing Review/Feedback/Help

Components Check-in

Open Floor


If you have anything to propose for the agenda or specific items related to those listed above, please leave a comment below.

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

#agenda, #core, #devchat

Alternate color schemes changes in WordPress 5.3.1

WordPress 5.3 added some noteworthy CSS changes to WordPress Admin. These changes also impacted alternate color schemes, especially concerning secondary buttons.

Indeed, secondary button borders unexpectedly inherited their scheme’s primary color, which resulted in arguable visual aspect and poor readability for most color schemes.

“Blue” alternate color scheme in WordPress 5.3
“Coffee” alternate color scheme in WordPress 5.3
“Midnight” alternate color scheme in WordPress 5.3

A bug also occurred on :active state, where the background color of the button was quite the same than the text color.

On the right: secondary button with :active state on “Blue” color scheme in WordPress 5.3
On the right: secondary button with :active state on “Midnight” color scheme in WordPress 5.3

WordPress 5.3.1 will fix these issues by unifying WP-Admin secondary buttons for all alternate color schemes.

Secondary button styles will be the same for all bundled alternate color schemes. This change also fixes the :active state CSS issue.

Please note this change also introduces some hardcoded colors for both gray borders and texts. Plugin authors who provide specific support for alternate color schemes can use these new hardcoded colors.

New secondary button CSS/Sass styles in WP 5.3.1:

.button {
	border-color: #7e8993;
	color: #32373c;
}

.button:hover {
	border-color: darken( #7e8993, 5% );
	color: darken( #32373c, 5% );
}

.button:focus {
	border-color: #7e8993;
	color: darken( #32373c, 5% );
	box-shadow: 0 0 0 1px #32373c;
}

See /wp-admin/css/colors/_admin.scss.

New CSS styles for secondary buttons in alternate color schemes:

Secondary buttons in WordPress 5.3.1
“Midnight” alternate color scheme in WP 5.3.1
“Coffee” alternate color scheme in WP 5.3.1

For reference, see the related Trac tickets: #48585 and #48598.

#5-3-1, #accessibility, #core-css, #dev-notes

Editor Chat Agenda: 11 December, 2019

Note taker: @ajitbohra

This is the agenda for the weekly editor chat scheduled for 2019-12-11 14:00 UTC.

This meeting is held in the #core-editor channel in the Making WordPress Slack.

  • Gutenberg 7.1.0
  • Weekly Priorities
  • Task Coordination
  • Open Floor

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#editor-chat

WordPress 5.3.1 RC 1

WordPress 5.3.1 Release Candidate 1 (RC 1) is now available for testing!

There are two ways to test the WordPress 5.3.1 release candidate: try the WordPress Beta Tester plugin (you’ll want to select the point release nightlies option), or you can download the release candidate here (zip).

What’s in this release candidate?

5.3.1 features 44 bug and regression fixes, including improvements concerning the block editor, Twenty Twenty bundled theme, accessibility focus, Admin CSS, internationalization, media, date/time…

Here’s the full list:

  • #30429: wp.newPost gets non-GMT date calculation wrong
  • #31245: Replace alloptions with a key cache
  • #42437: Thumbnails can overwrite other uploads if filename matches
  • #48271: Media Library: Tab structure does not use tab semantics
  • #48313: Administration email verification uses the site locale instead of the user’s locale
  • #48324: Undefined index: full in/wp-includes/media.php on line 214
  • #48334: Allow the remind interval for the admin email verification to be filtered
  • #48355: Media: add semantic indication for the buttons group active state
  • #48371: Update sodium_compat to v1.12.1
  • #48376: Update kses safecss_filter_attr function to allow gradient backgrounds
  • #48406: Dashboard: Some links can be identified as such only by their color
  • #48409: Menus: form controls disabled only visually when creating a new menu
  • #48420: Admin CSS: standardize form controls heights, alignments, etc.
  • #48550: Twenty Twenty: Customizer option to show or hide author bio
  • #48551: Twenty Twenty: Replace JS-based smooth scroll with CSS
  • #48582: Better to have some hover effects on credits list
  • #48585: Color contrast changes impact color schemes negatively
  • #48588: Unable to Replace Image in Image widget is using “Insert from URL”
  • #48592: About display of tag cloud widget
  • #48598: :active button color issue in all color schemes except for “Default”
  • #48601: Twenty Twenty: document.body is null
  • #48606: Some date formats get incorrectly output in Italian
  • #48619: Twenty Twenty: Author bio and bottom post meta misaligned on mobile
  • #48623: WP 5.3 time problem causes day number shifts in permalinks
  • #48624: Twenty Twenty: Duplicate array key/value in TwentyTwenty_Non_Latin_Languages::get_non_latin_css
  • #48652: Twenty Twenty: Input wp-comment-cookies-consent Checkbox in Comment Form is Too Small
  • #48674: Typo in wp_credits_section_title documentation
  • #48675: mysql2date adding timezone offset when given GMT time
  • #48688: TwentyTwenty: Issue with instagram oembed css
  • #48692: Add PHP time zone check to Site Health
  • #48696: Remove the CollegeHumor oEmbed provider
  • #48704: Twenty Twenty: Spelling correction of a variable and inline documentation.
  • #48725: Additional Capabilities list displayed in user-edit broke after 5.3 update
  • #48736: Exclude PNG images from scaling after upload
  • #48763: Twenty Twenty: SmoothScroll is broken
  • #48815: Select comment checkbox is partially hidden on pending comments in mobile
  • #48866: TwentyTwenty: Paginated comments don’t work
  • #48876: Twenty Twenty: High input fields are misaligned in Firefox
  • #48884: Update WordPress packages with fixes targeted for 5.3.1
  • #48906: Twenty Twenty: Add context for twentytwenty_start_of_post_meta_list and twentytwenty_end_of_post_meta_list
  • #48907: Media Editor: Consistent width for Scale and Crop inputs
  • #48918: Twenty Twenty: echoing bloginfo()
  • #48599: Warning: count(): Parameter must be an array or an object that implements Countable in ../wp-admin/includes/plugin.php on line 1392
  • #47069: Twenty Nineteen: the admin bar on the front end has reduced functionalities and bugs due to jQuery not being used

#5-3-1, #minor-releases