[FIXED] How do I debug a WordPress plugin?

Issue

I've recently inherited a WordPress plugin that has a few bugs in it. My problem is that I'm also new to WordPress and I don't know how to log debug messages so that I can figure out what's going on.

I really just need a way to create a popup or log to a console.

Solution

There's this excellent Q&A at WordPress Stack Exchange, lots of knowledgeable folks explaining their debugging techniques: How do you debug plugins?

In the Javascript arena you basically need <script>console.log('the value is' + variable);</script>. And use Google Chrome inspector and/or Firebug.

In PHP, it depends on where things are happening or where you want the output.

---

Debugging in WordPress

Official documentation in the Codex.

Example wp-config.php for Debugging

// Enable WP_DEBUG mode
define( 'WP_DEBUG', true );

// Enable Debug logging to the /wp-content/debug.log file
define( 'WP_DEBUG_LOG', true );

// Disable display of errors and warnings 
define( 'WP_DEBUG_DISPLAY', false );
@ini_set( 'display_errors', 0 );

// Use dev versions of core JS and CSS files (only needed if you are modifying these core files)
define( 'SCRIPT_DEBUG', true );

---

Printing information to a log file

The following uses an OSX/Unix/Linux system path, adjust for Windows.

/* Log to File
 * Description: Log into system php error log, usefull for Ajax and stuff that FirePHP doesn't catch
 */
function my_log_file( $msg, $name = '' )
{
    // Print the name of the calling function if $name is left empty
    $trace=debug_backtrace();
    $name = ( '' == $name ) ? $trace[1]['function'] : $name;

    $error_dir = '/Applications/MAMP/logs/php_error.log';
    $msg = print_r( $msg, true );
    $log = $name . "  |  " . $msg . "\n";
    error_log( $log, 3, $error_dir );
}

Then, in you code call the function my_log_file( $post, 'The post contents are:' );

---

Print directly in the rendered Html

/* Echo variable
 * Description: Uses <pre> and print_r to display a variable in formated fashion
 */
function echo_log( $what )
{
    echo '<pre>'.print_r( $what, true ).'</pre>';
}

And wherever needed use it like: echo_log( $post );.

---

FirePHP

This extension will log information directly in the browser console. Refer to the following Q&A at WordPress Answers: How to use WP-FirePHP extension?.

---

Query Monitor

This is a must have on a debug toolkit, the plugin has many features, one of them is its Logs tab, just drop this in your code and have it listed in the plugin interface in your page:

do_action( 'qm/debug', 'This happened!' );
do_action( 'qm/debug', $your_var );
do_action( 'qm/debug', [$var1, $var2] );

Answered By - brasofilo

Answer Checked By - Marilyn (PHPFixing Volunteer)