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.