WordPress.org

Make WordPress Core


Ignore:
Timestamp:
11/11/2021 02:47:10 AM (3 weeks ago)
Author:
westonruter
Message:

Embeds: Conditionally enqueue wp-embed only if needed and send ready message in case script loads after post embed windows.

  • Prevent loading wp-embed script unconditionally on every page in favor of conditionally enqueueing when a post embed is detected. The wp-embed script is also explicitly marked as being in the footer group. Sites which currently disable post embed scripts from being enqueued via remove_action( 'wp_head', 'wp_oembed_add_host_js' ) will continue to do so.
  • Send a ready message from the host page to each post embed window in case the iframe loads before the wp-embed script does. When the ready message is received by the post embed window, it sends the same height message as it sends when it loads.
  • Eliminate use of grunt-include to inject emoji script and the post embed script. Instead obtain the script contents via file_get_contents() (as is done elsewhere in core) and utilize wp_print_inline_script_tag()/wp_get_inline_script_tag() to construct out the script. This simplifies the logic and allows the running of src without SCRIPT_DEBUG enabled.
  • For the embed code that users are provided to copy for embedding outside of WP, add the secret on the blockquote and iframe. This ensures the blockquote will be hidden when the iframe loads. The embed code in question is accessed here via get_post_embed_html().

Props westonruter, swissspidy, pento, flixos90, ocean90.
Fixes #44632, #44306.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/tests/phpunit/tests/oembed/template.php

    r52010 r52132  
    55 */
    66class Tests_Embed_Template extends WP_UnitTestCase {
     7
     8    public function set_up() {
     9        parent::set_up();
     10
     11        global $wp_scripts;
     12        $wp_scripts = null;
     13    }
     14
     15    public function tear_down() {
     16        parent::tear_down();
     17
     18        global $wp_scripts;
     19        $wp_scripts = null;
     20    }
     21
    722    public function test_oembed_output_post() {
    823        $user = self::factory()->user->create_and_get(
     
    282297        );
    283298
    284         $expected = '<iframe sandbox="allow-scripts" security="restricted" src="' . esc_url( get_post_embed_url( $post_id ) ) . '" width="200" height="200" title="' . $title . '" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe>';
    285 
    286         $this->assertStringEndsWith( $expected, get_post_embed_html( 200, 200, $post_id ) );
    287     }
    288 
     299        $expected = '<iframe sandbox="allow-scripts" security="restricted" src="' . esc_url( get_post_embed_url( $post_id ) ) . '#?secret=__SECRET__" width="200" height="200" title="' . $title . '" data-secret=__SECRET__ frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe>';
     300        $actual   = get_post_embed_html( 200, 200, $post_id );
     301        $actual   = preg_replace( '/secret=("?)\w+\1/', 'secret=__SECRET__', $actual );
     302
     303        $this->assertStringEndsWith( $expected, $actual );
     304    }
     305
     306    /** @covers ::wp_oembed_add_host_js() */
    289307    public function test_add_host_js() {
     308        remove_all_filters( 'embed_oembed_html' );
     309
    290310        wp_oembed_add_host_js();
    291311
    292         $this->assertTrue( wp_script_is( 'wp-embed' ) );
     312        $this->assertEquals( 10, has_filter( 'embed_oembed_html', 'wp_maybe_enqueue_oembed_host_js' ) );
     313    }
     314
     315    /** @covers ::wp_maybe_enqueue_oembed_host_js() */
     316    function test_wp_maybe_enqueue_oembed_host_js() {
     317        $scripts = wp_scripts();
     318
     319        $this->assertFalse( $scripts->query( 'wp-embed', 'enqueued' ) );
     320
     321        $post_embed     = '<blockquote class="wp-embedded-content" data-secret="S24AQCJW9i"><a href="https://make.wordpress.org/core/2016/03/11/embeds-changes-in-wordpress-4-5/">Embeds Changes in WordPress 4.5</a></blockquote><iframe class="wp-embedded-content" sandbox="allow-scripts" security="restricted" style="position: absolute; clip: rect(1px, 1px, 1px, 1px);" title="&#8220;Embeds Changes in WordPress 4.5&#8221; &#8212; Make WordPress Core" src="https://make.wordpress.org/core/2016/03/11/embeds-changes-in-wordpress-4-5/embed/#?secret=S24AQCJW9i" data-secret="S24AQCJW9i" width="600" height="338" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>';
     322        $non_post_embed = '<iframe title="Zoo Cares For 23 Tiny Pond Turtles" width="750" height="422" src="https://www.youtube.com/embed/6ZXHqUjL6f8?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
     323
     324        wp_maybe_enqueue_oembed_host_js( $non_post_embed );
     325        $this->assertFalse( $scripts->query( 'wp-embed', 'enqueued' ) );
     326
     327        wp_maybe_enqueue_oembed_host_js( $post_embed );
     328        $this->assertTrue( $scripts->query( 'wp-embed', 'enqueued' ) );
    293329    }
    294330
Note: See TracChangeset for help on using the changeset viewer.