Make WordPress Core

Opened 2 years ago

Closed 2 years ago

Last modified 2 years ago

#54337 closed task (blessed) (fixed)

Update @wordpress packages and add Site Editor from Gutenberg plugin into Core

Reported by: noisysocks's profile noisysocks Owned by: noisysocks's profile noisysocks
Milestone: 5.9 Priority: normal
Severity: normal Version:
Component: Editor Keywords: has-patch has-unit-tests
Focuses: Cc:

Description

Attachments (1)

54337.add_query_arg.diff (558 bytes) - added by sabernhardt 2 years ago.
editing add_query_args to add_query_arg

Download all attachments as: .zip

Change History (55)

#1 @noisysocks
2 years ago

  • Owner set to noisysocks
  • Status changed from new to accepted

This ticket was mentioned in PR #1804 on WordPress/wordpress-develop by noisysocks.


2 years ago
#2

  • Keywords has-patch has-unit-tests added

Still very much a WIP. We can't properly finish this until Gutenberg 11.9 RC is released and its packages are published to npm. It's also likely that many things will be broken until Core-54335 and Core-54336 are committed.

To do:

  • [ ] Add changes from lib/blocks.php.
  • [ ] Add site editor wp-admin page and link to it in the sidebar.
  • [ ] Add navigation CPT.
  • [ ] Maybe: Add changes from lib/pwa.php.
  • [ ] Update with changes published to npm from Gutenberg 11.9 RC.

Trac ticket: https://core.trac.wordpress.org/ticket/54337

noisysocks commented on PR #1804:


2 years ago
#3

@aristath: Could you please help me patch Core with the changes below? I'm unsure where in Core they need to go. They come from https://github.com/WordPress/gutenberg/pull/31239 and https://github.com/WordPress/gutenberg/pull/32510.

{{{diff
diff --git a/lib/blocks.php b/lib/blocks.php
index 14a8811abe..d0f6dede5a 100644
--- a/lib/blocks.php
+++ b/lib/blocks.php
@@ -194,6 +205,50 @@ function gutenberg_register_core_block_assets( $block_name ) {

wp_register_style( "wp-block-{$block_name}", false );

}


+ If the current theme supports wp-block-styles, dequeue the full stylesheet
+
and instead attach each block's theme-styles to their block styles stylesheet.
+ if ( current_theme_supports( 'wp-block-styles' ) ) {
+
+ Dequeue the full stylesheet.
+
Make sure this only runs once, it doesn't need to run for every block.
+ static $stylesheet_removed;
+ if ( ! $stylesheet_removed ) {
+ add_action(
+ 'wp_enqueue_scripts',
+ function() {
+ wp_dequeue_style( 'wp-block-library-theme' );
+ }
+ );
+ $stylesheet_removed = true;
+ }
+
+ Get the path to the block's stylesheet.
+ $theme_style_path = is_rtl()
+ ? "build/block-library/blocks/$block_name/theme-rtl.css"
+ : "build/block-library/blocks/$block_name/theme.css";
+
+
If the file exists, enqueue it.
+ if ( file_exists( gutenberg_dir_path() . $theme_style_path ) ) {
+
+ if ( file_exists( gutenberg_dir_path() . $style_path ) ) {
+ If there is a main stylesheet for this block, append the theme styles to main styles.
+ wp_add_inline_style(
+ "wp-block-{$block_name}",
+ file_get_contents( gutenberg_dir_path() . $theme_style_path )
+ );
+ } else {
+
If there is no main stylesheet for this block, register theme style.
+ wp_register_style(
+ "wp-block-{$block_name}",
+ gutenberg_url( $theme_style_path ),
+ array(),
+ $default_version
+ );
+ wp_style_add_data( "wp-block-{$block_name}", 'path', gutenberg_dir_path() . $theme_style_path );
+ }
+ }
+ }
+

if ( file_exists( gutenberg_dir_path() . $editor_style_path ) ) {

wp_deregister_style( "wp-block-{$block_name}-editor" );
wp_register_style(

@@ -460,4 +516,114 @@ function gutenberg_migrate_old_typography_shape( $metadata ) {

return $metadata;

}


-add_filter( 'block_type_metadata', 'gutenberg_migrate_old_typography_shape' );
+if ( ! function_exists( 'wp_migrate_old_typography_shape' ) ) {
+ add_filter( 'block_type_metadata', 'gutenberg_migrate_old_typography_shape' );
+}
+
+if ( ! function_exists( 'wp_enqueue_block_style' ) ) {
+ /
+ * Enqueue a stylesheet for a specific block.
+ *
+ * If the theme has opted-in to separate-styles loading,
+ * then the stylesheet will be enqueued on-render,
+ * otherwise when the block inits.
+ *
+ * @param string $block_name The block-name, including namespace.
+ * @param array $args An array of arguments [handle,src,deps,ver,media].
+ *
+ * @return void
+ */
+ function wp_enqueue_block_style( $block_name, $args ) {
+ $args = wp_parse_args(
+ $args,
+ array(
+ 'handle' => ,
+ 'src' =>
,
+ 'deps' => array(),
+ 'ver' => false,
+ 'media' => 'all',
+ )
+ );
+
+ /

+ * Callback function to register and enqueue styles.
+ *
+ * @param string $content When the callback is used for the render_block filter,
+ * the content needs to be returned so the function parameter
+ * is to ensure the content exists.
+ *
+ * @return string
+ */
+ $callback = function( $content ) use ( $args ) {
+ Register the stylesheet.
+ if ( ! empty( $argssrc? ) ) {
+ wp_register_style( $argshandle?, $argssrc?, $argsdeps?, $argsver?, $argsmedia? );
+ }
+
+
Add path data if provided.
+ if ( isset( $argspath? ) ) {
+ wp_style_add_data( $argshandle?, 'path', $argspath? );
+
+ Get the RTL file path.
+ $rtl_file_path = str_replace( '.css', '-rtl.css', $argspath? );
+
+
Add RTL stylesheet.
+ if ( file_exists( $rtl_file_path ) ) {
+ wp_style_add_data( $argshanle?, 'rtl', 'replace' );
+
+ if ( is_rtl() ) {
+ wp_style_add_data( $argshandle?, 'path', $rtl_file_path );
+ }
+ }
+ }
+
+ Enqueue the stylesheet.
+ wp_enqueue_style( $argshandle? );
+
+ return $content;
+ };
+
+ $hook = did_action( 'wp_enqueue_scripts' ) ? 'wp_footer' : 'wp_enqueue_scripts';
+ if ( wp_should_load_separate_core_block_assets() ) {
+ $hook = "render_block_$block_name";
+ }
+
+
Enqueue assets in the frontend.
+ add_filter( $hook, $callback );
+
+ Enqueue assets in the editor.
+ add_action( 'enqueue_block_assets', $callback );
+ }
+}
+
+/
+ * Allow multiple block styles.
+ *
+ * @param array $metadata Metadata for registering a block type.
+ *
+ * @return array
+ */
+function gutenberg_multiple_block_styles( $metadata ) {
+ foreach ( array( 'style', 'editorStyle' ) as $key ) {
+ if ( ! empty( $metadata[ $key ] ) && is_array( $metadata[ $key ] ) ) {
+ $default_style = array_shift( $metadata[ $key ] );
+ foreach ( $metadata[ $key ] as $handle ) {
+ $args = array( 'handle' => $handle );
+ if ( 0 === strpos( $handle, 'file:' ) && isset( $metadata['file'] ) ) {
+ $style_path = remove_block_asset_path_prefix( $handle );
+ $args = array(
+ 'handle' => sanitize_key( "{$metadataname?}-{$style_path}" ),
+ 'src' => plugins_url( $style_path, $metadatafile? ),
+ );
+ }
+
+ wp_enqueue_block_style( $metadataname?, $args );
+ }
+
+
Only return the 1st item in the array.
+ $metadata[ $key ] = $default_style;
+ }
+ }
+ return $metadata;
+}
+add_filter( 'block_type_metadata', 'gutenberg_multiple_block_styles' );
}}}

aristath commented on PR #1804:


2 years ago
#4

@aristath: Could you please help me patch Core with the changes below? I'm unsure where in Core they need to go. I suspect much of it can be simplified. They come from WordPress/gutenberg#31239 and WordPress/gutenberg#32510.

PR: https://github.com/noisysocks/wordpress-develop/pull/1
This includes both commits, properly backported for core.
The only thing that needs to be done for them is to make sure that the theme.css, files (including .min & RTL variants) get copied over as well. I think though that this will require a PR in Gutenberg so I'm taking a look at it now 👍

noisysocks commented on PR #1804:


2 years ago
#5

The only thing that needs to be done now is to actually include the theme.css, files (including .min & RTL variants) for blocks. Unfortunately I have no idea how to do that, @noisysocks do you know how to do that?

I think this already works? I see code in tools/webpack/blocks.js which should copy all .css files and I see build/wp-includes/blocks/table/theme.min.css and build/wp-includes/blocks/table/theme-rtl.min.css after I run grunt build.

https://github.com/WordPress/wordpress-develop/blob/4a67a9774a3c1bfb8e9ce30ba05705c324d6fc97/tools/webpack/blocks.js#L116-L117

#6 @youknowriad
2 years ago

In 52042:

Block Editor: Update the WordPress Packages based on Gutenberg 11.9 RC1.

This brings the JS packages up to date and is the first step that will allow us
to include the other block editor updates for WordPress 5.9:
FSE infrastrucutre, site editor and global styles.

Props noisysocks.
See #54337.

noisysocks commented on PR #1804:


2 years ago
#7

I'm having Docker issues while running tests/gutenberg/run.js. I gave this branch a rough smoke test though and things seem okay bar a few issues to do with styling and the Navigation block. I'm going to commit this now so that it's in before the feature freeze and then we can work on fixing issues as follow-up commits.

#8 @noisysocks
2 years ago

In 52069:

Add Site Editor and PHP changes from Gutenberg 10.1 - 11.9

  • First pass at adding the site editor from the Gutenberg plugin to wp-admin/site-editor.php.
  • Adds miscellaneous PHP changes from Gutenberg 10.1 - 11.9.

Follows [52042].
See #54337.
Props youknowriad, aristath, hellofromtonya, gziolo.

noisysocks commented on PR #1804:


2 years ago
#9

To confirm, here are the follow up tasks:

  • [ ] Run tests/gutenberg/run.js, fix failures.
  • [ ] Hide Customize link etc. from menu bar for FSE themes.
  • [ ] Add Navigation PHP. (Recent changes from lib/navigation.php, tests in phpunit/navigation-test.php.)
  • [ ] Un-comment sourcemap validation from Gruntfile.js.
  • [ ] Add test for get_block_editor_theme_styles().
  • [ ] Remove unnecessary migration from navigation.php Add Site Editor and PHP changes from Gutenberg 10.1 - 11.9 #1804 (comment)
  • [ ] Remove unnecessary code from navigation-area.php Add Site Editor and PHP changes from Gutenberg 10.1 - 11.9 #1804 (comment)
  • [ ] Fix edit-site stylesheet in plugin.

This ticket was mentioned in Slack in #core-editor by noisysocks. View the logs.


2 years ago

This ticket was mentioned in PR #1842 on WordPress/wordpress-develop by youknowriad.


2 years ago
#11

A small follow-up to the site editor patch

Trac ticket: https://core.trac.wordpress.org/ticket/54337

#12 @youknowriad
2 years ago

In 52071:

Site Editor: Load as full screen by default.

To avoid UI jumps when loading the page, the site-editor.php page
is marked as full screen by default.
This also matches the behavior of the post editor.

See #54337.

This ticket was mentioned in PR #1845 on WordPress/wordpress-develop by kebbet.


2 years ago
#13

Trac ticket: https://core.trac.wordpress.org/ticket/54337

Remove the incorrect use of text domain from core.

kebbet commented on PR #1845:


2 years ago
#14

Introduced in changeset 52042.

#15 @peterwilsoncc
2 years ago

In 52089:

Block Editor: Update SVN props to ignore new asset files.

Update svn props to ignore additional CSS, JavaScript and source map files following the package updates preparing for WordPress 5.9.

Follow up to [52042], [52046], [52069].
See #54337, #53361.

#16 @peterwilsoncc
2 years ago

In 52090:

Block Editor: Update SVN props to ignore new asset files.

Update svn props to ignore additional CSS, JavaScript and source map files following the package updates preparing for WordPress 5.9.

Follow up to [52042], [52046], [52069] and [52089].
See #54337, #53361.

#18 @noisysocks
2 years ago

In 52103:

Update @wordpress packages

Update packages to include these bug fixes from Gutenberg:

  • Force remount LinkControl when moving between links within same richtext block
  • Site Editor: Change ToolsMoreMenuGroup slot-fill name
  • Respect fields param for global styles REST API requests.
  • Try ensuring the item after post content clears floats
  • Fix submenus not opening on click
  • Apply i18n functions to Nav block menu drops when selecting existing Menu
  • Gallery: Make sure the mobile warning notice only runs when images are added to a new block
  • Prepare navigation php code for core patch
  • Address deprecation issues from Buttons flex layout PR.
  • Block Library: Fix incorrect attributes definitions
  • Fix Navigation accessibility issues

See #54337.

#19 @desrosj
2 years ago

In 52106:

Posts, Post Types: Remove gutenberg text domain from post type strings.

Introduced in [52041], and [52069].

See #54336, #54337.

This ticket was mentioned in PR #1865 on WordPress/wordpress-develop by noisysocks.


2 years ago
#20

Copies navigation area infrastructure from lib/navigation.php in Gutenberg to Core.

I meant to include this https://github.com/WordPress/wordpress-develop/pull/1804 but I ran out of time on Tuesday 🙂

Trac ticket: https://core.trac.wordpress.org/ticket/54337

noisysocks commented on PR #1865:


2 years ago
#21

@anton-vlasenko @adamziel @talldan: I'm not 100% sure how to test this. Could you please give it a whirl?

#22 @noisysocks
2 years ago

In 52134:

Hide Customize from admin bar when using a block theme

Don't add the Customize link to the admin bar when a block theme is activated.

See #54337.

#23 @noisysocks
2 years ago

  • Summary changed from Add Site Editor from Gutenberg plugin into Core to Update @wordpress packages and add Site Editor from Gutenberg plugin into Core

noisysocks commented on PR #1865:


2 years ago
#24

Need to add this new addition from lib/navigation.php:

{{{diff
diff --git a/lib/navigation.php b/lib/navigation.php
index 8a3587ae7d..5f69152724 100644
--- a/lib/navigation.php
+++ b/lib/navigation.php
@@ -56,6 +56,14 @@ function gutenberg_register_navigation_post_type() {

}
add_action( 'init', 'gutenberg_register_navigation_post_type' );

+/
+ * Disable "Post Attributes" for wp_navigation post type.
+ *
+ * The attributes are also conditionally enabled when a site has custom templates.
+ * Block Theme templates can be available for every post type.
+ */
+add_filter( 'theme_wp_navigation_templates', 'return_empty_array' );
+
}}}

#26 @noisysocks
2 years ago

In 52135:

Update @wordpress packages

Update packages to include these bug fixes from Gutenberg:

  • Group - Fix inner container regexes using fixed div tag
  • Image block: Make sure the Image block border radius is inherited if the image is linked
  • Navigation: Small fixes
  • FSE: Add template_type guards
  • Template Part Block: Add some guards
  • Fix getEntityRecords to ensure resolution on REST API failure
  • Ensure menus before map operation in Nav block
  • Link editing: Account for link anchor no longer being present when generating unique link instance key
  • Navigation: Hide post attributes meta box
  • Fix failing tests and compatibility with 5.9.
  • Fix missing <MainDashboardButton> slot fill in site editor
  • Move WP_REST_Block_Navigation_Areas_Controller from Gutenberg to Core.
  • Fix site editor reset styles in WP 5.9

See #54337.

spacedmonkey commented on PR #1865:


2 years ago
#27

Unit tests seem to be failing...

#28 @noisysocks
2 years ago

In 52143:

Update 'react' and 'react-dom'

Update 'react' and 'react-dom' packages to version 17.0.1. This is the version
expected by @wordpress components.

See #54337.

noisysocks commented on PR #1865:


2 years ago
#29

We will have to rename fse_navigation_areas in the plugin first as it is used by a block which means that the PHP code is copied as part of the build process. We will also have to include some migration code when doing this rename.

#30 @noisysocks
2 years ago

In 52145:

Editor: Add Navigation Area infrastructure

Copies Navigation Area infrastrucutre from lib/navigation.php in Gutenberg. This
allows a Navigation block to be associated with a particular area which persists
when switching theme.

Props antonvlasenko, mamaduka, spacedmonkey.
See #54337.

#31 @TobiasBg
2 years ago

@noisysocks: Can you maybe change the browserify URL to https again, like it was done in [52000]?

#32 @noisysocks
2 years ago

In 52155:

Editor: Fix incorrect access of ID field

Now that WP_Query is set to return 'ids', accessing $matching_posts[0]->ID is
incorrect.

Props spacedmonkey.
Follows [52145].
See #54337.

#33 @noisysocks
2 years ago

In 52156:

Build/Test Tools: Restore the https URL for browserify-aes

Follows [52143].
See #54337.
Props TobiasBg.

#34 @noisysocks
2 years ago

Sure thing @TobiasBg!

This ticket was mentioned in PR #1882 on WordPress/wordpress-develop by noisysocks.


2 years ago
#35

Various changes to make how we link to the Site Editor consistent with what's in the Gutenberg plugin.

  • Add 'Edit site' to the top admin bar.
  • Link to the Template and Template Part CPTs.
  • Add deep link to the Global Styles UI.

Trac ticket: https://core.trac.wordpress.org/ticket/54337

#36 @noisysocks
2 years ago

In 52158:

Editor: Fix how the Site Editor is linked to

  • Add 'Edit site' to the top admin bar.
  • Link to the Template and Template Part CPTs.
  • Add deep link to the Global Styles UI.

Follows [52069].
See #54337.

@sabernhardt
2 years ago

editing add_query_args to add_query_arg

#37 @sabernhardt
2 years ago

I had a fatal error on add_query_args when I clicked the new toolbar Edit site link (r52145).

Also, is that link intentionally hidden on mobile (and iconless)?

Last edited 2 years ago by sabernhardt (previous) (diff)

#38 @noisysocks
2 years ago

In 52159:

Editor: Fix fatal call to add_query_args()

It should be add_query_arg(), not add_query_args().

Follows [52145].
See #54337.
Props sabernhardt.

#39 @noisysocks
2 years ago

I had a fatal error on add_query_args when I clicked the new toolbar Edit site link (r52145).

Thanks @sabernhardt. I've applied your patch.

Also, is that link intentionally hidden on mobile (and iconless)?

At this stage I'm just copying over exactly what's in the Gutenberg plugin. Could you please open up a new ticket to discuss this? That way we can loop in some design folks, etc.

noisysocks commented on PR #1883:


2 years ago
#41

@gziolo: There is an error in this branch when running grunt build. I think it may be due to https://github.com/WordPress/gutenberg/pull/36244. Do you know how to fix this?

#42 @sabernhardt
2 years ago

Thanks for the commit, and the toolbar link ticket is #54441.

#43 @noisysocks
2 years ago

In 52160:

Editor: Load iframed assets in Site Editor

Configure the Site Editor to load iframed block editor assets. This fixes some
styling issues in the Site Editor.

Follows [52069].
See #54337.

#44 @walbo
2 years ago

#54431 was marked as a duplicate.

#45 @noisysocks
2 years ago

In 52161:

Update @wordpress packages

Update packages to include these bug fixes from Gutenberg:

  • Navigation: Fix click-button size, submenu directions, scrollbars.
  • Group - Fix overzealous regex when restoring inner containers
  • Babel Preset: Update Babel packages to 7.16 version
  • theme.json: adds a setting property that enables some other ones
  • Polish metabox container.
  • Fix submenu justification and spacer orientation.
  • Fix Gutenberg 11.8.2 in WordPress trunk
  • Strip meta tags from pasted links in Chromium
  • Hide visilibility and status for navigation posts
  • Navigation: Refactor and simplify setup state.
  • Nav block menu switcher - decode HTML entities and utilise accessible markup pattern
  • Rename fse_navigation_area to wp_navigation_area
  • theme.json: adds a setting property that enables some other ones
  • Revert "theme.json: adds a setting property that enables some other ones"
  • Skip flaky image block test
  • WordPress/gutenberg@3c935c4
  • React to any errors coming up in gutenberg_migrate_menu_to_navigation_post
  • Return wp error from wp_insert_post
  • Fix not transforming logical assignments for packages

See #54337.

#46 @noisysocks
2 years ago

  • Resolution set to fixed
  • Status changed from accepted to closed

With [52161] I'm happy with the overall state of trunk for WP 5.9 beta 1, so closing this ticket out. I'll create a new ticket to track the backporting of Gutenberg bug fixes during the 5.9 beta period. If anyone notices any bugs in trunk please create a ticket!

SergeyBiryukov commented on PR #1845:


2 years ago
#47

Thanks for the PR! Closing as this was fixed upstream in https://github.com/WordPress/gutenberg/pull/36500.

#48 @youknowriad
2 years ago

I just noticed the wp_is_block_template_theme function name, should it be just is_block_theme or wp_is_block_theme instead maybe? (not sure why the wp prefix is needed, and the "template" there doesn't sound correct, I think we've been calling them "block themes")

#49 @peterwilsoncc
2 years ago

wp_is_block_theme seems more appropriate.

I'd like to keep the wp_ prefix as having functions without a prefix has caused problems recently with clashes in PHP core.

This ticket was mentioned in PR #2022 on WordPress/wordpress-develop by youknowriad.


2 years ago
#50

There was a difference between the initialization of the site editor between Gutenberg plugin and Core. This PRs brings syncs both which fixes the template description in the site editor.

Trac ticket: https://core.trac.wordpress.org/ticket/54337

Testing instructions

  • Open the site editor
  • Click the template title
  • The template description should be visible.

#51 @youknowriad
2 years ago

In 52336:

Site Editor: Render the template descriptions properly.

The initializaion of the editor was a bit different between Gutenberg and Core.
This brings them in sync which solves the missing descriptions from the template header
in the site editor.

See #54337.

noisysocks commented on PR #2022:


2 years ago
#53

Thanks!

noisysocks commented on PR #2022:


2 years ago
#54

Thanks!

Note: See TracTickets for help on using tickets.