Make WordPress Core

Opened 12 months ago

Closed 11 months ago

Last modified 11 months ago

#58208 closed defect (bug) (fixed)

`wp_enqueue_registered_block_scripts_and_styles` is called twice

Reported by: oandregal's profile oandregal Owned by: oandregal's profile oandregal
Milestone: 6.3 Priority: normal
Severity: normal Version: 5.0
Component: Editor Keywords: has-patch
Focuses: Cc:

Description

This is a follow-up to #45065.

That ticket introduced the wp_enqueue_registered_block_scripts_and_styles function and set it as a callback for both the enqueue_block_editor_assets and enqueue_block_assets actions.

There are two actions to enqueue block assets: enqueue_block_editor_assets and enqueue_block_assets. The former enqueues the assets to the editor and the later enqueues them to the front-and and the editor.

Given wp_enqueue_registered_block_scripts_and_styles is already bound to the enqueue_block_assets (front-end & editor), it is unnecessary to bind it to enqueue_block_editor_assets (editor) as well.

Change History (9)

This ticket was mentioned in PR #4356 on WordPress/wordpress-develop by @oandregal.


12 months ago
#1

  • Keywords has-patch added

Trac ticket https://core.trac.wordpress.org/ticket/58208
Follow-up to https://core.trac.wordpress.org/ticket/45065

## What

This PR removes the wp_enqueue_registered_block_scripts_and_styles callback from the enqueue_block_editor_assets action.

## Why

There are two actions to enqueue block assets: enqueue_block_editor_assets and enqueue_block_assets. The former enqueues the assets to the editor and the later enqueues them to the front-and AND the editor.

Given wp_enqueue_registered_block_scripts_and_styles is already bound to the enqueue_block_assets (front-end & editor), it is unnecessary to bind it to enqueue_block_editor_assets (editor) as well.

This was originally introduced at https://github.com/WordPress/wordpress-develop/commit/76525a75b7e84a8a34aede1b8aef4aecb6623bf8 and hasn't been modified since.

## How

Removes the action callback from being hooked to enqueue_block_editor_assets.

## How to test

  • Install a 3rd party block that contains JS and CSS assets. You can download and use the blockjson-assets test plugin I created.
  • If you use that plugin, verify that a "DOM" message is logged to the console (JS assets are loaded).
  • Insert the "blockjson-assets" block and verify the styles look proper:

https://i0.wp.com/user-images.githubusercontent.com/583546/233603833-e9be02c8-aa8c-4c2d-a897-ed6f1212cbe9.png

## SVN commit message

{{{txt
Enqueue registered assets once.

This PR removes the wp_enqueue_registered_block_scripts_and_styles callback from the enqueue_block_editor_assets action.

There are two actions to enqueue block assets: enqueue_block_editor_assets and enqueue_block_assets. The former enqueues the assets to the editor and the later enqueues them to the front-and and the editor. Given wp_enqueue_registered_block_scripts_and_styles is already bound to the enqueue_block_assets (front-end & editor), it is unnecessary to bind it to enqueue_block_editor_assets (editor) as well.

This was originally introduced at [44157] and hasn't been modified since.

Props ?
Fixes #45065.
}}}

#2 @oandregal
12 months ago

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

In 55695:

Enqueue registered assets once.

This PR removes the wp_enqueue_registered_block_scripts_and_styles callback from the enqueue_block_editor_assets action.

There are two actions to enqueue block assets: enqueue_block_editor_assets and enqueue_block_assets. The former enqueues the assets to the editor and the later enqueues them to the front-end and the editor. Given wp_enqueue_registered_block_scripts_and_styles is already bound to the enqueue_block_assets (front-end and editor), it is unnecessary to bind it to enqueue_block_editor_assets (editor) as well.

This was originally introduced at [44157] and hasn't been modified since.

Props ellatrix, costdev.
Fixes #58208.

This ticket was mentioned in PR #4498 on WordPress/wordpress-develop by @oandregal.


11 months ago
#4

Trac ticket https://core.trac.wordpress.org/ticket/58208
Reverts changeset https://core.trac.wordpress.org/changeset/55695

## What

This PR reverts PR https://github.com/WordPress/wordpress-develop/pull/4356

## Why

It caused issues in the ordering of styles in the editor, which went unnoticed in the testing. The reason is that block styles (editor-only and front styles) would now be enqueued using the enqueue_block_assets which runs later than the enqueue_block_editor_assets hook.

The order of styles enqueued before the change was:

  1. front styles registered for blocks, via styles handle (block.json)
  2. editor styles registered for blocks, via editorStyles handle (block.json)
  3. editor styles enqueued via enqueue_block_editor_assets hook
  4. front styles enqueued via enqueue_block_assets hook

The order of styles enqueued after the change was:

  1. editor styles enqueued via enqueue_block_editor_assets hook
  2. front styles registered for blocks, via styles handle (block.json)
  3. editor styles registered for blocks, via editorStyles handle (block.json)
  4. front styles enqueued via enqueue_block_assets hook

## How to test

  • Use this PR.
  • Install and activate the test plugin iframed-inline-styles.zip.
  • Go to the editor and add the block "iframed-inline-styles".
  • The expected result is that padding is 20px and border width is 2px:

https://i0.wp.com/github.com/WordPress/wordpress-develop/assets/583546/1ffd2a83-9810-4485-8918-fd455c3c5655

#5 @oandregal
11 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

@oandregal commented on PR #4498:


11 months ago
#6

I considered an alternative: enqueue the block styles for the editor using the enqueue_block_editor_assets and the block styles for the front using the enqueue_block_assets. This would result in the block styles being loaded before the corresponding styles of the hook:

  1. editor styles registered for blocks, via editorStyles handle (block.json)
  2. editor styles enqueued via enqueue_block_editor_assets hook
  3. front styles registered for blocks, via styles handle (block.json)
  4. front styles enqueued via enqueue_block_assets hook

This may seem the correct behavior. However, the enqueue_block_editor_assets hook has been used by themes to override block styles for the editor (see hook in use and styles for TwentyTwenty, for example). Using this approach the styles of the theme would load 2nd, having to use greater specificity to override the front styles of the blocks that load 3rd.

#8 @oandregal
11 months ago

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

In 55852:

Loading assets for the editor: Revert [55695].

The changeset [55695] introduced a regression in the order of styles for the editor, causing the styles registered for the block (both editor and front) to be loaded after any other styles enqueued using the enqueue_block_editor_assets hook.

Since the original behavior was introduced in WordPress 5.0 changing it breaks the expectations of the ecosystem.

Props ellatrix.
Fixes #58208.

Note: See TracTickets for help on using tickets.