Ticket #44588: 44588.4.diff

src/js/_enqueues/admin/privacy-tools.js

@@ -4 +4 @@
  * @output wp-admin/js/privacy-tools.js
  */
 
+/* global ClipboardJS, wp */
+
 // Privacy request action handling
 jQuery( document ).ready( function( $ ) {
-        var strings = window.privacyToolsL10n || {};
+
+        var __ = wp.i18n.__,
+                strings = window.privacyToolsL10n || {},
+                clipboard = new ClipboardJS( '.privacy-text-copy' );
 
         function setActionState( $action, state ) {
                 $action.children().addClass( 'hidden' );
@@ -77 +82 @@
 
                         appendResultsAfterRow( $requestRow, 'notice-success', summaryMessage, [] );
                         $this.hide();
-                        
+
                         if ( 'undefined' !== typeof zipUrl ) {
                                 window.location = zipUrl;
                         } else if ( ! sendAsEmail ) {
@@ -230 +235 @@
                 doNextErasure( 1, 1 );
         });
 
-        // Privacy policy page, copy button.
-        $( document ).on( 'click', function( event ) {
-                var $target = $( event.target );
-                var $parent, $container, range;
-
-                if ( $target.is( 'button.privacy-text-copy' ) ) {
-                        $parent = $target.parent().parent();
-                        $container = $parent.find( 'div.wp-suggested-text' );
-
-                        if ( ! $container.length ) {
-                                $container = $parent.find( 'div.policy-text' );
-                        }
-
-                        if ( $container.length ) {
-                                try {
-                                        window.getSelection().removeAllRanges();
-                                        range = document.createRange();
-                                        $container.addClass( 'hide-privacy-policy-tutorial' );
+        // Copy 'Suggested Privacy' section.
+        clipboard.on( 'success', function( e ) {
+                var $wrapper = $( e.trigger ).closest( 'div' );
+                $( '.success', $wrapper ).addClass( 'visible' );
 
-                                        range.selectNodeContents( $container[0] );
-                                        window.getSelection().addRange( range );
-                                        document.execCommand( 'copy' );
+                e.clearSelection();
 
-                                        $container.removeClass( 'hide-privacy-policy-tutorial' );
-                                        window.getSelection().removeAllRanges();
-                                } catch ( er ) {}
-                        }
-                }
-        });
+                wp.a11y.speak( __( 'Privacy Policy Guide section has been copied to your clipboard.' ) );
+        } );
 });
 

src/wp-admin/css/edit.css

@@ -714 +714 @@
         padding-bottom: 6px;
 }
 
+.privacy-text-actions .success {
+        display: none;
+        color: #40860a;
+        float: right;
+        padding-right: 1em;
+}
+
+.privacy-text-actions .success.visible {
+        display: inline-block;
+        height: 32px;
+}
+
 .wp-privacy-policy-guide .policy-text h2 {
         margin: 1.2em 0 1em;
         padding: 0;

src/wp-admin/includes/class-wp-privacy-policy-content.php

@@ -371 +371 @@
         public static function privacy_policy_guide() {
 
                 $content_array = self::get_suggested_policy_text();
-
                 $content       = '';
                 $toc           = array( '<li><a href="#wp-privacy-policy-guide-introduction">' . __( 'Introduction' ) . '</a></li>' );
                 $date_format   = __( 'F j, Y' );
-                $copy          = __( 'Copy this section to clipboard' );
-                $return_to_top = '<a href="#" class="return-to-top">' . __( '&uarr; Return to Top' ) . '</a>';
 
                 foreach ( $content_array as $section ) {
                         $class   = '';
@@ -413 +410 @@
                         $content .= '<h2>' . sprintf( __( 'Source: %s' ), $plugin_name ) . '</h2>';
                         $content .= $removed;
 
-                        $content .= '<div class="policy-text">' . $section['policy_text'] . '</div>';
-                        $content .= $return_to_top;
+                        $content .= '<div class="policy-text" id="policy-text-' . sanitize_title( $plugin_name ) . '">' . $section['policy_text'] . '</div>';
+                        $content .= '<a href="#" class="return-to-top">' . __( '&uarr; Return to Top' ) . '</a>';
 
                         if ( empty( $section['removed'] ) ) {
-                                $content         .= '<div class="privacy-text-actions">';
-                                        $content     .= '<button type="button" class="privacy-text-copy button">';
-                                                $content .= $copy;
-                                                $content .= '<span class="screen-reader-text">';
-                                                /* translators: %s: Plugin name. */
-                                                $content .= sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name );
-                                                $content .= '</span>';
-                                        $content     .= '</button>';
-                                $content         .= '</div>';
+                                $content .= '<div class="privacy-text-actions">';
+                                $content .= '<button type="button" class="privacy-text-copy button" data-clipboard-target="#policy-text-' . esc_attr( sanitize_title( $plugin_name ) ) . '">';
+                                $content .= __( 'Copy this section to clipboard' );
+                                $content .= '<span class="screen-reader-text">';
+                                /* translators: %s: Plugin name. */
+                                $content .= sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name );
+                                $content .= '</span>';
+                                $content .= '</button>';
+
+                                /* on Copy success feedback */
+                                $content .= '<span class="success" aria-hidden="true">' . __( 'Copied!' ) . '</span>';
+                                $content .= '</div>';
                         }
 
                         $content .= "</div>\n"; // End of .privacy-text-section.

src/wp-includes/script-loader.php

@@ -1469 +1469 @@
                 $scripts->add( 'site-health', "/wp-admin/js/site-health$suffix.js", array( 'clipboard', 'jquery', 'wp-util', 'wp-a11y', 'wp-i18n' ), false, 1 );
                 $scripts->set_translations( 'site-health' );
 
-                $scripts->add( 'privacy-tools', "/wp-admin/js/privacy-tools$suffix.js", array( 'jquery' ), false, 1 );
+                $scripts->add( 'privacy-tools', "/wp-admin/js/privacy-tools$suffix.js", array( 'clipboard', 'jquery', 'wp-a11y', 'wp-i18n' ), false, 1 );
                 did_action( 'init' ) && $scripts->localize(
                         'privacy-tools',
                         'privacyToolsL10n',