Make WordPress Core

Changeset 45076


Ignore:
Timestamp:
03/30/2019 03:37:28 PM (7 years ago)
Author:
afercia
Message:

Administration: Display a notice in the Site Health pages when JavaScript is off.

  • displays an error notice when JavaScript is off, consistently with other admin screens that depend on JavaScript
  • keeps the main h1 visible

Minor clean-ups:

  • makes code indentation consistent in site-health.php and site-health-info.php
  • removes a couple of <div class="wp-clearfix"></div> as that's not the intended usage of wp-clearfix (those divs didn't do anything anyways)

Fixes #46717.

Location:
trunk/src/wp-admin
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/site-health-info.php

    r45075 r45076  
    3030require_once( ABSPATH . 'wp-admin/admin-header.php' );
    3131?>
     32<div class="health-check-header">
     33    <div class="health-check-title-section">
     34        <h1>
     35            <?php _ex( 'Site Health', 'Menu, Section and Page Title' ); ?>
     36        </h1>
    3237
    33     <div class="health-check-header">
    34         <div class="health-check-title-section">
    35             <h1>
    36                 <?php _ex( 'Site Health', 'Menu, Section and Page Title' ); ?>
    37             </h1>
    38 
    39             <div class="site-health-progress loading">
    40                 <svg role="img" aria-hidden="true" focusable="false" width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
    41                     <circle r="90" cx="100" cy="100" fill="transparent" stroke-dasharray="565.48" stroke-dashoffset="0"></circle>
    42                     <circle id="bar" r="90" cx="100" cy="100" fill="transparent" stroke-dasharray="565.48" stroke-dashoffset="0"></circle>
    43                 </svg>
    44                 <span class="screen-reader-text"><?php _e( 'Current health score:' ); ?></span>
    45                 <span class="site-health-progress-count"></span>
    46             </div>
     38        <div class="site-health-progress hide-if-no-js loading">
     39            <svg role="img" aria-hidden="true" focusable="false" width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
     40                <circle r="90" cx="100" cy="100" fill="transparent" stroke-dasharray="565.48" stroke-dashoffset="0"></circle>
     41                <circle id="bar" r="90" cx="100" cy="100" fill="transparent" stroke-dasharray="565.48" stroke-dashoffset="0"></circle>
     42            </svg>
     43            <span class="screen-reader-text"><?php _e( 'Current health score:' ); ?></span>
     44            <span class="site-health-progress-count"></span>
    4745        </div>
    48 
    49         <nav class="health-check-tabs-wrapper" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
    50             <a href="<?php echo esc_url( admin_url( 'site-health.php' ) ); ?>" class="health-check-tab">
    51                 <?php _e( 'Status' ); ?>
    52             </a>
    53 
    54             <a href="<?php echo esc_url( admin_url( 'site-health.php?tab=debug' ) ); ?>" class="health-check-tab active" aria-current="true">
    55                 <?php _e( 'Info' ); ?>
    56             </a>
    57         </nav>
    58 
    59         <div class="wp-clearfix"></div>
    6046    </div>
    6147
    62     <div class="health-check-body">
    63         <?php
    64         WP_Debug_Data::check_for_updates();
     48    <nav class="health-check-tabs-wrapper hide-if-no-js" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
     49        <a href="<?php echo esc_url( admin_url( 'site-health.php' ) ); ?>" class="health-check-tab">
     50            <?php _e( 'Status' ); ?>
     51        </a>
    6552
    66         $info         = WP_Debug_Data::debug_data();
    67         $english_info = '';
    68         if ( 0 !== strpos( get_locale(), 'en' ) ) {
    69             $english_info = WP_Debug_Data::debug_data( 'en_US' );
    70         }
    71         ?>
     53        <a href="<?php echo esc_url( admin_url( 'site-health.php?tab=debug' ) ); ?>" class="health-check-tab active" aria-current="true">
     54            <?php _e( 'Info' ); ?>
     55        </a>
     56    </nav>
     57</div>
    7258
    73         <h2>
    74             <?php _e( 'Site Info' ); ?>
    75         </h2>
     59<div class="notice notice-error hide-if-js">
     60    <p><?php _e( 'The Site Health check requires JavaScript.' ); ?></p>
     61</div>
    7662
    77         <p>
    78             <?php _e( 'This page can show you every detail about the configuration of your WordPress website. If we see anything here that could be improved, we will let you know on the Site Status page.' ); ?>
    79         </p>
    80         <p>
    81             <?php _e( 'If you want to export a handy list of all the information on this page, you can use the button below to copy it to the clipboard. You can then paste it in a text file and save it to your harddrive, or paste it in an email exchange with a support engineer or theme/plugin developer for example.' ); ?>
    82         </p>
     63<div class="health-check-body hide-if-no-js">
     64    <?php
     65    WP_Debug_Data::check_for_updates();
    8366
    84         <div class="site-health-copy-buttons">
     67    $info         = WP_Debug_Data::debug_data();
     68    $english_info = '';
     69    if ( 0 !== strpos( get_locale(), 'en' ) ) {
     70        $english_info = WP_Debug_Data::debug_data( 'en_US' );
     71    }
     72    ?>
     73
     74    <h2>
     75        <?php _e( 'Site Info' ); ?>
     76    </h2>
     77
     78    <p>
     79        <?php _e( 'This page can show you every detail about the configuration of your WordPress website. If we see anything here that could be improved, we will let you know on the Site Status page.' ); ?>
     80    </p>
     81    <p>
     82        <?php _e( 'If you want to export a handy list of all the information on this page, you can use the button below to copy it to the clipboard. You can then paste it in a text file and save it to your harddrive, or paste it in an email exchange with a support engineer or theme/plugin developer for example.' ); ?>
     83    </p>
     84
     85    <div class="site-health-copy-buttons">
     86        <div class="copy-button-wrapper">
     87            <button type="button" class="button button-primary copy-button" data-clipboard-text="<?php echo esc_attr( WP_Debug_Data::format( $info, 'text' ) ); ?>"><?php _e( 'Copy site info to clipboard' ); ?></button>
     88            <span class="success" aria-hidden="true">Copied!</span>
     89        </div>
     90        <?php if ( $english_info ) : ?>
    8591            <div class="copy-button-wrapper">
    86                 <button type="button" class="button button-primary copy-button" data-clipboard-text="<?php echo esc_attr( WP_Debug_Data::format( $info, 'text' ) ); ?>"><?php _e( 'Copy site info to clipboard' ); ?></button>
     92                <button type="button" class="button copy-button" data-clipboard-text="<?php echo esc_attr( WP_Debug_Data::format( $english_info, 'text' ) ); ?>"><?php _e( 'Copy site info to clipboard (English)' ); ?></button>
    8793                <span class="success" aria-hidden="true">Copied!</span>
    8894            </div>
    89             <?php if ( $english_info ) : ?>
    90                 <div class="copy-button-wrapper">
    91                     <button type="button" class="button copy-button" data-clipboard-text="<?php echo esc_attr( WP_Debug_Data::format( $english_info, 'text' ) ); ?>"><?php _e( 'Copy site info to clipboard (English)' ); ?></button>
    92                     <span class="success" aria-hidden="true">Copied!</span>
    93                 </div>
     95        <?php endif; ?>
     96    </div>
     97
     98    <dl id="health-check-debug" role="presentation" class="health-check-accordion">
     99
     100        <?php
     101        foreach ( $info as $section => $details ) {
     102            if ( ! isset( $details['fields'] ) || empty( $details['fields'] ) ) {
     103                continue;
     104            }
     105            ?>
     106            <dt role="heading" aria-level="3">
     107                <button aria-expanded="false" class="health-check-accordion-trigger" aria-controls="health-check-accordion-block-<?php echo esc_attr( $section ); ?>" id="health-check-accordion-heading-<?php echo esc_attr( $section ); ?>" type="button">
     108        <span class="title">
     109            <?php echo esc_html( $details['label'] ); ?>
     110
     111            <?php if ( isset( $details['show_count'] ) && $details['show_count'] ) : ?>
     112                <?php printf( '(%d)', count( $details['fields'] ) ); ?>
    94113            <?php endif; ?>
    95         </div>
     114        </span>
     115                    <span class="icon"></span>
     116                </button>
     117            </dt>
    96118
    97         <dl id="health-check-debug" role="presentation" class="health-check-accordion">
    98 
    99             <?php
    100             foreach ( $info as $section => $details ) {
    101                 if ( ! isset( $details['fields'] ) || empty( $details['fields'] ) ) {
    102                     continue;
     119            <dd id="health-check-accordion-block-<?php echo esc_attr( $section ); ?>" role="region" aria-labelledby="health-check-accordion-heading-<?php echo esc_attr( $section ); ?>" class="health-check-accordion-panel" hidden="hidden">
     120                <?php
     121                if ( isset( $details['description'] ) && ! empty( $details['description'] ) ) {
     122                    printf(
     123                        '<p>%s</p>',
     124                        wp_kses(
     125                            $details['description'],
     126                            array(
     127                                'a'      => array(
     128                                    'href' => true,
     129                                ),
     130                                'strong' => true,
     131                                'em'     => true,
     132                            )
     133                        )
     134                    );
    103135                }
    104136                ?>
    105                 <dt role="heading" aria-level="3">
    106                     <button aria-expanded="false" class="health-check-accordion-trigger" aria-controls="health-check-accordion-block-<?php echo esc_attr( $section ); ?>" id="health-check-accordion-heading-<?php echo esc_attr( $section ); ?>" type="button">
    107             <span class="title">
    108                 <?php echo esc_html( $details['label'] ); ?>
     137                <table class="widefat striped health-check-table" role="presentation">
     138                    <tbody>
     139                    <?php
     140                    foreach ( $details['fields'] as $field ) {
     141                        if ( is_array( $field['value'] ) ) {
     142                            $values = '<ul>';
     143                            foreach ( $field['value'] as $name => $value ) {
     144                                $values .= sprintf(
     145                                    '<li>%s: %s</li>',
     146                                    esc_html( $name ),
     147                                    esc_html( $value )
     148                                );
     149                            }
     150                            $values .= '</ul>';
     151                        } else {
     152                            $values = esc_html( $field['value'] );
     153                        }
    109154
    110                 <?php if ( isset( $details['show_count'] ) && $details['show_count'] ) : ?>
    111                     <?php printf( '(%d)', count( $details['fields'] ) ); ?>
    112                 <?php endif; ?>
    113             </span>
    114                         <span class="icon"></span>
    115                     </button>
    116                 </dt>
    117 
    118                 <dd id="health-check-accordion-block-<?php echo esc_attr( $section ); ?>" role="region" aria-labelledby="health-check-accordion-heading-<?php echo esc_attr( $section ); ?>" class="health-check-accordion-panel" hidden="hidden">
    119                     <?php
    120                     if ( isset( $details['description'] ) && ! empty( $details['description'] ) ) {
    121155                        printf(
    122                             '<p>%s</p>',
    123                             wp_kses(
    124                                 $details['description'],
    125                                 array(
    126                                     'a'      => array(
    127                                         'href' => true,
    128                                     ),
    129                                     'strong' => true,
    130                                     'em'     => true,
    131                                 )
    132                             )
     156                            '<tr><td>%s</td><td>%s</td></tr>',
     157                            esc_html( $field['label'] ),
     158                            $values
    133159                        );
    134160                    }
    135161                    ?>
    136                     <table class="widefat striped health-check-table" role="presentation">
    137                         <tbody>
    138                         <?php
    139                         foreach ( $details['fields'] as $field ) {
    140                             if ( is_array( $field['value'] ) ) {
    141                                 $values = '<ul>';
    142                                 foreach ( $field['value'] as $name => $value ) {
    143                                     $values .= sprintf(
    144                                         '<li>%s: %s</li>',
    145                                         esc_html( $name ),
    146                                         esc_html( $value )
    147                                     );
    148                                 }
    149                                 $values .= '</ul>';
    150                             } else {
    151                                 $values = esc_html( $field['value'] );
    152                             }
    153 
    154                             printf(
    155                                 '<tr><td>%s</td><td>%s</td></tr>',
    156                                 esc_html( $field['label'] ),
    157                                 $values
    158                             );
    159                         }
    160                         ?>
    161                         </tbody>
    162                     </table>
    163                 </dd>
    164             <?php } ?>
    165         </dl>
    166     </div>
     162                    </tbody>
     163                </table>
     164            </dd>
     165        <?php } ?>
     166    </dl>
     167</div>
    167168
    168169<?php
  • trunk/src/wp-admin/site-health.php

    r45071 r45076  
    3535require_once( ABSPATH . 'wp-admin/admin-header.php' );
    3636?>
    37 
    3837<div class="health-check-header">
    3938    <div class="health-check-title-section">
     
    4241        </h1>
    4342
    44         <div class="site-health-progress loading">
     43        <div class="site-health-progress hide-if-no-js loading">
    4544            <svg role="img" aria-hidden="true" focusable="false" width="100%" height="100%" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
    4645                <circle r="90" cx="100" cy="100" fill="transparent" stroke-dasharray="565.48" stroke-dashoffset="0"></circle>
     
    5251    </div>
    5352
    54     <nav class="health-check-tabs-wrapper" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
     53    <nav class="health-check-tabs-wrapper hide-if-no-js" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
    5554        <a href="<?php echo esc_url( admin_url( 'site-health.php' ) ); ?>" class="health-check-tab active" aria-current="true">
    5655            <?php _e( 'Status' ); ?>
     
    6160        </a>
    6261    </nav>
    63 
    64     <div class="wp-clearfix"></div>
    6562</div>
    6663
    67 <div class="health-check-body">
     64<div class="notice notice-error hide-if-js">
     65    <p><?php _e( 'The Site Health check requires JavaScript.' ); ?></p>
     66</div>
     67
     68<div class="health-check-body hide-if-no-js">
    6869    <div class="site-status-all-clear hide">
    6970        <p class="icon">
Note: See TracChangeset for help on using the changeset viewer.