Changeset 61469 for trunk/tests/phpunit/tests/block-template-utils.php

Timestamp:

01/11/2026 06:34:57 AM (2 months ago)

Author:

westonruter

Message:

Themes: Use WP_HTML_Tag_Processor to insert the block template skip link instead of JavaScript.

• The skip link now works when JavaScript is turned off.
• By removing the script, the amount of JavaScript sent to the client is reduced for a very marginal performance improvement.
• A new wp-block-template-skip-link stylesheet is registered, with minification and path data for inlining.
• The CSS for the skip link now has an RTL version generated, although it is not yet served when the styles are inlined. See #61625.
• The wp_enqueue_block_template_skip_link() function now exclusively enqueues the stylesheet since the script is removed.
• For backwards-compatibility, the skip link will continue to be omitted if the_block_template_skip_link() is unhooked from the wp_footer action or wp_enqueue_block_template_skip_link() is unhooked from wp_enqueue_scripts.

Developed in ​https://github.com/WordPress/wordpress-develop/pull/10676

Follow-up to [56932], [51003].

Props rutviksavsani, westonruter, dmsnell, whiteshadow01, Slieptsov.
See #59505, #53176.
Fixes #64361.

File:

• trunk/tests/phpunit/tests/block-template-utils.php (modified) (1 diff)

trunk/tests/phpunit/tests/block-template-utils.php

@@ -299 +299 @@
 
     /**
+     * Tests that a skip link is added and a MAIN element without an ID receives the default ID.
+     *
+     * @ticket 64361
+     *
+     * @covers ::_block_template_add_skip_link
+     */
+    public function test_block_template_add_skip_link_inserts_link_and_adds_main_id_when_missing() {
+        $template_html = '<div class="wp-site-blocks"><main>Content</main></div>';
+        $expected      = '
+            <a class="skip-link screen-reader-text" id="wp-skip-link" href="#wp--skip-link--target">Skip to content</a>
+            <div class="wp-site-blocks"><main id="wp--skip-link--target">Content</main></div>
+        ';
+
+        $this->assertEqualHTML( $expected, _block_template_add_skip_link( $template_html ) );
+    }
+
+    /**
+     * Tests that an existing MAIN ID is reused for the skip link.
+     *
+     * @ticket 64361
+     *
+     * @covers ::_block_template_add_skip_link
+     */
+    public function test_block_template_add_skip_link_uses_existing_main_id() {
+        $template_html = '<div class="wp-site-blocks"><main id="custom-id">Content</main></div>';
+        $expected      = '
+            <a class="skip-link screen-reader-text" id="wp-skip-link" href="#custom-id">Skip to content</a>
+            <div class="wp-site-blocks"><main id="custom-id">Content</main></div>
+        ';
+
+        $this->assertEqualHTML( $expected, _block_template_add_skip_link( $template_html ) );
+    }
+
+    /**
+     * Tests that a boolean MAIN ID is treated as missing and replaced with the default.
+     *
+     * @ticket 64361
+     *
+     * @covers ::_block_template_add_skip_link
+     */
+    public function test_block_template_add_skip_link_handles_boolean_main_id() {
+        $template_html = '<div class="wp-site-blocks"><main id>Content</main></div>';
+        $expected      = '
+            <a class="skip-link screen-reader-text" id="wp-skip-link" href="#wp--skip-link--target">Skip to content</a>
+            <div class="wp-site-blocks"><main id="wp--skip-link--target">Content</main></div>
+        ';
+
+        $this->assertEqualHTML( $expected, _block_template_add_skip_link( $template_html ) );
+    }
+
+    /**
+     * Tests that a MAIN ID containing whitespace is preserved and used for the skip link.
+     *
+     * @ticket 64361
+     *
+     * @covers ::_block_template_add_skip_link
+     */
+    public function test_block_template_add_skip_link_preserves_whitespace_main_id() {
+        $template_html = '<div class="wp-site-blocks"><main id=" my-id ">Content</main></div>';
+        $expected      = '
+            <a class="skip-link screen-reader-text" id="wp-skip-link" href="#%20my-id%20">Skip to content</a>
+            <div class="wp-site-blocks"><main id=" my-id ">Content</main></div>
+        ';
+
+        $this->assertEqualHTML( $expected, _block_template_add_skip_link( $template_html ) );
+    }
+
+    /**
+     * Tests that no changes are made when there is no MAIN element.
+     *
+     * @ticket 64361
+     *
+     * @covers ::_block_template_add_skip_link
+     */
+    public function test_block_template_add_skip_link_does_not_modify_when_main_missing() {
+        $template_html = '<div class="wp-site-blocks"><div>Content</div></div>';
+
+        $this->assertSame( $template_html, _block_template_add_skip_link( $template_html ) );
+    }
+
+    /**
      * Should retrieve the template from the theme files.
      */