diff --git a/Gruntfile.js b/Gruntfile.js index f40fa336cf..c71fe02612 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -166,6 +166,7 @@ module.exports = function(grunt) { files: [ { [ WORKING_DIR + 'wp-includes/js/backbone.js' ]: [ './node_modules/backbone/backbone.js' ], + [ WORKING_DIR + 'wp-includes/js/clipboard.js' ]: [ './node_modules/clipboard/dist/clipboard.js' ], [ WORKING_DIR + 'wp-includes/js/hoverIntent.js' ]: [ './node_modules/jquery-hoverintent/jquery.hoverIntent.js' ], [ WORKING_DIR + 'wp-includes/js/imagesloaded.min.js' ]: [ './node_modules/imagesloaded/imagesloaded.pkgd.min.js' ], [ WORKING_DIR + 'wp-includes/js/jquery/jquery-migrate.js' ]: [ './node_modules/jquery-migrate/dist/jquery-migrate.js' ], diff --git a/package.json b/package.json index 2e4c7ead45..3f777bce1e 100644 --- a/package.json +++ b/package.json @@ -94,6 +94,7 @@ "@wordpress/viewport": "2.3.0", "@wordpress/wordcount": "2.2.0", "backbone": "1.3.3", + "clipboard": "2.0.4", "element-closest": "^2.0.2", "formdata-polyfill": "3.0.13", "imagesloaded": "3.2.0", diff --git a/src/js/_enqueues/admin/site-health.js b/src/js/_enqueues/admin/site-health.js index 826f46f4a2..140c5c1e37 100644 --- a/src/js/_enqueues/admin/site-health.js +++ b/src/js/_enqueues/admin/site-health.js @@ -10,21 +10,14 @@ jQuery( document ).ready( function( $ ) { var data; + var clipboard = new ClipboardJS( '.site-health-copy-buttons .copy-button' ); + // Debug information copy section. - $( '.health-check-copy-field' ).click( function( e ) { - var $textarea = $( '#system-information-' + $( this ).data( 'copy-field' ) + '-copy-field' ), - $wrapper = $( this ).closest( 'div' ); + clipboard.on( 'success', function( e ) { + var $wrapper = $( e.trigger ).closest( 'div' ); + $( '.success', $wrapper ).addClass( 'visible' ); - e.preventDefault(); - - $textarea.select(); - - if ( document.execCommand( 'copy' ) ) { - $( '.copy-field-success', $wrapper ).addClass( 'visible' ); - $( this ).focus(); - - wp.a11y.speak( SiteHealth.string.site_info_copied ); - } + wp.a11y.speak( SiteHealth.string.site_info_copied ); } ); // Accordion handling in various areas. diff --git a/src/wp-admin/css/site-health.css b/src/wp-admin/css/site-health.css index cd39fe3a21..d8cbaa52f0 100644 --- a/src/wp-admin/css/site-health.css +++ b/src/wp-admin/css/site-health.css @@ -209,36 +209,23 @@ body.site-health .spinner { float: none; } -body.site-health .system-information-copy-wrapper { +.site-health-copy-buttons { display: block; margin: 1rem 0; } -body.site-health .system-information-copy-wrapper textarea { - border: 0; - padding: 0; - margin: 0; - position: absolute; - left: -9999px; - top: -9999px; -} - -body.site-health .health-check-toggle-copy-section:hover { - background: none; -} - -body.site-health .system-information-copy-wrapper .copy-button-wrapper { +.site-health-copy-buttons .copy-button-wrapper { margin: 0.5rem 0 1rem; } -body.site-health .copy-field-success { +.site-health-copy-buttons .success { display: none; color: #40860a; line-height: 1.8; margin-left: 0.5rem; } -body.site-health .copy-field-success.visible { +.site-health-copy-buttons .success.visible { display: inline-block; height: 28px; line-height: 28px; diff --git a/src/wp-admin/includes/class-wp-debug-data.php b/src/wp-admin/includes/class-wp-debug-data.php index 6e82e0b672..a49ffc2922 100644 --- a/src/wp-admin/includes/class-wp-debug-data.php +++ b/src/wp-admin/includes/class-wp-debug-data.php @@ -881,15 +881,16 @@ class WP_Debug_Data { } /** - * Print the formatted variation of the information gathered for debugging, in a manner - * suitable for a text area that can be instantly copied to a forum or support ticket. + * Format the information gathered for debugging, in a manner suitable for copying to a forum or support ticket. * * @since 5.2.0 * * @param array $info_array Information gathered from the `WP_Debug_Data::debug_data` function. + * @param string $type Optional. The data type to format the information as. Default 'text'. + * @return string The formatted data. */ - public static function textarea_format( $info_array ) { - echo "`\n"; + public static function format( $info_array, $type = 'text' ) { + $return = ''; foreach ( $info_array as $section => $details ) { // Skip this section if there are no fields, or the section has been declared as private. @@ -897,7 +898,7 @@ class WP_Debug_Data { continue; } - printf( + $return .= sprintf( "### %s%s ###\n\n", $details['label'], ( isset( $details['show_count'] ) && $details['show_count'] ? sprintf( ' (%d)', count( $details['fields'] ) ) : '' ) @@ -921,15 +922,16 @@ class WP_Debug_Data { } } - printf( + $return .= sprintf( "%s: %s\n", $field['label'], $values ); } - echo "\n"; + $return .= "\n"; } - echo '`'; + + return $return; } /** diff --git a/src/wp-admin/site-health-info.php b/src/wp-admin/site-health-info.php index cf245c4e1e..571c221dd6 100644 --- a/src/wp-admin/site-health-info.php +++ b/src/wp-admin/site-health-info.php @@ -61,7 +61,11 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
- + +
++
-