Skip to content

WP.com block editor: Exclude WP.com features from Jetpack sites #14230

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mmtr merged 5 commits into from
Dec 20, 2019
Merged

WP.com block editor: Exclude WP.com features from Jetpack sites #14230

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
a7d3dfe
WP.com block editor: Exclude WP.com features from Jetpack sites
mmtr Dec 13, 2019
14ae00b
Remove non-needed variable
mmtr Dec 13, 2019
d9a218e
Right check for Atomic sites
mmtr Dec 13, 2019
8dd8ada
Use new build files
mmtr Dec 17, 2019
b035deb
Add Justify styles inline rather than by enqueuing (props @kwight)
mmtr Dec 17, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 51 additions & 53 deletions modules/wpcom-block-editor/class-jetpack-wpcom-block-editor.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@ private function __construct() {
}

add_action( 'login_init', array( $this, 'allow_block_editor_login' ), 1 );
add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_scripts' ), 9 );
add_action( 'enqueue_block_assets', array( $this, 'enqueue_styles' ) );
add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_block_editor_assets' ), 9 );
add_action( 'enqueue_block_assets', array( $this, 'enqueue_block_assets' ) );
add_filter( 'mce_external_plugins', array( $this, 'add_tinymce_plugins' ) );
}

Expand Down Expand Up @@ -253,37 +253,32 @@ public function filter_salt( $salt, $scheme ) {
}

/**
* Enqueue the scripts for the WordPress.com block editor integration.
* Enqueues the WordPress.com block editor integration assets for the editor.
*/
public function enqueue_scripts() {
public function enqueue_block_editor_assets() {
$debug = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;
$version = gmdate( 'Ymd' );

$src_common = $debug
? '//widgets.wp.com/wpcom-block-editor/common.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/common.min.js';

wp_enqueue_script(
'wpcom-block-editor-common',
$src_common,
'wpcom-block-editor-default-editor-script',
$debug
? '//widgets.wp.com/wpcom-block-editor/default.editor.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/default.editor.min.js',
array(
'jquery',
'lodash',
'wp-blocks',
'wp-compose',
'wp-data',
'wp-dom-ready',
'wp-editor',
'wp-nux',
'wp-plugins',
'wp-polyfill',
'wp-element',
'wp-rich-text',
),
$version,
true
);

wp_localize_script(
'wpcom-block-editor-common',
'wpcom-block-editor-default-editor-script',
'wpcomGutenberg',
array(
'switchToClassic' => array(
Expand All @@ -298,14 +293,30 @@ public function enqueue_scripts() {
)
);

if ( $this->is_iframed_block_editor() ) {
$src_calypso_iframe_bridge = $debug
? '//widgets.wp.com/wpcom-block-editor/calypso-iframe-bridge-server.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/calypso-iframe-bridge-server.min.js';
if ( jetpack_is_atomic_site() ) {
wp_enqueue_script(
'wpcom-block-editor-wpcom-editor-script',
$debug
? '//widgets.wp.com/wpcom-block-editor/wpcom.editor.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/wpcom.editor.min.js',
array(
'lodash',
'wp-blocks',
'wp-data',
'wp-dom-ready',
'wp-plugins',
),
$version,
true
);
}

if ( $this->is_iframed_block_editor() ) {
wp_enqueue_script(
'wpcom-block-editor-calypso-iframe-bridge',
$src_calypso_iframe_bridge,
'wpcom-block-editor-calypso-editor-script',
$debug
? '//widgets.wp.com/wpcom-block-editor/calypso.editor.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/calypso.editor.min.js',
array(
'calypsoify_wpadminmods_js',
'jquery',
Expand All @@ -314,43 +325,31 @@ public function enqueue_scripts() {
'wp-blocks',
'wp-data',
'wp-hooks',
'wp-polyfill',
'wp-tinymce',
'wp-url',
),
$version,
true
);

wp_enqueue_style(
'wpcom-block-editor-calypso-editor-styles',
$debug
? '//widgets.wp.com/wpcom-block-editor/calypso.editor.css?minify=false'
: '//widgets.wp.com/wpcom-block-editor/calypso.editor.min.css',
array(),
$version
);
}
}

/**
* Enqueue WP.com block editor common styles.
* Enqueues the WordPress.com block editor integration assets for both editor and front-end.
*/
public function enqueue_styles() {
// Enqueue only for the block editor in WP Admin.
global $pagenow;
if ( is_admin() && ! in_array( $pagenow, array( 'post.php', 'post-new.php' ), true ) ) {
return;
}

// Enqueue on the front-end only if justified blocks are present.
if ( ! is_admin() && ! $this->has_justified_block() ) {
return;
}

$debug = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;
$version = gmdate( 'Ymd' );

$src_styles = $debug
? '//widgets.wp.com/wpcom-block-editor/common.css?minify=false'
: '//widgets.wp.com/wpcom-block-editor/common.min.css';
wp_enqueue_style(
'wpcom-block-editor-styles',
$src_styles,
array(),
$version
);
public function enqueue_block_assets() {
// These styles are manually copied from //widgets.wp.com/wpcom-block-editor/default.view.css in order to
// improve the performance by avoiding an extra network request to download the CSS file on every page.
wp_add_inline_style( 'wp-block-library', '.has-text-align-justify{text-align:justify;}' );
Copy link
Contributor

@gwwar gwwar Dec 17, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a follow up we might be able to script out an autogenerated diff later. One tradeoff here for inlining is that we can't update published styles outside of Jetpack release cycles for any other integration changes. Probably okay here to avoid an extra request on published views

Screen Shot 2019-12-17 at 10 00 57 AM

Copy link
Contributor

@kwight kwight Dec 18, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One tradeoff here for inlining is that we can't update published styles outside of Jetpack release cycles for any other integration changes.

We could, by just adding another inline style that overrides what's in Jetpack, until the new JP release comes out – certainly not a fun solution, though 🙃

}

/**
Expand Down Expand Up @@ -379,15 +378,14 @@ public function has_justified_block() {
*/
public function add_tinymce_plugins( $plugin_array ) {
if ( $this->is_iframed_block_editor() ) {
$debug = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;
$src_calypso_tinymce = $debug
? '//widgets.wp.com/wpcom-block-editor/calypso-tinymce.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/calypso-tinymce.min.js';
$debug = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;

$plugin_array['gutenberg-wpcom-iframe-media-modal'] = add_query_arg(
'v',
gmdate( 'YW' ),
$src_calypso_tinymce
$debug
? '//widgets.wp.com/wpcom-block-editor/calypso.tinymce.js?minify=false'
: '//widgets.wp.com/wpcom-block-editor/calypso.tinymce.min.js'
);
}

Expand Down