Changeset 58294

Timestamp:

06/03/2024 01:24:25 PM (4 months ago)

Author:

dmsnell

Message:

KSES: Allow leading trailing double hyphen in data attributes

Expand allowable set of custom data attribute names to include those containing
leading, trailing, and double - characters. Previously, WordPress was
removing data attributes that are used in the Interactivity API. By allowing
these additional custom data attributes, the related Interactivity API
directives will preserve through kses.

For example, the Interactivity API frequently relies on custom data attributes
such as data-wp-on--click="...". The change in [43981] would strip these out
of the processed HTML, however.

Developed in ​https://github.com/WordPress/wordpress-develop/pull/6598
Discussed in https://core.trac.wordpress.org/ticket/61052

Props cbravobernal, dmsnell, gziolo, jonsurrell.
Follow-up to [43981].
Fixes #61052.

Location:

trunk

Files:

• src/wp-includes/kses.php (modified) (1 diff)
• tests/phpunit/tests/kses.php (modified) (1 diff)

trunk/src/wp-includes/kses.php

@@ -1264 +1264 @@
          * https://www.w3.org/TR/html40/struct/objects.html#adef-data).
          *
-         * Note: the attribute name should only contain `A-Za-z0-9_-` chars,
-         * double hyphens `--` are not accepted by WordPress.
+         * Note: the attribute name should only contain `A-Za-z0-9_-` chars.
          */
         if ( str_starts_with( $name_low, 'data-' ) && ! empty( $allowed_attr['data-*'] )
-            && preg_match( '/^data(?:-[a-z0-9_]+)+$/', $name_low, $match )
+            && preg_match( '/^data-[a-z0-9_-]+$/', $name_low, $match )
         ) {
             /*

trunk/tests/phpunit/tests/kses.php

@@ -1363 +1363 @@
      */
     public function test_wp_kses_attr_data_attribute_is_allowed() {
-        $test     = '<div data-foo="foo" data-bar="bar" datainvalid="gone" data--invalid="gone"  data-also-invalid-="gone" data-two-hyphens="remains">Pens and pencils</div>';
+        $test     = '<div data-foo="foo" data-bar="bar" datainvalid="gone" data-two-hyphens="remains">Pens and pencils</div>';
         $expected = '<div data-foo="foo" data-bar="bar" data-two-hyphens="remains">Pens and pencils</div>';
+
+        $this->assertSame( $expected, wp_kses_post( $test ) );
+    }
+
+    /**
+     * Data attributes with leading, trailing, and double "-" are globally accepted.
+     *
+     * @ticket 61052
+     */
+    public function test_wp_kses_attr_data_attribute_hypens_allowed() {
+        $test     = '<div data--leading="remains" data-trailing-="remains" data-middle--double="remains">Pens and pencils</div>';
+        $expected = '<div data--leading="remains" data-trailing-="remains" data-middle--double="remains">Pens and pencils</div>';
 
         $this->assertSame( $expected, wp_kses_post( $test ) );