amp-debug-bar-compat.php

<?php
/**
 * AMP Debug Bar Compat
 *
 * @package   AMP_Debug_Bar_Compat
 * @author    Weston Ruter, Google
 * @license   GPL-2.0-or-later
 * @copyright 2020 Google LLC
 *
 * @wordpress-plugin
 * Plugin Name:     AMP Debug Bar Compat
 * Description:     Integrate Debug Bar with AMP dev mode so that its scripts/styles are not removed in the sanitization process. Depends on <a href="https://wordpress.org/plugins/amp/">AMP plugin</a>.
 * Plugin URI:      https://gist.github.com/westonruter/f9c382ef5fbc06002172b525b379f392
 * Version:         0.1.0
 * Author:          Weston Ruter, Google
 * Author URI:      https://weston.ruter.net/
 * License:         GNU General Public License v2 (or later)
 * License URI:     http://www.gnu.org/licenses/gpl-2.0.html
 * Gist Plugin URI: https://gist.github.com/westonruter/f9c382ef5fbc06002172b525b379f392
 */

namespace AMP_Debug_Bar_Compat;

use Debug_Bar;

/**
 * Determine whether it is an AMP request.
 *
 * @return bool Whether AMP.
 */
function is_amp() {
	return function_exists( 'is_amp_endpoint' ) && is_amp_endpoint();
}

/**
 * Determine whether debug bar is enabled.
 *
 * @return bool
 */
function is_debug_bar_enabled() {
	global $debug_bar;
	if ( $debug_bar instanceof Debug_Bar ) {
		return $debug_bar->enable_debug_bar();
	}
	return false;
}

/**
 * Add inline scripts added by Debug Bar to AMP dev mode.
 *
 * @see Debug_Bar::ensure_ajaxurl()
 *
 * @param string[] $xpaths XPaths.
 * @return string[] XPaths.
 */
function add_dev_mode_attributes( $xpaths ) {
	if ( is_debug_bar_enabled() ) {
		$xpaths[] = '//script[ contains( text(), "var ajaxurl" ) ]';
	}
	return $xpaths;
}
add_filter( 'amp_dev_mode_element_xpaths', __NAMESPACE__ . '\add_dev_mode_attributes' );

/**
 * Mark Debug Bar scripts for dev mode by making them dependent on admin-bar.
 *
 * See also https://github.com/ampproject/amp-wp/issues/4598
 */
function mark_scripts_for_dev_mode() {
	if ( ! is_debug_bar_enabled() || ! is_amp() ) {
		return;
	}

	$debug_bar_handles = [
		'jquery',
		'debug-bar',
		'debug-bar-js',
	];
	foreach ( $debug_bar_handles as $debug_bar_handle ) {
		if ( wp_script_is( $debug_bar_handle, 'registered' ) ) {
			wp_scripts()->registered[ $debug_bar_handle ]->deps[] = 'admin-bar';
		}
	}
}
add_action( 'wp_print_scripts', __NAMESPACE__ . '\mark_scripts_for_dev_mode' );

/**
 * Mark Debug Bar styles for dev mode by making them dependent on admin-bar.
 *
 * See also https://github.com/ampproject/amp-wp/issues/4598
 */
function mark_styles_for_dev_mode() {
	if ( ! is_debug_bar_enabled() || ! is_amp() ) {
		return;
	}

	$debug_bar_handles = [
		'debug-bar',
	];
	foreach ( $debug_bar_handles as $debug_bar_handle ) {
		if ( wp_style_is( $debug_bar_handle, 'registered' ) ) {
			wp_styles()->registered[ $debug_bar_handle ]->deps[] = 'admin-bar';
		}
	}
}
add_action( 'wp_print_styles', __NAMESPACE__ . '\mark_styles_for_dev_mode' );

Installation instructions: https://gist.github.com/westonruter/6110fbc4bef0c4b8c021a112012f7e9c