Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
UPDATE: This is now obsolete. The fix to the AMP validator has been deployed.
<?php
/**
* AMP JSON Validation Error Workaround
*
* @link https://gist.github.com/westonruter/d9df78faed75297f9ca6b6be36d37ab2
* @package AMP_JSON_Validation_Error_Workaround
* @license GPL-2.0+
*
* @wordpress-plugin
* Plugin Name: AMP JSON Validation Error Workaround
* Description: Prevent AMP validation warnings from being reported due to newline characters appearing in JSON (which should not be invalid since such characters are valid whitespace).
* Plugin URI: https://gist.github.com/westonruter/d9df78faed75297f9ca6b6be36d37ab2
* Author: Weston Ruter
* Author URI: https://weston.ruter.net
* Version: 0.1
* License: GPLv2 or later
*/
namespace AMP_JSON_Validation_Error_Workaround;
/**
* Filter sanitizers.
*
* @param array $sanitizers Sanitizers.
* @return array Sanitizers.
*/
function filter_sanitizers( $sanitizers ) {
require_once __DIR__ . '/class-json-reserializing-sanitizer.php';
$sanitizers[ __NAMESPACE__ . '\JSON_Reserializing_Sanitizer' ] = [];
return $sanitizers;
}
add_filter( 'amp_content_sanitizers', __NAMESPACE__ . '\filter_sanitizers' );
<?php
/**
* AMP JSON Validation Error Workaround
*
* @package AMP_JSON_Validation_Error_Workaround
*/
namespace AMP_JSON_Validation_Error_Workaround;
use AMP_Base_Sanitizer;
use DOMXPath;
use DOMElement;
/**
* Re-serialize JSON to remove whitespace.
*/
class JSON_Reserializing_Sanitizer extends AMP_Base_Sanitizer {
/**
* Sanitize.
*/
public function sanitize() {
$xpath = new DOMXPath( $this->dom );
/**
* Script element.
*
* @var DOMElement $script
*/
foreach ( $xpath->query( '//script[ contains( @type, "json" ) ]' ) as $script ) {
$data = json_decode( $script->textContent, true );
if ( json_last_error() ) {
continue;
}
while ( $script->firstChild ) {
$script->removeChild( $script->firstChild );
}
$script->appendChild( $this->dom->createTextNode( wp_json_encode( $data ) ) );
}
}
}
@westonruter

This comment has been minimized.

Copy link
Owner Author

westonruter commented Feb 21, 2020

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

At this point, check for any instances of <script type="application/json"> on your AMP pages and ensure that newline characters are removed.

For example, if previously you had:

<amp-state id="td_amp_menu_state"><script type="application/json">
        {
            "visible": false
        }
    </script></amp-state>

It should now appear as:

<amp-state id="td_amp_menu_state"><script type="application/json">{"visible": false}</script></amp-state>

Note that this plugin will primarily workaround issues with JSON appearing in templates served by the AMP plugin in Transitional or Standard mode. It will have more limited benefit in Reader mode since as of v1.4.x only the content of the page is run through the sanitizer (which will change in v1.5).

@westonruter

This comment has been minimized.

Copy link
Owner Author

westonruter commented Feb 22, 2020

This is now obsolete as the fix has been deployed. Feel free to uninstall this plugin.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.