gutenberg / lib / client-assets.php

client-assets.php in Gutenberg 9.5.2, at lib/client-assets.php

652 lines 21.4 KB

Raw Download Zip

1	<?php
2	/**
3	* Functions to register client-side assets (scripts and stylesheets) for the
4	* Gutenberg editor plugin.
5	*
6	* @package gutenberg
7	*/
8
9	if ( ! defined( 'ABSPATH' ) ) {
10	die( 'Silence is golden.' );
11	}
12
13	/**
14	* Retrieves the root plugin path.
15	*
16	* @return string Root path to the gutenberg plugin.
17	*
18	* @since 0.1.0
19	*/
20	function gutenberg_dir_path() {
21	return plugin_dir_path( __DIR__ );
22	}
23
24	/**
25	* Retrieves a URL to a file in the gutenberg plugin.
26	*
27	* @param string $path Relative path of the desired file.
28	*
29	* @return string Fully qualified URL pointing to the desired file.
30	*
31	* @since 0.1.0
32	*/
33	function gutenberg_url( $path ) {
34	return plugins_url( $path, __DIR__ );
35	}
36
37	/**
38	* Registers a script according to `wp_register_script`. Honors this request by
39	* reassigning internal dependency properties of any script handle already
40	* registered by that name. It does not deregister the original script, to
41	* avoid losing inline scripts which may have been attached.
42	*
43	* @since 4.1.0
44	*
45	* @param WP_Scripts $scripts WP_Scripts instance.
46	* @param string $handle Name of the script. Should be unique.
47	* @param string $src Full URL of the script, or path of the script relative to the WordPress root directory.
48	* @param array $deps Optional. An array of registered script handles this script depends on. Default empty array.
49	* @param string\|bool\|null $ver Optional. String specifying script version number, if it has one, which is added to the URL
50	* as a query string for cache busting purposes. If version is set to false, a version
51	* number is automatically added equal to current installed WordPress version.
52	* If set to null, no version is added.
53	* @param bool $in_footer Optional. Whether to enqueue the script before </body> instead of in the <head>.
54	* Default 'false'.
55	*/
56	function gutenberg_override_script( $scripts, $handle, $src, $deps = array(), $ver = false, $in_footer = false ) {
57	$script = $scripts->query( $handle, 'registered' );
58	if ( $script ) {
59	/*
60	* In many ways, this is a reimplementation of `wp_register_script` but
61	* bypassing consideration of whether a script by the given handle had
62	* already been registered.
63	*/
64
65	// See: `_WP_Dependency::__construct` .
66	$script->src = $src;
67	$script->deps = $deps;
68	$script->ver = $ver;
69	$script->args = $in_footer;
70
71	/*
72	* The script's `group` designation is an indication of whether it is
73	* to be printed in the header or footer. The behavior here defers to
74	* the arguments as passed. Specifically, group data is not assigned
75	* for a script unless it is designated to be printed in the footer.
76	*/
77
78	// See: `wp_register_script` .
79	unset( $script->extra['group'] );
80	if ( $in_footer ) {
81	$script->add_data( 'group', 1 );
82	}
83	} else {
84	$scripts->add( $handle, $src, $deps, $ver, $in_footer );
85	}
86
87	/*
88	* `WP_Dependencies::set_translations` will fall over on itself if setting
89	* translations on the `wp-i18n` handle, since it internally adds `wp-i18n`
90	* as a dependency of itself, exhausting memory. The same applies for the
91	* polyfill script, which is a dependency _of_ `wp-i18n`.
92	*
93	* See: https://core.trac.wordpress.org/ticket/46089
94	*/
95	if ( 'wp-i18n' !== $handle && 'wp-polyfill' !== $handle ) {
96	$scripts->set_translations( $handle, 'default' );
97	}
98	}
99
100	/**
101	* Filters the default translation file load behavior to load the Gutenberg
102	* plugin translation file, if available.
103	*
104	* @param string\|false $file Path to the translation file to load. False if
105	* there isn't one.
106	* @param string $handle Name of the script to register a translation
107	* domain to.
108	*
109	* @return string\|false Filtered path to the Gutenberg translation file, if
110	* available.
111	*/
112	function gutenberg_override_translation_file( $file, $handle ) {
113	if ( ! $file ) {
114	return $file;
115	}
116
117	// Ignore scripts whose handle does not have the "wp-" prefix.
118	if ( 'wp-' !== substr( $handle, 0, 3 ) ) {
119	return $file;
120	}
121
122	// Ignore scripts that are not found in the expected `build/` location.
123	$script_path = gutenberg_dir_path() . 'build/' . substr( $handle, 3 ) . '/index.js';
124	if ( ! file_exists( $script_path ) ) {
125	return $file;
126	}
127
128	/*
129	* The default file will be in the plugins language directory, omitting the
130	* domain since Gutenberg assigns the script translations as the default.
131	*
132	* Example: /www/wp-content/languages/plugins/de_DE-07d88e6a803e01276b9bfcc1203e862e.json
133	*
134	* The logic of `load_script_textdomain` is such that it will assume to
135	* search in the plugins language directory, since the assigned source of
136	* the overridden Gutenberg script originates in the plugins directory.
137	*
138	* The plugin translation files each begin with the slug of the plugin, so
139	* it's a simple matter of prepending the Gutenberg plugin slug.
140	*/
141	$path_parts = pathinfo( $file );
142	$plugin_translation_file = (
143	$path_parts['dirname'] .
144	'/gutenberg-' .
145	$path_parts['basename']
146	);
147
148	return $plugin_translation_file;
149	}
150	add_filter( 'load_script_translation_file', 'gutenberg_override_translation_file', 10, 2 );
151
152	/**
153	* Filters the default labels for common post types to change the case style
154	* from capitalized (e.g. "Featured Image") to sentence-style (e.g. "Featured
155	* image").
156	*
157	* See: https://github.com/WordPress/gutenberg/pull/18758
158	*
159	* @param object $labels Object with all the labels as member variables.
160	*
161	* @return object Object with all the labels, including overridden ones.
162	*/
163	function gutenberg_override_posttype_labels( $labels ) {
164	$labels->featured_image = __( 'Featured image', 'gutenberg' );
165	return $labels;
166	}
167	foreach ( array( 'post', 'page' ) as $post_type ) {
168	add_filter( "post_type_labels_{$post_type}", 'gutenberg_override_posttype_labels' );
169	}
170
171	/**
172	* Registers a style according to `wp_register_style`. Honors this request by
173	* deregistering any style by the same handler before registration.
174	*
175	* @since 4.1.0
176	*
177	* @param WP_Styles $styles WP_Styles instance.
178	* @param string $handle Name of the stylesheet. Should be unique.
179	* @param string $src Full URL of the stylesheet, or path of the stylesheet relative to the WordPress root directory.
180	* @param array $deps Optional. An array of registered stylesheet handles this stylesheet depends on. Default empty array.
181	* @param string\|bool\|null $ver Optional. String specifying stylesheet version number, if it has one, which is added to the URL
182	* as a query string for cache busting purposes. If version is set to false, a version
183	* number is automatically added equal to current installed WordPress version.
184	* If set to null, no version is added.
185	* @param string $media Optional. The media for which this stylesheet has been defined.
186	* Default 'all'. Accepts media types like 'all', 'print' and 'screen', or media queries like
187	* '(orientation: portrait)' and '(max-width: 640px)'.
188	*/
189	function gutenberg_override_style( $styles, $handle, $src, $deps = array(), $ver = false, $media = 'all' ) {
190	$style = $styles->query( $handle, 'registered' );
191	if ( $style ) {
192	$styles->remove( $handle );
193	}
194	$styles->add( $handle, $src, $deps, $ver, $media );
195	}
196
197	/**
198	* Registers vendor JavaScript files to be used as dependencies of the editor
199	* and plugins.
200	*
201	* This function is called from a script during the plugin build process, so it
202	* should not call any WordPress PHP functions.
203	*
204	* @since 0.1.0
205	*
206	* @param WP_Scripts $scripts WP_Scripts instance.
207	*/
208	function gutenberg_register_vendor_scripts( $scripts ) {
209	$suffix = SCRIPT_DEBUG ? '' : '.min';
210
211	$react_suffix = ( SCRIPT_DEBUG ? '.development' : '.production' ) . $suffix;
212	gutenberg_register_vendor_script(
213	$scripts,
214	'react',
215	'https://unpkg.com/react@16.13.1/umd/react' . $react_suffix . '.js',
216	array( 'wp-polyfill' )
217	);
218	gutenberg_register_vendor_script(
219	$scripts,
220	'react-dom',
221	'https://unpkg.com/react-dom@16.13.1/umd/react-dom' . $react_suffix . '.js',
222	array( 'react' )
223	);
224
225	/*
226	* This script registration and the corresponding function should be removed
227	* removed once the plugin is updated to support WordPress 5.6.0 and newer.
228	*/
229	gutenberg_register_vendor_script(
230	$scripts,
231	'lodash',
232	'https://unpkg.com/lodash@4.17.19/lodash.js',
233	array(),
234	'4.17.19',
235	true
236	);
237	}
238	add_action( 'wp_default_scripts', 'gutenberg_register_vendor_scripts' );
239
240	/**
241	* Registers all the WordPress packages scripts that are in the standardized
242	* `build/` location.
243	*
244	* @since 4.5.0
245	*
246	* @param WP_Scripts $scripts WP_Scripts instance.
247	*/
248	function gutenberg_register_packages_scripts( $scripts ) {
249	foreach ( glob( gutenberg_dir_path() . 'build/*/index.js' ) as $path ) {
250	// Prefix `wp-` to package directory to get script handle.
251	// For example, `…/build/a11y/index.js` becomes `wp-a11y`.
252	$handle = 'wp-' . basename( dirname( $path ) );
253
254	// Replace `.js` extension with `.asset.php` to find the generated dependencies file.
255	$asset_file = substr( $path, 0, -3 ) . '.asset.php';
256	$asset = file_exists( $asset_file )
257	? require( $asset_file )
258	: null;
259	$dependencies = isset( $asset['dependencies'] ) ? $asset['dependencies'] : array();
260	$version = isset( $asset['version'] ) ? $asset['version'] : filemtime( $path );
261
262	// Add dependencies that cannot be detected and generated by build tools.
263	switch ( $handle ) {
264	case 'wp-block-library':
265	array_push( $dependencies, 'editor' );
266	break;
267
268	case 'wp-edit-post':
269	array_push( $dependencies, 'media-models', 'media-views', 'postbox' );
270	break;
271
272	case 'wp-edit-site':
273	array_push( $dependencies, 'wp-dom-ready' );
274	break;
275	}
276
277	// Get the path from Gutenberg directory as expected by `gutenberg_url`.
278	$gutenberg_path = substr( $path, strlen( gutenberg_dir_path() ) );
279
280	gutenberg_override_script(
281	$scripts,
282	$handle,
283	gutenberg_url( $gutenberg_path ),
284	$dependencies,
285	$version,
286	true
287	);
288	}
289	}
290	add_action( 'wp_default_scripts', 'gutenberg_register_packages_scripts' );
291
292	/**
293	* Registers all the WordPress packages styles that are in the standardized
294	* `build/` location.
295	*
296	* @since 6.7.0
297
298	* @param WP_Styles $styles WP_Styles instance.
299	*/
300	function gutenberg_register_packages_styles( $styles ) {
301	// Editor Styles.
302	gutenberg_override_style(
303	$styles,
304	'wp-block-editor',
305	gutenberg_url( 'build/block-editor/style.css' ),
306	array( 'wp-components', 'wp-editor-font' ),
307	filemtime( gutenberg_dir_path() . 'build/editor/style.css' )
308	);
309	$styles->add_data( 'wp-block-editor', 'rtl', 'replace' );
310
311	gutenberg_override_style(
312	$styles,
313	'wp-editor',
314	gutenberg_url( 'build/editor/style.css' ),
315	array( 'wp-components', 'wp-block-editor', 'wp-nux' ),
316	filemtime( gutenberg_dir_path() . 'build/editor/style.css' )
317	);
318	$styles->add_data( 'wp-editor', 'rtl', 'replace' );
319
320	gutenberg_override_style(
321	$styles,
322	'wp-edit-post',
323	gutenberg_url( 'build/edit-post/style.css' ),
324	array( 'wp-components', 'wp-block-editor', 'wp-editor', 'wp-edit-blocks', 'wp-block-library', 'wp-nux' ),
325	filemtime( gutenberg_dir_path() . 'build/edit-post/style.css' )
326	);
327	$styles->add_data( 'wp-edit-post', 'rtl', 'replace' );
328
329	gutenberg_override_style(
330	$styles,
331	'wp-components',
332	gutenberg_url( 'build/components/style.css' ),
333	array( 'dashicons' ),
334	filemtime( gutenberg_dir_path() . 'build/components/style.css' )
335	);
336	$styles->add_data( 'wp-components', 'rtl', 'replace' );
337
338	gutenberg_override_style(
339	$styles,
340	'wp-block-library',
341	gutenberg_url( 'build/block-library/style.css' ),
342	array(),
343	filemtime( gutenberg_dir_path() . 'build/block-library/style.css' )
344	);
345	$styles->add_data( 'wp-block-library', 'rtl', 'replace' );
346
347	gutenberg_override_style(
348	$styles,
349	'wp-format-library',
350	gutenberg_url( 'build/format-library/style.css' ),
351	array( 'wp-block-editor', 'wp-components' ),
352	filemtime( gutenberg_dir_path() . 'build/format-library/style.css' )
353	);
354	$styles->add_data( 'wp-format-library', 'rtl', 'replace' );
355
356	gutenberg_override_style(
357	$styles,
358	'wp-edit-blocks',
359	gutenberg_url( 'build/block-library/editor.css' ),
360	array(
361	'wp-components',
362	'wp-editor',
363	'wp-block-library',
364	// Always include visual styles so the editor never appears broken.
365	'wp-block-library-theme',
366	),
367	filemtime( gutenberg_dir_path() . 'build/block-library/editor.css' )
368	);
369	$styles->add_data( 'wp-edit-blocks', 'rtl', 'replace' );
370
371	gutenberg_override_style(
372	$styles,
373	'wp-nux',
374	gutenberg_url( 'build/nux/style.css' ),
375	array( 'wp-components' ),
376	filemtime( gutenberg_dir_path() . 'build/nux/style.css' )
377	);
378	$styles->add_data( 'wp-nux', 'rtl', 'replace' );
379
380	gutenberg_override_style(
381	$styles,
382	'wp-block-library-theme',
383	gutenberg_url( 'build/block-library/theme.css' ),
384	array(),
385	filemtime( gutenberg_dir_path() . 'build/block-library/theme.css' )
386	);
387	$styles->add_data( 'wp-block-library-theme', 'rtl', 'replace' );
388
389	gutenberg_override_style(
390	$styles,
391	'wp-list-reusable-blocks',
392	gutenberg_url( 'build/list-reusable-blocks/style.css' ),
393	array( 'wp-components' ),
394	filemtime( gutenberg_dir_path() . 'build/list-reusable-blocks/style.css' )
395	);
396	$styles->add_data( 'wp-list-reusable-block', 'rtl', 'replace' );
397
398	gutenberg_override_style(
399	$styles,
400	'wp-edit-navigation',
401	gutenberg_url( 'build/edit-navigation/style.css' ),
402	array( 'wp-components', 'wp-block-editor', 'wp-edit-blocks' ),
403	filemtime( gutenberg_dir_path() . 'build/edit-navigation/style.css' )
404	);
405	$styles->add_data( 'wp-edit-navigation', 'rtl', 'replace' );
406
407	gutenberg_override_style(
408	$styles,
409	'wp-edit-site',
410	gutenberg_url( 'build/edit-site/style.css' ),
411	array( 'wp-components', 'wp-block-editor', 'wp-edit-blocks' ),
412	filemtime( gutenberg_dir_path() . 'build/edit-site/style.css' )
413	);
414	$styles->add_data( 'wp-edit-site', 'rtl', 'replace' );
415
416	gutenberg_override_style(
417	$styles,
418	'wp-edit-widgets',
419	gutenberg_url( 'build/edit-widgets/style.css' ),
420	array( 'wp-components', 'wp-block-editor', 'wp-edit-blocks' ),
421	filemtime( gutenberg_dir_path() . 'build/edit-widgets/style.css' )
422	);
423	$styles->add_data( 'wp-edit-widgets', 'rtl', 'replace' );
424
425	gutenberg_override_style(
426	$styles,
427	'wp-block-directory',
428	gutenberg_url( 'build/block-directory/style.css' ),
429	array( 'wp-block-editor', 'wp-components' ),
430	filemtime( gutenberg_dir_path() . 'build/block-directory/style.css' )
431	);
432	$styles->add_data( 'wp-block-directory', 'rtl', 'replace' );
433	}
434	add_action( 'wp_default_styles', 'gutenberg_register_packages_styles' );
435
436	/**
437	* Registers common scripts and styles to be used as dependencies of the editor
438	* and plugins.
439	*
440	* @since 0.1.0
441	*/
442	function gutenberg_enqueue_block_editor_assets() {
443	if ( defined( 'GUTENBERG_LIVE_RELOAD' ) && GUTENBERG_LIVE_RELOAD ) {
444	$live_reload_url = ( GUTENBERG_LIVE_RELOAD === true ) ? 'http://localhost:35729/livereload.js' : GUTENBERG_LIVE_RELOAD;
445
446	wp_enqueue_script(
447	'gutenberg-live-reload',
448	$live_reload_url
449	);
450	}
451	}
452	add_action( 'enqueue_block_editor_assets', 'gutenberg_enqueue_block_editor_assets' );
453
454	/**
455	* Retrieves a unique and reasonably short and human-friendly filename for a
456	* vendor script based on a URL and the script handle.
457	*
458	* @param string $handle The name of the script.
459	* @param string $src Full URL of the external script.
460	*
461	* @return string Script filename suitable for local caching.
462	*
463	* @since 0.1.0
464	*/
465	function gutenberg_vendor_script_filename( $handle, $src ) {
466	$filename = basename( $src );
467	$match = preg_match(
468	'/^'
469	. '(?P<ignore>.*?)'
470	. '(?P<suffix>\.min)?'
471	. '(?P<extension>\.js)'
472	. '(?P<extra>.*)'
473	. '$/',
474	$filename,
475	$filename_pieces
476	);
477
478	$prefix = $handle;
479	$suffix = $match ? $filename_pieces['suffix'] : '';
480	$hash = substr( md5( $src ), 0, 8 );
481
482	return "${prefix}${suffix}.${hash}.js";
483	}
484
485	/**
486	* Registers a vendor script from a URL, preferring a locally cached version if
487	* possible, or downloading it if the cached version is unavailable or
488	* outdated.
489	*
490	* @param WP_Scripts $scripts WP_Scripts instance.
491	* @param string $handle Name of the script.
492	* @param string $src Full URL of the external script.
493	* @param array $deps Optional. An array of registered script handles this
494	* script depends on.
495	* @param string\|bool\|null $ver Optional. String specifying script version number, if it has one, which is added to the URL
496	* as a query string for cache busting purposes. If version is set to false, a version
497	* number is automatically added equal to current installed WordPress version.
498	* If set to null, no version is added.
499	* @param bool $in_footer Optional. Whether to enqueue the script before </body> instead of in the <head>.
500	* Default 'false'.
501	*
502	* @since 0.1.0
503	*/
504	function gutenberg_register_vendor_script( $scripts, $handle, $src, $deps = array(), $ver = null, $in_footer = false ) {
505	if ( defined( 'GUTENBERG_LOAD_VENDOR_SCRIPTS' ) && ! GUTENBERG_LOAD_VENDOR_SCRIPTS ) {
506	return;
507	}
508
509	$filename = gutenberg_vendor_script_filename( $handle, $src );
510
511	if ( defined( 'GUTENBERG_LIST_VENDOR_ASSETS' ) && GUTENBERG_LIST_VENDOR_ASSETS ) {
512	echo "$src\|$filename\n";
513	return;
514	}
515
516	$full_path = gutenberg_dir_path() . 'vendor/' . $filename;
517
518	$needs_fetch = (
519	defined( 'GUTENBERG_DEVELOPMENT_MODE' ) && GUTENBERG_DEVELOPMENT_MODE && (
520	! file_exists( $full_path ) \|\|
521	time() - filemtime( $full_path ) >= DAY_IN_SECONDS
522	)
523	);
524
525	if ( $needs_fetch ) {
526	// Determine whether we can write to this file. If not, don't waste
527	// time doing a network request.
528	// @codingStandardsIgnoreStart
529
530	$is_writable = is_writable( $full_path );
531	if ( $is_writable ) {
532	$f = @fopen( $full_path, 'a' );
533	if ( ! $f ) {
534	$is_writable = false;
535	} else {
536	fclose( $f );
537	}
538	}
539
540	// @codingStandardsIgnoreEnd
541	if ( ! $is_writable ) {
542	// Failed to open the file for writing, probably due to server
543	// permissions. Enqueue the script directly from the URL instead.
544	gutenberg_override_script( $scripts, $handle, $src, $deps, $ver, $in_footer );
545	return;
546	}
547
548	$response = wp_remote_get( $src );
549	if ( wp_remote_retrieve_response_code( $response ) === 200 ) {
550	$f = fopen( $full_path, 'w' );
551	fwrite( $f, wp_remote_retrieve_body( $response ) );
552	fclose( $f );
553	} elseif ( ! filesize( $full_path ) ) {
554	// The request failed. If the file is already cached, continue to
555	// use this file. If not, then unlink the 0 byte file, and enqueue
556	// the script directly from the URL.
557	gutenberg_override_script( $scripts, $handle, $src, $deps, $ver, $in_footer );
558	unlink( $full_path );
559	return;
560	}
561	}
562	gutenberg_override_script(
563	$scripts,
564	$handle,
565	gutenberg_url( 'vendor/' . $filename ),
566	$deps,
567	$ver,
568	$in_footer
569	);
570	}
571
572	/**
573	* Extends block editor settings to include Gutenberg's `editor-styles.css` as
574	* taking precedent those styles shipped with core.
575	*
576	* @param array $settings Default editor settings.
577	*
578	* @return array Filtered editor settings.
579	*/
580	function gutenberg_extend_block_editor_styles( $settings ) {
581	$editor_styles_file = gutenberg_dir_path() . 'build/editor/editor-styles.css';
582
583	/*
584	* If, for whatever reason, the built editor styles do not exist, avoid
585	* override and fall back to the default.
586	*/
587	if ( ! file_exists( $editor_styles_file ) ) {
588	return $settings;
589	}
590
591	if ( empty( $settings['styles'] ) ) {
592	$settings['styles'] = array();
593	} else {
594	/*
595	* The styles setting is an array of CSS strings, so there is no direct
596	* way to find the default styles. To maximize stability, load (again)
597	* the default styles from disk and find its place in the array.
598	*
599	* See: https://github.com/WordPress/wordpress-develop/blob/5.0.3/src/wp-admin/edit-form-blocks.php#L168-L175
600	*/
601
602	$default_styles = file_get_contents(
603	ABSPATH . WPINC . '/css/dist/editor/editor-styles.css'
604	);
605
606	/*
607	* Iterate backwards from the end of the array since the preferred
608	* insertion point in case not found is prepended as first entry.
609	*/
610	for ( $i = count( $settings['styles'] ) - 1; $i >= 0; $i-- ) {
611	if ( isset( $settings['styles'][ $i ]['css'] ) &&
612	$default_styles === $settings['styles'][ $i ]['css'] ) {
613	break;
614	}
615	}
616	}
617
618	$editor_styles = array(
619	'css' => file_get_contents( $editor_styles_file ),
620	);
621
622	// Substitute default styles if found. Otherwise, prepend to setting array.
623	if ( isset( $i ) && $i >= 0 ) {
624	$settings['styles'][ $i ] = $editor_styles;
625	} else {
626	array_unshift( $settings['styles'], $editor_styles );
627	}
628
629	return $settings;
630	}
631	add_filter( 'block_editor_settings', 'gutenberg_extend_block_editor_styles' );
632
633	/**
634	* Load the default editor styles.
635	* These styles are used if the "no theme styles" options is triggered.
636	*
637	* @param array $settings Default editor settings.
638	*
639	* @return array Filtered editor settings.
640	*/
641	function gutenberg_extend_block_editor_settings_with_default_editor_styles( $settings ) {
642	$editor_styles_file = gutenberg_dir_path() . 'build/editor/editor-styles.css';
643	$settings['defaultEditorStyles'] = array(
644	array(
645	'css' => file_get_contents( $editor_styles_file ),
646	),
647	);
648
649	return $settings;
650	}
651	add_filter( 'block_editor_settings', 'gutenberg_extend_block_editor_settings_with_default_editor_styles' );
652