Skip to content

AMP_Content_Sanitizer::sanitize() strips out amp-bind Bindings #836

@d4mation

Description

@d4mation

I've made some template files which run through a loop to pull in data from Child Posts which then runs AMP_Content_Sanitizer::sanitize() on the Post Content of each item that is pulled in.

The Post Content of the pulled in Posts (When viewed in AMP) utilizes amp-bind to toggle a Hidden state on elements. However, I noticed that when the DOMDocument Object is created from the passed in $content as part of AMP_DOM_Utils::get_dom_from_content(), it ignores any of the special amp-bind Binding attributes. This is presumably due to PHP not recognizing them as valid and throwing them out.

This only effects cases where amp-bind Binding attributes are being ran through the Sanitization method directly. If it simply exists in the template file (Therefore not sanitized in the same way Post Content is) it does not affect it.

This primarily is an issue in cases where you are wanting a Shortcode to still function similarly when viewed on an AMP version of a page, such as hiding/showing/expanding/etc. different elements based on user interaction.

Reproduction steps:

Place the following code at the top of https://github.com/Automattic/amp-wp/blob/8b416f9bbdba64e07082dcc02a9b64aa34c2d270/includes/templates/class-amp-content-sanitizer.php#L22 to simulate it being a part of the Post Content:

$content .= '<p id="test-stripping-amp-bind" [text]="foo">test</p>';
$content .= "<button on=\"tap:AMP.setState({foo: 'amp-bind'})\">Set to amp-bind</button>";

And then the following to load in amp-bind:

add_filter( 'amp_post_template_data', function( $data ) {
			
    if ( is_singular() || 
        is_front_page() ) {
			
            if ( empty( $data['amp_component_scripts']['amp-bind'] ) ) {
                $data['amp_component_scripts']['amp-bind'] = 'https://cdn.ampproject.org/v0/amp-bind-0.1.js';
            }
				
        }
			
        return $data;
			
}, 21 );

Your <p> tag will appear without the [text] attribute but the <button> will still set the AMP State correctly (Although it will not be able to do much without amp-bind Bindings that use it).

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions