diff -r 3d4e9c994f10 -r a86126ab1dd4 wp/wp-admin/js/site-health.js --- a/wp/wp-admin/js/site-health.js Tue Oct 22 16:11:46 2019 +0200 +++ b/wp/wp-admin/js/site-health.js Tue Dec 15 13:49:49 2020 +0100 @@ -10,19 +10,38 @@ var __ = wp.i18n.__, _n = wp.i18n._n, - sprintf = wp.i18n.sprintf; - - var data; - var clipboard = new ClipboardJS( '.site-health-copy-buttons .copy-button' ); - var isDebugTab = $( '.health-check-body.health-check-debug-tab' ).length; - var pathsSizesSection = $( '#health-check-accordion-block-wp-paths-sizes' ); + sprintf = wp.i18n.sprintf, + data, + clipboard = new ClipboardJS( '.site-health-copy-buttons .copy-button' ), + isDebugTab = $( '.health-check-body.health-check-debug-tab' ).length, + pathsSizesSection = $( '#health-check-accordion-block-wp-paths-sizes' ), + successTimeout; // Debug information copy section. clipboard.on( 'success', function( e ) { - var $wrapper = $( e.trigger ).closest( 'div' ); - $( '.success', $wrapper ).addClass( 'visible' ); + var triggerElement = $( e.trigger ), + successElement = $( '.success', triggerElement.closest( 'div' ) ); + + // Clear the selection and move focus back to the trigger. + e.clearSelection(); + // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680 + triggerElement.focus(); + + // Show success visual feedback. + clearTimeout( successTimeout ); + successElement.removeClass( 'hidden' ); - wp.a11y.speak( __( 'Site information has been added to your clipboard.' ) ); + // Hide success visual feedback after 3 seconds since last success. + successTimeout = setTimeout( function() { + successElement.addClass( 'hidden' ); + // Remove the visually hidden textarea so that it isn't perceived by assistive technologies. + if ( clipboard.clipboardAction.fakeElem && clipboard.clipboardAction.removeFake ) { + clipboard.clipboardAction.removeFake(); + } + }, 3000 ); + + // Handle success audible feedback. + wp.a11y.speak( __( 'Site information has been copied to your clipboard.' ) ); } ); // Accordion handling in various areas. @@ -48,28 +67,37 @@ } ); /** - * Append a new issue to the issue list. + * Appends a new issue to the issue list. * * @since 5.2.0 * * @param {Object} issue The issue data. */ - function AppendIssue( issue ) { + function appendIssue( issue ) { var template = wp.template( 'health-check-issue' ), issueWrapper = $( '#health-check-issues-' + issue.status ), heading, count; - + SiteHealth.site_status.issues[ issue.status ]++; count = SiteHealth.site_status.issues[ issue.status ]; if ( 'critical' === issue.status ) { - heading = sprintf( _n( '%s Critical issue', '%s Critical issues', count ), '' + count + '' ); + heading = sprintf( + _n( '%s critical issue', '%s critical issues', count ), + '' + count + '' + ); } else if ( 'recommended' === issue.status ) { - heading = sprintf( _n( '%s Recommended improvement', '%s Recommended improvements', count ), '' + count + '' ); + heading = sprintf( + _n( '%s recommended improvement', '%s recommended improvements', count ), + '' + count + '' + ); } else if ( 'good' === issue.status ) { - heading = sprintf( _n( '%s Item with no issues detected', '%s Items with no issues detected', count ), '' + count + '' ); + heading = sprintf( + _n( '%s item with no issues detected', '%s items with no issues detected', count ), + '' + count + '' + ); } if ( heading ) { @@ -80,17 +108,21 @@ } /** - * Update site health status indicator as asynchronous tests are run and returned. + * Updates site health status indicator as asynchronous tests are run and returned. * * @since 5.2.0 */ - function RecalculateProgression() { + function recalculateProgression() { var r, c, pct; var $progress = $( '.site-health-progress' ); - var $progressCount = $progress.find( '.site-health-progress-count' ); + var $wrapper = $progress.closest( '.site-health-progress-wrapper' ); + var $progressLabel = $( '.site-health-progress-label', $wrapper ); var $circle = $( '.site-health-progress svg #bar' ); - var totalTests = parseInt( SiteHealth.site_status.issues.good, 0 ) + parseInt( SiteHealth.site_status.issues.recommended, 0 ) + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 ); - var failedTests = parseInt( SiteHealth.site_status.issues.recommended, 0 ) + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 ); + var totalTests = parseInt( SiteHealth.site_status.issues.good, 0 ) + + parseInt( SiteHealth.site_status.issues.recommended, 0 ) + + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 ); + var failedTests = ( parseInt( SiteHealth.site_status.issues.recommended, 0 ) * 0.5 ) + + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 ); var val = 100 - Math.ceil( ( failedTests / totalTests ) * 100 ); if ( 0 === totalTests ) { @@ -98,7 +130,7 @@ return; } - $progress.removeClass( 'loading' ); + $wrapper.removeClass( 'loading' ); r = $circle.attr( 'r' ); c = Math.PI * ( r * 2 ); @@ -122,21 +154,18 @@ $( '#health-check-issues-recommended' ).addClass( 'hidden' ); } - if ( 50 <= val ) { - $circle.addClass( 'orange' ).removeClass( 'red' ); - } + if ( 80 <= val && 0 === parseInt( SiteHealth.site_status.issues.critical, 0 ) ) { + $wrapper.addClass( 'green' ).removeClass( 'orange' ); - if ( 90 <= val ) { - $circle.addClass( 'green' ).removeClass( 'orange' ); + $progressLabel.text( __( 'Good' ) ); + wp.a11y.speak( __( 'All site health tests have finished running. Your site is looking good, and the results are now available on the page.' ) ); + } else { + $wrapper.addClass( 'orange' ).removeClass( 'green' ); + + $progressLabel.text( __( 'Should be improved' ) ); + wp.a11y.speak( __( 'All site health tests have finished running. There are items that should be addressed, and the results are now available on the page.' ) ); } - if ( 100 === val ) { - $( '.site-status-all-clear' ).removeClass( 'hide' ); - $( '.site-status-has-issues' ).addClass( 'hide' ); - } - - $progressCount.text( val + '%' ); - if ( ! isDebugTab ) { $.post( ajaxurl, @@ -147,16 +176,15 @@ } ); - wp.a11y.speak( sprintf( - // translators: %s: The percentage score for the tests. - __( 'All site health tests have finished running. Your site scored %s, and the results are now available on the page.' ), - val + '%' - ) ); + if ( 100 === val ) { + $( '.site-status-all-clear' ).removeClass( 'hide' ); + $( '.site-status-has-issues' ).addClass( 'hide' ); + } } } /** - * Queue the next asynchronous test when we're ready to run it. + * Queues the next asynchronous test when we're ready to run it. * * @since 5.2.0 */ @@ -182,7 +210,8 @@ ajaxurl, data, function( response ) { - AppendIssue( response.data ); + /** This filter is documented in wp-admin/includes/class-wp-site-health.php */ + appendIssue( wp.hooks.applyFilters( 'site_status_test_result', response.data ) ); maybeRunNextAsyncTest(); } ); @@ -192,13 +221,13 @@ } if ( doCalculation ) { - RecalculateProgression(); + recalculateProgression(); } } if ( 'undefined' !== typeof SiteHealth && ! isDebugTab ) { if ( 0 === SiteHealth.site_status.direct.length && 0 === SiteHealth.site_status.async.length ) { - RecalculateProgression(); + recalculateProgression(); } else { SiteHealth.site_status.issues = { 'good': 0, @@ -209,7 +238,7 @@ if ( 0 < SiteHealth.site_status.direct.length ) { $.each( SiteHealth.site_status.direct, function() { - AppendIssue( this ); + appendIssue( this ); } ); } @@ -225,12 +254,12 @@ ajaxurl, data, function( response ) { - AppendIssue( response.data ); + appendIssue( response.data ); maybeRunNextAsyncTest(); } ); } else { - RecalculateProgression(); + recalculateProgression(); } } @@ -258,12 +287,14 @@ var delay = ( new Date().getTime() ) - timestamp; $( '.health-check-wp-paths-sizes.spinner' ).css( 'visibility', 'hidden' ); - RecalculateProgression(); + recalculateProgression(); if ( delay > 3000 ) { - // We have announced that we're waiting. - // Announce that we're ready after giving at least 3 seconds for the first announcement - // to be read out, or the two may collide. + /* + * We have announced that we're waiting. + * Announce that we're ready after giving at least 3 seconds + * for the first announcement to be read out, or the two may collide. + */ if ( delay > 6000 ) { delay = 0; } else { @@ -284,17 +315,17 @@ function updateDirSizes( data ) { var copyButton = $( 'button.button.copy-button' ); - var clipdoardText = copyButton.attr( 'data-clipboard-text' ); + var clipboardText = copyButton.attr( 'data-clipboard-text' ); $.each( data, function( name, value ) { var text = value.debug || value.size; if ( typeof text !== 'undefined' ) { - clipdoardText = clipdoardText.replace( name + ': loading...', name + ': ' + text ); + clipboardText = clipboardText.replace( name + ': loading...', name + ': ' + text ); } } ); - copyButton.attr( 'data-clipboard-text', clipdoardText ); + copyButton.attr( 'data-clipboard-text', clipboardText ); pathsSizesSection.find( 'td[class]' ).each( function( i, element ) { var td = $( element ); @@ -310,7 +341,7 @@ if ( pathsSizesSection.length ) { getDirectorySizes(); } else { - RecalculateProgression(); + recalculateProgression(); } } } );