-
Notifications
You must be signed in to change notification settings - Fork 4.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Blocks: Add new utility function to add script
/ viewScript
to an already registered block
#48382
Comments
script
/ viewScript
to an already registered blockscript
/ viewScript
to an already registered block
Thank you for opening this issue that is now tracked in #41236 with other planned tasks for Block API. Yes, that makes perfect sense to follow with more utility functions. I'm still unsure whether we need a single function instead that has a 3rd param that let's devs define other contexts: This is also good timing for this issue as I was about to file one anyway after seeing this tutorial by @justintadlock for Building a book review grid with a Query Loop block variation that surfaced exactly that challenge in the code example included: add_action( 'enqueue_block_editor_assets', 'myplugin_assets' );
function myplugin_assets() {
// Get plugin directory and URL paths.
$path = untrailingslashit( __DIR__ );
$url = untrailingslashit( plugins_url( '', __FILE__ ) );
// Get auto-generated asset file.
$asset_file = "{$path}/build/index.asset.php";
// If the asset file exists, get its data and load the script.
if ( file_exists( $asset_file ) ) {
$asset = include $asset_file;
wp_enqueue_script(
'book-reviews-variation',
"{$url}/build/index.js",
$asset['dependencies'],
$asset['version'],
true
);
}
} |
It would be really helpful to have this function(s)! (I don't really have a preference on the 1-vs-2 functions debate.) Last week, I was working on an enhancement to the core YouTube embed block that would have benefited from this. I discovered @skorasaurus was also doing the exact same thing and shared this need. During today's excellent developer meetup with @ndiego on extending blocks, the example plugin to flip the order of columns on mobile could have been further optimized with this functionality as well. cc: @ryanwelcher It's possible to enqueue the script on |
I had been wondering about this again today (and as another use case) as I was trying to make a block variation on a dynamic block (custom one that I'm making) and wanted to enqueue a separate javascript file only when that variation was used. |
Quick note: enqueuing a script on |
The biggest challenge with the proposed implementation is that a registered block gets modified directly, so the function call needs to happen after the block gets registered. The way wp_enqueue_block_style is implemented more nuanced, but therefore it doesn't have these limitations. However, I'm not entirely sure that using the Let's work on adding a helper function like this in Gutenberg or even WordPress core first. For simplicity we could fully mirror wp_enqueue_block_script( 'core/button', array(
'handle' => 'my-custom-view-script',
'type' => 'view',
) ); By the way, if you feel like we miss |
What problem does this address?
Part of #41236.
There are many use-cases why one may want to add additional frontend javascript to existing blocks. This is both for core and custom blocks.
What is your proposed solution?
We already have a really solid system in place for handling the enqueue logic for the scripts that get defined in the block registration. We also have a utility function in core that allows you to add additional styles to any block called
wp_enqueue_block_style
.My suggestion here would be to introduce two more similar functions:
wp_enqueue_block_script
→ adds the script to thescriptHandles
which ensures the file gets enqueued both in the editor and on the frontendwp_enqueue_block_view_script
→ adds the script to theviewScriptHandles
which ensures the file gets enqueued on the frontendHere is an example of how this function can get implemented:
The text was updated successfully, but these errors were encountered: