Skip to content

Commit

Permalink
Gist Shortcode: Remove jQuery Dependency (#16700)
Browse files Browse the repository at this point in the history
  • Loading branch information
Aurorum authored Aug 24, 2020
1 parent e5a81d6 commit 2d0bbe1
Show file tree
Hide file tree
Showing 3 changed files with 43 additions and 66 deletions.
39 changes: 24 additions & 15 deletions modules/shortcodes/gist.php
Original file line number Diff line number Diff line change
Expand Up @@ -201,22 +201,31 @@ class_exists( 'Jetpack_AMP_Support' )
}

// URL points to the entire gist, including the file name if there was one.
$id = ( ! empty( $file ) ? $id . '?file=' . $file : $id );

wp_enqueue_script(
'jetpack-gist-embed',
Assets::get_file_url_for_environment( '_inc/build/shortcodes/js/gist.min.js', 'modules/shortcodes/js/gist.js' ),
array( 'jquery' ),
JETPACK__VERSION,
true
);
$id = ( ! empty( $file ) ? $id . '?file=' . $file : $id );
$return = false;

// inline style to prevent the bottom margin to the embed that themes like TwentyTen, et al., add to tables.
$return = sprintf(
'<style>.gist table { margin-bottom: 0; }</style><div class="gist-oembed" data-gist="%1$s" data-ts="%2$d"></div>',
esc_attr( $id ),
absint( $tab_size )
);
$request = wp_remote_get( esc_url_raw( 'https://gist.github.com/' . esc_attr( $id ) ) );
$request_code = wp_remote_retrieve_response_code( $request );

if ( 200 === $request_code ) {
$request_body = wp_remote_retrieve_body( $request );
$request_data = json_decode( $request_body );

wp_enqueue_style( 'jetpack-gist-styling', esc_url( $request_data->stylesheet ), array(), JETPACK__VERSION );

$gist = substr_replace( $request_data->div, sprintf( 'style="tab-size: %1$s" ', absint( $tab_size ) ), 5, 0 );

// Add inline styles for the tab style in the opening div of the gist.
$gist = preg_replace(
'#(\<div\s)+(id=\"gist[0-9]+\")+(\sclass=\"gist\"\>)?#',
sprintf( '$1style="tab-size: %1$s" $2$3', absint( $tab_size ) ),
$request_data->div,
1
);

// Add inline style to prevent the bottom margin to the embed that themes like TwentyTen, et al., add to tables.
$return = sprintf( '<style>.gist table { margin-bottom: 0; }</style>%1$s', $gist );
}

if (
// No need to check for a nonce here, that's already handled by Core further up.
Expand Down
32 changes: 0 additions & 32 deletions modules/shortcodes/js/gist.js

This file was deleted.

38 changes: 19 additions & 19 deletions tests/php/modules/shortcodes/test-class.gist.php
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ public function test_shortcodes_gist_public_id_in_content() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -113,7 +113,7 @@ public function test_shortcodes_gist_public_id() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -137,7 +137,7 @@ public function test_shortcodes_gist_private_id_in_content() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -161,7 +161,7 @@ public function test_shortcodes_gist_private_id() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -185,7 +185,7 @@ public function test_shortcodes_gist_public_id_with_username() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . basename( $gist_id ) . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -209,7 +209,7 @@ public function test_shortcodes_gist_private_id_with_username() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . basename( $gist_id ) . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -241,7 +241,7 @@ public function test_shortcodes_gist_no_username_direct_file() {
);
// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $expected_gist_id . '" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -278,7 +278,7 @@ public function test_shortcodes_gist_username_direct_file() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $expected_gist_id . '" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -347,7 +347,7 @@ public function test_shortcodes_gist_public_full_url() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -371,7 +371,7 @@ public function test_shortcodes_gist_public_full_url_in_content() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -395,7 +395,7 @@ public function test_shortcodes_gist_private_full_url() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . basename( $gist_id ) . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -419,7 +419,7 @@ public function test_shortcodes_gist_private_full_url_in_content() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . basename( $gist_id ) . '.json" data-ts="8"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 8" id="gist', $shortcode_content );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -451,7 +451,7 @@ public function test_shortcodes_gist_oembed_to_embed() {
ob_start();
the_content();
$actual = ob_get_clean();
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="8"></div>', $actual );
$this->assertContains( '<div style="tab-size: 8" id="gist', $actual );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -486,7 +486,7 @@ public function test_shortcodes_gist_file_to_embed() {
ob_start();
the_content();
$actual = ob_get_clean();
$this->assertContains( '<div class="gist-oembed" data-gist="' . basename( $gist_id ) . '.json?file=wp-config.php" data-ts="8"></div>', $actual );
$this->assertContains( '<div style="tab-size: 8" id="gist', $actual );

// Test AMP version.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -512,7 +512,7 @@ public function test_shortcodes_gist_with_tab_size() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="4"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 4" id="gist', $shortcode_content );

// Test AMP version *lacks* tab size.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -536,7 +536,7 @@ public function test_shortcodes_gist_full_url_with_tab_size_in_content() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="4"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 4" id="gist', $shortcode_content );

// Test AMP version *lacks* tab size.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -560,7 +560,7 @@ public function test_shortcodes_gist_with_tab_size_in_attributes() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="4"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 4" id="gist', $shortcode_content );

// Test AMP version *lacks* tab size.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand All @@ -584,7 +584,7 @@ public function test_shortcodes_gist_with_tab_size_in_attributes_override() {

// Test HTML version.
$shortcode_content = do_shortcode( $content );
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="4"></div>', $shortcode_content );
$this->assertContains( '<div style="tab-size: 4" id="gist', $shortcode_content );

// Test AMP version *lacks* tab size.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down Expand Up @@ -616,7 +616,7 @@ public function test_shortcodes_gist_oembed_with_tab_size() {
ob_start();
the_content();
$actual = ob_get_clean();
$this->assertContains( '<div class="gist-oembed" data-gist="' . $gist_id . '.json" data-ts="4"></div>', $actual );
$this->assertContains( '<div style="tab-size: 4" id="gist', $actual );

// Test AMP version *lacks* tab size.
add_filter( 'jetpack_is_amp_request', '__return_true' );
Expand Down

0 comments on commit 2d0bbe1

Please sign in to comment.