Skip to content

Commit

Permalink
Prevent wpautop() from modifying Twitter embed (#3874)
Browse files Browse the repository at this point in the history 
* Allow Twitter raw embeds to be converted to its AMP component when being sanitized

* Remove unused AMP_Twitter_Embed_Handler::filter_embed_oembed_html() method
  • Loading branch information
@pierlon @westonruter
pierlon authored and westonruter committed Dec 4, 2019
1 parent c4acf93 commit 4b39169
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 66 deletions.
39 changes: 4 additions & 35 deletions includes/embeds/class-amp-twitter-embed-handler.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,6 @@ class AMP_Twitter_Embed_Handler extends AMP_Base_Embed_Handler {
* Registers embed.
*/
public function register_embed() {
add_filter( 'embed_oembed_html', [ $this, 'filter_embed_oembed_html' ], 10, 2 );
add_shortcode( 'tweet', [ $this, 'shortcode' ] ); // Note: This is a Jetpack shortcode.
wp_embed_register_handler( 'amp-twitter-timeline', self::URL_PATTERN_TIMELINE, [ $this, 'oembed_timeline' ], -1 );
}
Expand All @@ -55,42 +54,10 @@ public function register_embed() {
* Unregisters embed.
*/
public function unregister_embed() {
remove_filter( 'embed_oembed_html', [ $this, 'filter_embed_oembed_html' ] );
remove_shortcode( 'tweet' ); // Note: This is a Jetpack shortcode.
wp_embed_unregister_handler( 'amp-twitter-timeline', -1 );
}

/**
* Filter oEmbed HTML for Twitter to prepare it for AMP.
*
* @param string $cache Cache for oEmbed.
* @param string $url Embed URL.
* @return string Embed.
*/
public function filter_embed_oembed_html( $cache, $url ) {
$parsed_url = wp_parse_url( $url );
if ( false === strpos( $parsed_url['host'], 'twitter.com' ) ) {
return $cache;
}

if ( ! preg_match( '#^https?://twitter.com/.+/status/(\d+)#', $url, $matches ) ) {
return $cache;
}
$tweet_id = $matches[1];

$cache = preg_replace(
'#(<blockquote[^>]+?twitter-tweet[^>]+)(>[^\r]+)<script.*$#',
sprintf(
'<amp-twitter width="%d" height="%d" layout="responsive" data-tweetid="%s">$1 placeholder $2</amp-twitter>',
esc_attr( $this->DEFAULT_WIDTH ),
esc_attr( $this->DEFAULT_HEIGHT ),
esc_attr( $tweet_id )
),
$cache
);
return $cache;
}

/**
* Gets AMP-compliant markup for the Twitter shortcode.
*
Expand Down Expand Up @@ -141,7 +108,9 @@ public function shortcode( $attr ) {
/**
* Render oEmbed.
*
* @deprecated Since 1.1 as now the sanitize_raw_embeds() is used exclusively, allowing the original oEmbed response to be rapped by amp-twitter.
* @deprecated Since 1.1 as now the sanitize_raw_embeds() is used exclusively, allowing the
* original oEmbed response to be wrapped with `amp-twitter`.
*
* @see \WP_Embed::shortcode()
*
* @param array $matches URL pattern matches.
Expand Down Expand Up @@ -330,7 +299,7 @@ private function get_tweet_id( $node ) {
/**
* Removes Twitter's embed <script> tag.
*
* @param DOMElement $node The DOMNode to whose sibling is the instagram script.
* @param DOMElement $node The DOMNode to whose sibling is the Twitter script.
*/
private function sanitize_embed_script( $node ) {
$next_element_sibling = $node->nextSibling;
Expand Down
55 changes: 24 additions & 31 deletions tests/php/test-amp-twitter-embed.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,34 +91,28 @@ public function get_conversion_data() {
],
'url_simple' => [
'https://twitter.com/wordpress/status/987437752164737025' . PHP_EOL,
'<p><amp-twitter width="600" height="480" layout="responsive" data-tweetid="987437752164737025">',
"</amp-twitter></p>\n",
"<amp-twitter width=\"600\" height=\"480\" layout=\"responsive\" data-tweetid=\"987437752164737025\" class=\"twitter-tweet\" data-width=\"500\" data-dnt=\"true\"><blockquote class=\"twitter-tweet\" data-width=\"500\" data-dnt=\"true\" placeholder=\"\">\n<p lang=\"en\" dir=\"ltr\">Celebrate the WordPress 15th Anniversary on May 27 <a href=\"https://t.co/jv62WkI9lr\">https://t.co/jv62WkI9lr</a> <a href=\"https://t.co/4ZECodSK78\">pic.twitter.com/4ZECodSK78</a></p>\n<p>— WordPress (@WordPress) <a href=\"https://twitter.com/WordPress/status/987437752164737025?ref_src=twsrc%5Etfw\">April 20, 2018</a></p></blockquote></amp-twitter>\n\n",
],
'url_with_big_tweet_id' => [
'https://twitter.com/wordpress/status/705219971425574912' . PHP_EOL,
'<p><amp-twitter width="600" height="480" layout="responsive" data-tweetid="705219971425574912">',
"</amp-twitter></p>\n",
"<amp-twitter width=\"600\" height=\"480\" layout=\"responsive\" data-tweetid=\"705219971425574912\" class=\"twitter-tweet\" data-width=\"500\" data-dnt=\"true\"><blockquote class=\"twitter-tweet\" data-width=\"500\" data-dnt=\"true\" placeholder=\"\">\n<p lang=\"en\" dir=\"ltr\">On our way to the <a href=\"https://twitter.com/hashtag/GoogleDance?src=hash&amp;ref_src=twsrc%5Etfw\">#GoogleDance</a>! <a href=\"https://twitter.com/hashtag/SMX?src=hash&amp;ref_src=twsrc%5Etfw\">#SMX</a> 💃🏻 <a href=\"https://t.co/N8kZ9M3eN4\">pic.twitter.com/N8kZ9M3eN4</a></p>\n<p>— Search Engine Land (@sengineland) <a href=\"https://twitter.com/sengineland/status/705219971425574912?ref_src=twsrc%5Etfw\">March 3, 2016</a></p></blockquote></amp-twitter>\n\n",
],

'timeline_url_with_profile' => [
'https://twitter.com/wordpress' . PHP_EOL,
'<p><amp-twitter data-timeline-source-type="profile" data-timeline-screen-name="wordpress" layout="responsive" width="600" height="480">',
"</amp-twitter></p>\n",
"<p><amp-twitter data-timeline-source-type=\"profile\" data-timeline-screen-name=\"wordpress\" layout=\"responsive\" width=\"600\" height=\"480\"></amp-twitter></p>\n",
],
'timeline_url_with_likes' => [
'https://twitter.com/wordpress/likes' . PHP_EOL,
'<p><amp-twitter data-timeline-source-type="likes" data-timeline-screen-name="wordpress" layout="responsive" width="600" height="480">',
"</amp-twitter></p>\n",
"<p><amp-twitter data-timeline-source-type=\"likes\" data-timeline-screen-name=\"wordpress\" layout=\"responsive\" width=\"600\" height=\"480\"></amp-twitter></p>\n",
],
'timeline_url_with_list' => [
'https://twitter.com/wordpress/lists/random_list' . PHP_EOL,
'<p><amp-twitter data-timeline-source-type="list" data-timeline-slug="random_list" data-timeline-owner-screen-name="wordpress" layout="responsive" width="600" height="480">',
"</amp-twitter></p>\n",
"<p><amp-twitter data-timeline-source-type=\"list\" data-timeline-slug=\"random_list\" data-timeline-owner-screen-name=\"wordpress\" layout=\"responsive\" width=\"600\" height=\"480\"></amp-twitter></p>\n",
],
'timeline_url_with_list2' => [
'https://twitter.com/robertnyman/lists/web-gdes' . PHP_EOL,
'<p><amp-twitter data-timeline-source-type="list" data-timeline-slug="web-gdes" data-timeline-owner-screen-name="robertnyman" layout="responsive" width="600" height="480">',
"</amp-twitter></p>\n",
"<p><amp-twitter data-timeline-source-type=\"list\" data-timeline-slug=\"web-gdes\" data-timeline-owner-screen-name=\"robertnyman\" layout=\"responsive\" width=\"600\" height=\"480\"></amp-twitter></p>\n",
],

'shortcode_without_id' => [
Expand All @@ -127,28 +121,24 @@ public function get_conversion_data() {
],
'shortcode_simple' => [
'[tweet 987437752164737025]' . PHP_EOL,
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480">',
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480"></amp-twitter>',
"</amp-twitter>\n",
],
'shortcode_with_tweet_attribute' => [
'[tweet tweet=987437752164737025]' . PHP_EOL,
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480">',
"</amp-twitter>\n",
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480"></amp-twitter>',
],
'shortcode_with_big_tweet_id' => [
'[tweet 705219971425574912]' . PHP_EOL,
'<amp-twitter data-tweetid="705219971425574912" layout="responsive" width="600" height="480">',
"</amp-twitter>\n",
'<amp-twitter data-tweetid="705219971425574912" layout="responsive" width="600" height="480"></amp-twitter>',
],
'shortcode_with_url' => [
'[tweet https://twitter.com/wordpress/status/987437752164737025]' . PHP_EOL,
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480">',
"</amp-twitter>\n",
'<amp-twitter data-tweetid="987437752164737025" layout="responsive" width="600" height="480"></amp-twitter>',
],
'shortcode_with_url_with_big_tweet_id' => [
'[tweet https://twitter.com/wordpress/status/705219971425574912]' . PHP_EOL,
'<amp-twitter data-tweetid="705219971425574912" layout="responsive" width="600" height="480">',
"</amp-twitter>\n",
'<amp-twitter data-tweetid="705219971425574912" layout="responsive" width="600" height="480"></amp-twitter>',
],
'shortcode_with_non_numeric_tweet_id' => [
'[tweet abcd]' . PHP_EOL,
Expand All @@ -162,18 +152,19 @@ public function get_conversion_data() {
*
* @dataProvider get_conversion_data
* @param string $source Source.
* @param string $expected_start Expected start.
* @param string $expected_end Expected end.
* @param string $expected Expected content.
*/
public function test__conversion( $source, $expected_start, $expected_end = null ) {
public function test__conversion( $source, $expected ) {
$embed = new AMP_Twitter_Embed_Handler();
$embed->register_embed();

$filtered_content = apply_filters( 'the_content', $source );
$dom = AMP_DOM_Utils::get_dom_from_content( $filtered_content );
$embed->sanitize_raw_embeds( $dom );

$this->assertStringStartsWith( $expected_start, $filtered_content );
if ( $expected_end ) {
$this->assertStringEndsWith( $expected_end, $filtered_content );
}
$content = AMP_DOM_Utils::get_content_from_dom( $dom );

$this->assertEquals( $content, $expected );
}

public function get_scripts_data() {
Expand All @@ -200,10 +191,12 @@ public function get_scripts_data() {
public function test__get_scripts( $source, $expected ) {
$embed = new AMP_Twitter_Embed_Handler();
$embed->register_embed();
$source = apply_filters( 'the_content', $source );
$source = preg_replace( '#(<amp-twitter.+?>).*?(</amp-twitter>)#s', '$1$2', $source );

$whitelist_sanitizer = new AMP_Tag_And_Attribute_Sanitizer( AMP_DOM_Utils::get_dom_from_content( $source ) );
$filtered_content = apply_filters( 'the_content', $source );
$dom = AMP_DOM_Utils::get_dom_from_content( $filtered_content );
$embed->sanitize_raw_embeds( $dom );

$whitelist_sanitizer = new AMP_Tag_And_Attribute_Sanitizer( $dom );
$whitelist_sanitizer->sanitize();

$scripts = array_merge(
Expand Down

0 comments on commit 4b39169

Please sign in to comment.