Ticket #62019: copy-to-clipboard.patch

src/js/_enqueues/admin/user-profile.js

@@ -7 +7 @@
         var updateLock = false,
                 isSubmitting = false,
                 __ = wp.i18n.__,
+                clipboard = new ClipboardJS( '.application-password-display .copy-button' ),
                 $pass1Row,
                 $pass1,
                 $pass2,
@@ -18 +19 @@
                 currentPass,
                 $form,
                 originalFormContent,
-                $passwordWrapper;
+                $passwordWrapper,
+                successTimeout;
 
         function generatePassword() {
                 if ( typeof zxcvbn !== 'function' ) {
@@ -346 +348 @@
                 }
         }
 
+        // Debug information copy section.
+        clipboard.on( 'success', function( e ) {
+                var triggerElement = $( e.trigger ),
+                        successElement = $( '.success', triggerElement.closest( '.application-password-display' ) );
+
+                // Clear the selection and move focus back to the trigger.
+                e.clearSelection();
+
+                // Show success visual feedback.
+                clearTimeout( successTimeout );
+                successElement.removeClass( 'hidden' );
+
+                // Hide success visual feedback after 3 seconds since last success.
+                successTimeout = setTimeout( function() {
+                        successElement.addClass( 'hidden' );
+                }, 3000 );
+
+                // Handle success audible feedback.
+                wp.a11y.speak( __( 'Site information has been copied to your clipboard.' ) );
+        } );
+
         $( function() {
                 var $colorpicker, $stylesheet, user_id, current_user_id,
                         select       = $( '#display_name' ),

src/wp-admin/css/common.css

@@ -916 +916 @@
         border: none;
 }
 
+.application-password-display .success {
+    color: #007017;
+    margin-left: 0.5rem;
+}
+
 /*------------------------------------------------------------------------------
   3.0 - Actions
 ------------------------------------------------------------------------------*/

src/wp-admin/user-edit.php

@@ -984 +984 @@
                                         ?>
                                 </label>
                                 <input id="new-application-password-value" type="text" class="code" readonly="readonly" value="{{ data.password }}" />
+                                <button type="button" class="button copy-button" data-clipboard-text="{{ data.password }}">copy</button>
+                                <span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span>
                         </p>
                         <p><?php _e( 'Be sure to save this in a safe location. You will not be able to retrieve it.' ); ?></p>
                         <button type="button" class="notice-dismiss">

src/wp-includes/script-loader.php

@@ -1217 +1217 @@
         $scripts->add( 'auth-app', "/wp-admin/js/auth-app$suffix.js", array( 'jquery', 'wp-api-request', 'wp-i18n', 'wp-hooks' ), false, 1 );
         $scripts->set_translations( 'auth-app' );
 
-        $scripts->add( 'user-profile', "/wp-admin/js/user-profile$suffix.js", array( 'jquery', 'password-strength-meter', 'wp-util' ), false, 1 );
+        $scripts->add( 'user-profile', "/wp-admin/js/user-profile$suffix.js", array( 'clipboard', 'jquery', 'password-strength-meter', 'wp-util', 'wp-a11y' ), false, 1 );
         $scripts->set_translations( 'user-profile' );
         $user_id = isset( $_GET['user_id'] ) ? (int) $_GET['user_id'] : 0;
         did_action( 'init' ) && $scripts->localize(