Debug Bar - Version 1.1.1

Version Description

Refactor the HTTP Requests panel: - Remove jQuery usage - Properly display response codes - Better CSS to emphasize errors and long requests ( > 250ms )

Download this release

Release Info

Developer aidvu
Plugin Icon 128x128 Debug Bar
Version 1.1.1
Comparing to
See all releases

Code changes from version 1.1 to 1.1.1

Files changed (3) hide show
  1. debug-bar.php +1 -1
  2. panels/class-debug-bar-wp-http.php +156 -92
  3. readme.txt +15 -3
debug-bar.php CHANGED
@@ -4,7 +4,7 @@
4
  Plugin URI: https://wordpress.org/plugins/debug-bar/
5
  Description: Adds a debug menu to the admin bar that shows query, cache, and other helpful debugging information.
6
  Author: wordpressdotorg
7
- Version: 1.1
8
  Author URI: https://wordpress.org/
9
  Text Domain: debug-bar
10
  */
4
  Plugin URI: https://wordpress.org/plugins/debug-bar/
5
  Description: Adds a debug menu to the admin bar that shows query, cache, and other helpful debugging information.
6
  Author: wordpressdotorg
7
+ Version: 1.1.1
8
  Author URI: https://wordpress.org/
9
  Text Domain: debug-bar
10
  */
panels/class-debug-bar-wp-http.php CHANGED
@@ -1,48 +1,24 @@
1
  <?php
2
 
3
- class Debug_Bar_WP_Http_Request {
4
- public $time_start;
5
- public $time_end;
6
-
7
- public $request;
8
- public $result;
9
- public $stack_trace;
10
-
11
- function __construct( $request ) {
12
- $this->time_start = microtime( true );
13
- if ( ! isset( $_GET['fullbody'] ) ) {
14
- $request['args']['body'] = '[omitted]';
15
- }
16
- $this->request = $request;
17
- }
18
-
19
- function end( $result ) {
20
- $this->time_end = microtime( true );
21
- if ( is_array( $result['r'] ) && ! isset( $_GET['fullbody'] ) ) {
22
- $result['r']['body'] = '[omitted]';
23
- $result['args']['body'] = '[omitted]';
24
- }
25
- $this->result = $result;
26
- $this->stack_trace = wp_debug_backtrace_summary( null, 0, false );
27
- }
28
- }
29
-
30
  class Debug_Bar_WP_Http extends Debug_Bar_Panel {
31
- public $requests = array();
 
 
 
 
32
 
33
  function early_init() {
34
- add_filter( 'http_request_args', array( $this, 'before_http_request' ), 10, 3 );
35
- add_action( 'http_api_debug', array( $this, 'after_http_request' ), 10, 5 );
36
  }
37
 
38
  function before_http_request( $args, $url ) {
39
- $request = new Debug_Bar_WP_Http_Request( array(
40
- 'args' => $args,
41
- 'url' => $url,
42
- ) );
43
 
44
- $this->requests["$request->time_start"] = $request;
45
- $args['time_start'] = $request->time_start;
 
 
46
 
47
  return $args;
48
  }
@@ -52,17 +28,43 @@ class Debug_Bar_WP_Http extends Debug_Bar_Panel {
52
  return;
53
  }
54
 
55
- $request =& $this->requests["{$args['time_start']}"];
56
- $request->end( array(
57
- 'r' => $response,
58
- 'class' => $class,
59
- 'args' => $args,
60
- 'url' => $url,
61
- ) );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
62
  }
63
 
64
- function count_errors() {
65
- return 0;
 
 
 
 
 
 
 
66
  }
67
 
68
  function init() {
@@ -74,68 +76,130 @@ class Debug_Bar_WP_Http extends Debug_Bar_Panel {
74
  }
75
 
76
  function debug_bar_classes( $classes ) {
77
- if ( $this->count_errors() ) {
 
 
 
78
  $classes[] = 'debug-bar-php-warning-summary';
79
  }
80
-
81
  return $classes;
82
  }
83
 
84
  function render() {
85
- $out = "
86
- <style>
87
- #pdbhttp { clear: left; }
88
- #pdbhttp .err { background-color: #ffebe8; border: 1px solid #c00; }
89
- #pdbhttp th, #pdbhttp td { padding: 8px; }
90
- #pdbhttp pre { font-family: monospace; }
91
- </style>\n";
92
- $out .= "<script>function pdbhttp_toggle(e) {jQuery(e).toggle();}</script>";
93
- $out .= "<table id='pdbhttp'>\n";
94
- $out .= "<thead><tr><th>More</th><th>Start</th><th>Duration</th><th>Method</th><th>URL</th><th>Code</th></tr></thead>\n<tbody>\n";
95
-
96
- $total_time = 0;
97
- $total_errors = 0;
98
- foreach ( array_values( $this->requests ) as $i => $r ) {
99
- $start = $r->time_start - $_SERVER['REQUEST_TIME_FLOAT'];
100
- $elapsed = $r->time_end - $r->time_start;
101
- $total_time += $elapsed;
 
 
 
 
 
102
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
103
  $class = '';
104
- $code = '';
105
- if ( is_wp_error( $r->result['r'] ) || $r->result['r']['response']['code'] >= 400 ) {
 
 
106
  $class = 'err';
107
- $total_errors++;
108
- if ( is_wp_error( $r->result['r'] ) ) {
109
- $code = $r->result['r']->get_error_code();
110
- } else {
111
- $code = $r->result['r']['response']['code'];
112
- }
113
  }
114
 
115
- $out .= "<tr class='$class'>";
116
- $out .= "<td><a onclick='pdbhttp_toggle(\"#pdbhttp_$i\")'>Toggle</a></td>";
117
- $out .= "<td>" . number_format( sprintf( '%0.1f', $start * 1000 ), 1 ) . " ms</td>";
118
- $out .= "<td>" . number_format( sprintf( '%0.1f', $elapsed * 1000 ), 1 ) . " ms</td>";
119
- $out .= "<td>{$r->request['args']['method']}</td>";
120
- $out .= "<td>{$r->request['url']}</td>";
121
- $out .= "<td>{$code}</td>";
122
- $out .= "</tr>\n";
123
- $out .= "<tr id='pdbhttp_$i' style='display: none'><td colspan=5><pre>" . esc_html( print_r( $r, 1 ) ) . "</pre></td></tr>\n";
124
- }
125
- $out .= "</tbody>\n</table>\n";
126
 
127
- $heading = '';
128
- $heading .= '<h2><span>HTTP Requests:</span>' . number_format( count( $this->requests ) ) . "</h2>\n";
129
- $heading .= '<h2><span>Total Elapsed:</span>' . number_format( sprintf( '%0.1f', $total_time * 1000 ), 1 ) . " ms</h2>\n";
130
- $heading .= '<h2><span>Errors:</span>' . number_format( $total_errors ) . "</h2>\n";
131
 
132
- if ( isset( $_GET['fullbody'] ) ) {
133
- $heading .= '<p style="clear:left">Request and response bodies are included. <a href="' . esc_attr( remove_query_arg( 'fullbody' ) ) . '">Reload with those omitted.</a>';
134
- } else {
135
- $heading .= '<p style="clear:left">Request and response bodies are omitted. <a href="' . esc_attr( add_query_arg( 'fullbody', 'please' ) ) . '">Reload with those included.</a>';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
136
  }
137
 
138
- $out = $heading . $out;
 
 
 
139
 
140
  echo $out;
141
  }
1
  <?php
2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3
  class Debug_Bar_WP_Http extends Debug_Bar_Panel {
4
+ public $requests = [];
5
+
6
+ public $time_limit = 250; // milliseconds
7
+ public $total_time = 0;
8
+ public $num_errors = 0;
9
 
10
  function early_init() {
11
+ add_filter( 'http_request_args', [ $this, 'before_http_request' ], 10, 3 );
12
+ add_filter( 'http_api_debug', [ $this, 'after_http_request' ], 10, 5 );
13
  }
14
 
15
  function before_http_request( $args, $url ) {
16
+ $args['time_start'] = microtime( true );
 
 
 
17
 
18
+ $this->requests["{$args['time_start']}"] = [
19
+ 'url' => $url,
20
+ 'args' => $args
21
+ ];
22
 
23
  return $args;
24
  }
28
  return;
29
  }
30
 
31
+ $args['time_stop'] = microtime( true );
32
+
33
+ $args['duration'] = $args['time_stop'] - $args['time_start'];
34
+ $args['duration'] *= 1000;
35
+
36
+ $this->total_time += $args['duration'];
37
+
38
+ if ( $this->is_request_error( $response ) ) {
39
+ $this->num_errors++;
40
+ } else {
41
+ if ( ! isset( $_GET['fullbody'] ) ) {
42
+ $response['body'] = '[omitted]';
43
+ unset( $response['http_response'] );
44
+ }
45
+ }
46
+
47
+ $this->requests["{$args['time_start']}"] = array_merge(
48
+ $this->requests["{$args['time_start']}"],
49
+ [
50
+ 'r' => $response,
51
+ 'class' => $class,
52
+ 'args' => $args,
53
+ 'url' => $url,
54
+ 'stack_trace' => wp_debug_backtrace_summary( null, 0, false ),
55
+ ]
56
+ );
57
  }
58
 
59
+ function is_request_error( $response ) {
60
+ if (
61
+ is_wp_error( $response )
62
+ || $response['response']['code'] >= 400
63
+ ) {
64
+ return true;
65
+ }
66
+
67
+ return false;
68
  }
69
 
70
  function init() {
76
  }
77
 
78
  function debug_bar_classes( $classes ) {
79
+ if (
80
+ $this->num_errors > 0
81
+ || $this->total_time > $this->time_limit
82
+ ) {
83
  $classes[] = 'debug-bar-php-warning-summary';
84
  }
 
85
  return $classes;
86
  }
87
 
88
  function render() {
89
+ $num_requests = number_format( count( $this->requests ) );
90
+ $elapsed = number_format( $this->total_time, 1 );
91
+ $num_errors = number_format( $this->num_errors );
92
+
93
+ if ( isset( $_GET['fullbody'] ) ) {
94
+ $fullbody = '<p style="clear:left">Request and response bodies are included. <a href="' . esc_attr( remove_query_arg( 'fullbody' ) ) . '">Reload with those omitted.</a>';
95
+ } else {
96
+ $fullbody = '<p style="clear:left">Request and response bodies are omitted. <a href="' . esc_attr( add_query_arg( 'fullbody', 'please' ) ) . '">Reload with those included.</a>';
97
+ }
98
+
99
+ $css_errors = '';
100
+ if (
101
+ $this->num_errors > 0
102
+ || $this->total_time > $this->time_limit
103
+ ) {
104
+ $css_errors = "#wp-admin-bar-debug-bar-Debug_Bar_WP_Http, #debug-menu-link-Debug_Bar_WP_Http { background-color: #d00 !important; background-image: -moz-linear-gradient(bottom,#f44,#d00) !important; background-image: -webkit-gradient(linear,left bottom,left top,from(#f44),to(#d00)) important; }\n";
105
+ }
106
+
107
+ $elapsed_class = '';
108
+ if ( $this->num_errors > 0 ) {
109
+ $elapsed_class = 'debug_bar_http_error';
110
+ }
111
 
112
+ $errors_class = '';
113
+ if ( $this->total_time > $this->time_limit ) {
114
+ $errors_class = 'debug_bar_http_error';
115
+ }
116
+
117
+ $out =<<<HTML
118
+ <style>
119
+ #debug_bar_http { clear: left; }
120
+ #debug_bar_http .err, .debug_bar_http_error { background-color: #ffebe8; border: 1px solid #c00 !important; }
121
+ #debug_bar_http th, #debug_bar_http td { padding: 8px; }
122
+ #debug_bar_http pre { font-family: monospace; }
123
+ {$css_errors}
124
+ </style>
125
+
126
+ <script>
127
+ function debug_bar_http_toggle( id ) {
128
+ var e = document.getElementById( id );
129
+ if ( e.style.display === "" ) {
130
+ e.style.display = "none";
131
+ } else {
132
+ e.style.display = "";
133
+ }
134
+ }
135
+ </script>
136
+
137
+ <h2><span>HTTP Requests:</span> {$num_requests}</h2>
138
+ <h2 class="{$elapsed_class}"><span>Total Elapsed:</span> {$elapsed} ms</h2>
139
+ <h2 class="{$errors_class}"><span>Errors:</span> {$num_errors}</h2>
140
+
141
+ {$fullbody}
142
+
143
+ <table id="debug_bar_http">
144
+ <thead>
145
+ <tr>
146
+ <th>More</th>
147
+ <th>Start</th>
148
+ <th>Duration</th>
149
+ <th>Method</th>
150
+ <th>URL</th>
151
+ <th>Code</th>
152
+ </tr>
153
+ </thead>
154
+ <tbody>
155
+ HTML;
156
+
157
+ foreach( $this->requests as $i => $r ) {
158
  $class = '';
159
+ if (
160
+ $this->is_request_error( $r['r'] )
161
+ || $r['args']['duration'] > $this->time_limit
162
+ ) {
163
  $class = 'err';
 
 
 
 
 
 
164
  }
165
 
166
+ $start = $r['args']['time_start'] - $_SERVER['REQUEST_TIME_FLOAT'];
167
+ $start *= 1000;
168
+ $start = number_format( $start, 1 );
 
 
 
 
 
 
 
 
169
 
170
+ $duration = number_format( $r['args']['duration'], 1 );
171
+ $method = esc_html( $r['args']['method'] );
172
+ $url = esc_html( $r['url'] );
 
173
 
174
+ if ( is_wp_error( $r['r'] ) ) {
175
+ $code = esc_html( $r['r']->get_error_code() );
176
+ } else {
177
+ $code = esc_html( $r['r']['response']['code'] );
178
+ }
179
+
180
+ $details = esc_html( print_r( $r, true ) );
181
+
182
+ $record_id = 'debug_bar_http_record_' . md5( $i );
183
+ $out .=<<<HTML
184
+ <tr class="{$class}">
185
+ <td><a onclick="debug_bar_http_toggle( '{$record_id}' );">Toggle</a></td>
186
+ <td>{$start} ms</td>
187
+ <td>{$duration} ms</td>
188
+ <td>{$method}</td>
189
+ <td>{$url}</td>
190
+ <td>{$code}</td>
191
+ </tr>
192
+
193
+ <tr id="{$record_id}" style="display: none">
194
+ <td colspan="5"><pre>{$details}</pre></td>
195
+ </tr>
196
+ HTML;
197
  }
198
 
199
+ $out .=<<<HTML
200
+ </tbody>
201
+ </table>
202
+ HTML;
203
 
204
  echo $out;
205
  }
readme.txt CHANGED
@@ -1,8 +1,8 @@
1
  === Debug Bar ===
2
- Contributors: wordpressdotorg, ryan, westi, koopersmith, duck_, mitchoyoshitaka, dd32, jrf, obenland, nacin, evansolomon, Otto42, aidvu
3
  Tags: debug
4
- Tested up to: 5.5.1
5
- Stable tag: 1.1
6
  Requires at least: 3.4
7
 
8
  Adds a debug menu to the admin bar that shows query, cache, and other helpful debugging information.
@@ -29,6 +29,12 @@ There are numerous other add-ons available to get more insight into, for instanc
29
 
30
  == Upgrade Notice ==
31
 
 
 
 
 
 
 
32
  = 1.1 =
33
  Add a new panel for HTTP requests using the native WP methods.
34
  AMP dev mode compatibility.
@@ -106,6 +112,12 @@ Initial Release
106
 
107
  == Changelog ==
108
 
 
 
 
 
 
 
109
  = 1.1 =
110
  Add a new panel for HTTP requests using the native WP methods.
111
  AMP dev mode compatibility.
1
  === Debug Bar ===
2
+ Contributors: wordpressdotorg, ryan, westi, koopersmith, duck_, mitchoyoshitaka, dd32, jrf, obenland, nacin, evansolomon, Otto42, aidvu, josephscott
3
  Tags: debug
4
+ Tested up to: 5.5.3
5
+ Stable tag: 1.1.1
6
  Requires at least: 3.4
7
 
8
  Adds a debug menu to the admin bar that shows query, cache, and other helpful debugging information.
29
 
30
  == Upgrade Notice ==
31
 
32
+ = 1.1.1 =
33
+ Refactor the HTTP Requests panel:
34
+ - Remove jQuery usage
35
+ - Properly display response codes
36
+ - Better CSS to emphasize errors and long requests ( > 250ms )
37
+
38
  = 1.1 =
39
  Add a new panel for HTTP requests using the native WP methods.
40
  AMP dev mode compatibility.
112
 
113
  == Changelog ==
114
 
115
+ = 1.1.1 =
116
+ Refactor the HTTP Requests panel:
117
+ - Remove jQuery usage
118
+ - Properly display response codes
119
+ - Better CSS to emphasize errors and long requests ( > 250ms )
120
+
121
  = 1.1 =
122
  Add a new panel for HTTP requests using the native WP methods.
123
  AMP dev mode compatibility.