← All changes | inc/form-editor/assets.php +107 -25 1.4.0 → 1.6.1 View file →

		@@ -34,8 +34,11 @@
34	34	* @since 0.0.1
35	35	*/
36	36	public function __construct() {
37	37	add_action( 'enqueue_block_editor_assets', [ $this, 'enqueue_editor_assets' ] );
	38	+ // The stylesheet is registered separately, on the hook WordPress replays
	39	+ // inside the editor canvas iframe. See enqueue_editor_styles().
	40	+ add_action( 'enqueue_block_assets', [ $this, 'enqueue_editor_styles' ] );
38	41	add_action( 'init', [ $this, 'register_form_settings_meta' ] );
39	42	add_action( 'init', [ $this, 'register_email_notifications_meta' ] );
40	43	}
41	44
		@@ -45,31 +48,22 @@
45	48	* @return void
46	49	* @since 0.0.1
47	50	*/
48	51	public function enqueue_editor_assets() {
49		- $screen = get_current_screen();
50		-
51	52	// Only load on donation form editor.
52		- if ( ! $screen || Donation_Form::POST_TYPE !== $screen->post_type ) {
	53	+ if ( ! $this->is_form_editor_screen() ) {
53	54	return;
54	55	}
55	56
56		- // Get the asset file for dependencies.
57		- $editor_asset_file = SUREDONATION_DIR . 'assets/build/editor/editor.asset.php';
58		- $editor_asset = file_exists( $editor_asset_file )
59		- ? include $editor_asset_file
60		- : [
61		- 'dependencies' => [
62		- 'wp-plugins',
63		- 'wp-editor',
64		- 'wp-components',
65		- 'wp-data',
66		- 'wp-element',
67		- 'wp-i18n',
68		- ],
69		- 'version' => SUREDONATION_VER,
70		- ];
	57	+ // Core's bundled CodeMirror (CSS mode) backs the Custom CSS tab in the form
	58	+ // settings dialog. Returns false when the user turned syntax highlighting
	59	+ // off in their profile; the tab falls back to a plain textarea then.
	60	+ wp_enqueue_code_editor( [ 'type' => 'text/css' ] );
	61	+ wp_enqueue_script( 'wp-theme-plugin-editor' );
	62	+ wp_enqueue_style( 'wp-codemirror' );
71	63
	64	+ $editor_asset = $this->get_editor_asset();
	65	+
72	66	// Editor plugin JS.
73	67	wp_enqueue_script(
74	68	'suredonation-form-editor',
75	69	SUREDONATION_URL . 'assets/build/editor/editor.js',
		@@ -77,15 +71,9 @@
77	71	$editor_asset['version'],
78	72	true
79	73	);
80	74
81		- // Editor styles.
82		- wp_enqueue_style(
83		- 'suredonation-form-editor',
84		- SUREDONATION_URL . 'assets/build/editor/editor.css',
85		- [ 'wp-components' ],
86		- $editor_asset['version']
87		- );
	75	+ // Editor styles are enqueued from enqueue_editor_styles(), not here.
88	76
89	77	// The OttoKit embed script (defines window.SureTriggers) is NOT enqueued
90	78	// here — it is remote executable JS and would load on every form-editor
91	79	// session even when OttoKit is absent. It is lazy-injected from the
		@@ -134,8 +122,102 @@
134	122	);
135	123
136	124	// Set script translations.
137	125	wp_set_script_translations( 'suredonation-form-editor', 'suredonation' );
	126	+ }
	127	+
	128	+ /**
	129	+ * Enqueue the form editor stylesheet.
	130	+ *
	131	+ * Split out from enqueue_editor_assets() because the two need different
	132	+ * hooks. `enqueue_block_editor_assets` only reaches the admin document, but
	133	+ * most of this stylesheet targets `.editor-styles-wrapper` — the block
	134	+ * canvas, which is an iframe. WordPress used to paper over that with a
	135	+ * compatibility pass that clones any outer stylesheet mentioning
	136	+ * `.editor-styles-wrapper` into the canvas, logging "<handle> was added to
	137	+ * the iframe incorrectly" for each one (see the block editor's `Iframe`
	138	+ * component). `enqueue_block_assets` is the supported hook instead:
	139	+ * core replays it inside _wp_get_iframed_editor_assets() to build the
	140	+ * canvas document, so the styles land there directly and the compatibility
	141	+ * pass skips the handle instead of cloning it.
	142	+ *
	143	+ * The hook fires for the admin document as well, so a single enqueue here
	144	+ * covers the editor chrome too and the handle stays `suredonation-form-editor`
	145	+ * — the id core matches on when deciding whether a clone is still needed.
	146	+ *
	147	+ * One consequence of the move: `enqueue_block_assets` reaches the admin
	148	+ * document only through wp_common_block_scripts_and_styles(), which bails when
	149	+ * `should_load_block_editor_scripts_and_styles` is filtered false in wp-admin.
	150	+ * Anything doing that also strips `wp-block-library` and visibly breaks core's
	151	+ * own editor, so it is not a case worth defending against here.
	152	+ *
	153	+ * @return void
	154	+ * @since 1.5.1
	155	+ */
	156	+ public function enqueue_editor_styles() {
	157	+ // `enqueue_block_assets` also fires on the front end, where there is no
	158	+ // editor to style.
	159	+ if ( ! is_admin() || ! $this->is_form_editor_screen() ) {
	160	+ return;
	161	+ }
	162	+
	163	+ /*
	164	+ * No `wp-components` dependency. It is already in both documents ahead of
	165	+ * this sheet without being asked for: the admin page loads it as editor
	166	+ * chrome, and _wp_get_iframed_editor_assets() enqueues `wp-edit-blocks`
	167	+ * — whose dependencies include `wp-components` — before it fires
	168	+ * `enqueue_block_assets`. Declaring it would neither change the cascade nor
	169	+ * keep anything out of the canvas.
	170	+ */
	171	+ wp_enqueue_style(
	172	+ 'suredonation-form-editor',
	173	+ SUREDONATION_URL . 'assets/build/editor/editor.css',
	174	+ [],
	175	+ $this->get_editor_asset()['version']
	176	+ );
	177	+ }
	178	+
	179	+ /**
	180	+ * Whether the current admin screen is the donation form editor.
	181	+ *
	182	+ * @return bool
	183	+ * @since 1.5.1
	184	+ */
	185	+ private function is_form_editor_screen() {
	186	+ // get_current_screen() lives in an admin include, so it is missing on the
	187	+ // front end — where enqueue_block_assets also fires. Checked here rather
	188	+ // than at each call site so the helper is safe for any caller.
	189	+ if ( ! function_exists( 'get_current_screen' ) ) {
	190	+ return false;
	191	+ }
	192	+
	193	+ $screen = get_current_screen();
	194	+
	195	+ return $screen instanceof \WP_Screen && Donation_Form::POST_TYPE === $screen->post_type;
	196	+ }
	197	+
	198	+ /**
	199	+ * Build metadata (dependencies and version) for the editor bundle.
	200	+ *
	201	+ * @return array{dependencies: array<int, string>, version: string}
	202	+ * @since 1.5.1
	203	+ */
	204	+ private function get_editor_asset() {
	205	+ $editor_asset_file = SUREDONATION_DIR . 'assets/build/editor/editor.asset.php';
	206	+
	207	+ return file_exists( $editor_asset_file )
	208	+ ? include $editor_asset_file
	209	+ : [
	210	+ 'dependencies' => [
	211	+ 'wp-plugins',
	212	+ 'wp-editor',
	213	+ 'wp-components',
	214	+ 'wp-data',
	215	+ 'wp-element',
	216	+ 'wp-i18n',
	217	+ ],
	218	+ 'version' => SUREDONATION_VER,
	219	+ ];
138	220	}
139	221
140	222	/**
141	223	* Register form settings meta fields.