Add support for shortcode embeds that enqueue scripts#9734
Add support for shortcode embeds that enqueue scripts#9734notnownikki merged 2 commits intomasterfrom
Conversation
| // Check if any scripts were enqueued by the shortcode, and | ||
| // include them in the response. | ||
| $enqueued_scripts = array(); | ||
| foreach ( $wp_scripts->queue as $script ) { |
There was a problem hiding this comment.
In my local tests, I'm still having problems when I try to embed http://pinterest.co.uk/heald0081/hair-ideas. I checked that $wp_scripts->queue is empty which I assume was unexpected.
I changed Gutenberg in a poopy.life sandbox to contain:
if ( $html ) {
global $wp_scripts;
var_dump( $wp_scripts->queue );
exit;
And I checked $wp_scripts->queue was also empty there. I'm not certain about the reason for this. Maybe I'm doing something wrong.
There was a problem hiding this comment.
My bet is you tested to make sure it was broken, applied the patch, then tested again? Clear all your embed transients and see if it works :)
There was a problem hiding this comment.
If not (it hit me a few times!) Can you check that the call to enqueued script happens in the short code?
There was a problem hiding this comment.
I'm still having problems with the embed of Pinterest, I used a plugin the clear all the transients and the situation persisted. I checked that Pinterest is not a WordPress supported embed in the classic editor https://codex.wordpress.org/Embeds, but JetPack adds a shortcode for it. Do you have JetPack installed in your testing environment? maybe that explains the reason for the difference in the tests because I'm not using JetPack on the environment I'm testing.
There was a problem hiding this comment.
Yes, this needs Jetpack with the shortcodes module active.
There was a problem hiding this comment.
Ah sorry for the troubles, it works great with JetPAck shortcodes module active.
jorgefilipecosta
left a comment
jorgefilipecosta
left a comment
There was a problem hiding this comment.
Things worked correctly in my tests 👍 I had some concerns about the security implications of loading this scripts, but they are loaded inside the sandbox iframe and we had a comment there saying "we can use this in the future to inject custom styles or scripts" so it looks like the component was already built with script injection in mind.
| global $wp_embed; | ||
| $html = $wp_embed->shortcode( array(), $_GET['url'] ); | ||
| if ( $html ) { | ||
| global $wp_scripts; |
There was a problem hiding this comment.
Is there an upstream Trac ticket tracking these enhancements to the oEmbed endpoint?
If so, should we add a comment about this addition?
If not, should we create one?
There was a problem hiding this comment.
There isn't yet. I was leaving this one until we're looking to merge for 5.0, as gutenberg_filter_oembed_result() is a giant hack that will be have to be mostly rewritten. So far, the things that have been merged to Core have been the ones we could mostly just copy/pasta.
There was a problem hiding this comment.
I'm looking at this again in relation to the ongoing effort to remove PHP from the Gutenberg plugin. I found these:
- https://core.trac.wordpress.org/changeset/44154
- https://core.trac.wordpress.org/ticket/45142
But it's not clear from these that the changes that the revisions intended from the pull request were ever included as part of WordPress 5.0.
There was a problem hiding this comment.
I've confirmed that the original testing instructions of this pull request fail in a stock WordPress 5.0 install. Seems there's still some remaining work to port. I'll try to put together a combination Gutenberg pull request / Trac ticket.
4 participants
Description
If the embed preview is handled by a shortcode, it might enqueue scripts to make it work.
This change returns the enqueued scripts as part of the embed response, and has
the Sandbox component put them into the preview document.
How has this been tested?
Install Jetpack and activate the shortcodes module.
Try to embed https://www.pinterest.co.uk/heald0081/hair-ideas/
The preview should appear as expected. Without this fix, only the caption appears.
Types of changes
Bug fix
Checklist: