JavaScript Chat Summary: May 12, 2020

Below is a summary of the discussion from this week’s 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/. chat (agenda, Slack Transcript).

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

@wordpress/scripts CSSCSS Cascading Style Sheets. support

(Slack conversation)

Pull request: https://github.com/WordPress/gutenberg/pull/21730

Discussion topics:

  • There was surprise that this wasn’t already supported.
  • The pull request will add a new package @wordpress/postcss-plugins-preset, which would provide a default set of WordPress’ preferred PostCSS plugins configuration.
    • Similar to @wordpress/babel-preset-default@wordpress/jest-preset-default@wordpress/prettier-config
  • Question: Was there any consideration for CSS-in-JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors.? (styled-components)
    • Needs clarity on desired end-goal
    • Still valuable for 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 regardless, if it’s easy enough feature to simply not use if they’d prefer to use an alternative approach.
  • Advantages: Dead code elimination and bundle splitting for CSS
  • It was suggested to request feedback from the CSS group

Action items:

@wordpress/create-block third-party templates

(Slack conversation)

Pull request: https://github.com/WordPress/gutenberg/pull/22175

Discussion topics:

  • It could help to support flexibility of third-party templates, in order to alleviate pressure for first-party templates to support all features.
  • Concern: Is it the purpose of the tool to support third-party templates? If so, why not use something like Yeoman?
    • Counter-point: It’s not unlike Yeoman, but utilizes NPM’s own npm init <initializer> functionality. They’re comparable, but it’s not necessarily a criticism.
    • Suggestion: Focus less on third-party template flexibility, more on first-party “knowledge of blocks”, including additional commands and customizations.
    • Point of contention: Should customizability come from third-party templates, or first-party support?

Action items:

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

(Slack conversation)

Topic: Should the block editor provide a stable way to connect server and client data? For example, associate posts to blocks using post 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..

Additional context can be found in the agenda document.

Discussion topics:

  • Question: Is this suggesting some value saved in post meta which corresponds to individual blocks of a post?
    • Answer: Yes
  • Question: What’s the use-case? Is there an example?
    • Answer: It’s needed for the image block.
  • It might be something which is fine to have an ad hoc implementation specific to one or a few blocks, if it’s not a common requirement.
  • Concern: Duplicating data can risk desync (see related post)

Action items:

  • Create an issue which describes the use-case and requirements (Owned by: @sageshilling)

Open Floor

Miscellaneous Updates

@aduth shared a number of updates from the past week:

The coding guidelines documentations we discussed last week are most all merged:
https://github.com/WordPress/gutenberg/pull/22090
https://github.com/WordPress/gutenberg/pull/22030
https://github.com/WordPress/gutenberg/pull/22029

That last one prompted the idea for a new ESLint rule, currently in progress, but potentially blocked on the fact that there appears to be legitimate cases for wanting the “gotcha” behavior.
https://github.com/WordPress/gutenberg/pull/22041

Now pinning .nvmrc to specify Node version in 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/, to avoid issues when running on older branches:
https://github.com/WordPress/gutenberg/pull/22236
(As far as I know, CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. does the same)

ESLint 7.0 was released the other day, which notably includes an interesting feature to allow comments within the inline configuration 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.)
https://eslint.org/blog/2020/02/whats-coming-in-eslint-7.0.0
Example:
/* eslint-disable no-new -- this class has a side-effect in the constructor. */
Very relevant for this previously-suggested rule proposal: https://github.com/WordPress/gutenberg/pull/16795

@sageshilling shared features announced in Next.js 9.4.

News Roundup

This roundup contains a few links for Gutenberg and JavaScript related news curated (and commented on) by @nerrad.

#core-js, #javascript