Block Bindings: Refactor e2e tests (#65526)

* WIP: Add script to block bindings tests * Add first version of block bindings test theme * Register movie CPT * Create structure for tests * Remove current specs * Share data between server and client * Add `getValues` tests * Move checks for paragraph locking * Wrap tests that should lock editing * Add setValues e2e tests * Add tests for `getFieldsList` * Add tests for rich text workflows * Add remaining use cases * Use one complete source * Add tests for CPT template * Fix label test * Add attributes panel tests * Add dropdown post meta tests * Add post meta tests for custom templates * Add e2e tests in movie post * Add template for posts * Rename specs * Fix post-meta tests * Check post meta in the frontend * Update theme definition * Populate `setValues` * Check image title locking Co-authored-by: SantosGuillamot <santosguillamot@git.wordpress.org> Co-authored-by: cbravobernal <cbravobernal@git.wordpress.org>
WordPress · Sep 27, 2024 · 03d93b4 · 03d93b4
1 parent 85ec9d0
commit 03d93b4
Show file tree

Hide file tree

Showing 12 changed files with 1,979 additions and 2,472 deletions.
diff --git a/packages/e2e-tests/plugins/block-bindings.php b/packages/e2e-tests/plugins/block-bindings.php
@@ -8,67 +8,158 @@
  */
 
 /**
-* Register custom fields and custom block bindings sources.
-*/
+ * Code necessary for testing block bindings:
+ * - Enqueues a custom script to register sources in the client.
+ * - Registers sources in the server.
+ * - Registers a custom post type and custom fields.
+ */
 function gutenberg_test_block_bindings_registration() {
+	// Define fields list.
+	$upload_dir  = wp_upload_dir();
+	$testing_url = $upload_dir['url'] . '/1024x768_e2e_test_image_size.jpeg';
+	$fields_list = array(
+		'text_field'  => array(
+			'label' => 'Text Field Label',
+			'value' => 'Text Field Value',
+		),
+		'url_field'   => array(
+			'label' => 'URL Field Label',
+			'value' => $testing_url,
+		),
+		'empty_field' => array(
+			'label' => 'Empty Field Label',
+			'value' => '',
+		),
+	);
+
+	// Enqueue a custom script for the plugin.
+	wp_enqueue_script(
+		'gutenberg-test-block-bindings',
+		plugins_url( 'block-bindings/index.js', __FILE__ ),
+		array(
+			'wp-blocks',
+			'wp-private-apis',
+		),
+		filemtime( plugin_dir_path( __FILE__ ) . 'block-bindings/index.js' ),
+		true
+	);
+
+	// Pass data to the script.
+	wp_localize_script(
+		'gutenberg-test-block-bindings',
+		'testingBindings',
+		array(
+			'fieldsList' => $fields_list,
+		)
+	);
+
 	// Register custom block bindings sources.
 	register_block_bindings_source(
-		'core/server-source',
+		'testing/complete-source',
+		array(
+			'label'              => 'Complete Source',
+			'get_value_callback' => function ( $source_args ) use ( $fields_list ) {
+				if ( ! isset( $source_args['key'] ) || ! isset( $fields_list[ $source_args['key'] ] ) ) {
+					return null;
+				}
+				return $fields_list[ $source_args['key'] ]['value']; },
+		)
+	);
+	register_block_bindings_source(
+		'testing/server-only-source',
 		array(
 			'label'              => 'Server Source',
 			'get_value_callback' => function () {},
 		)
 	);
 
-	// Register custom fields.
+	// Register "movie" custom post type.
+	register_post_type(
+		'movie',
+		array(
+			'label'        => 'Movie',
+			'public'       => true,
+			'supports'     => array( 'title', 'editor', 'comments', 'revisions', 'trackbacks', 'author', 'excerpt', 'page-attributes', 'thumbnail', 'custom-fields', 'post-formats' ),
+			'has_archive'  => true,
+			'show_in_rest' => true,
+		)
+	);
+
+	// Register global custom fields.
 	register_meta(
 		'post',
 		'text_custom_field',
 		array(
+			'default'      => 'Value of the text custom field',
 			'show_in_rest' => true,
-			'type'         => 'string',
 			'single'       => true,
-			'default'      => 'Value of the text custom field',
+			'type'         => 'string',
 		)
 	);
 	register_meta(
 		'post',
 		'url_custom_field',
 		array(
+			'default'      => '#url-custom-field',
 			'show_in_rest' => true,
-			'type'         => 'string',
 			'single'       => true,
-			'default'      => '#url-custom-field',
+			'type'         => 'string',
 		)
 	);
+	// Register CPT custom fields.
 	register_meta(
 		'post',
-		'empty_field',
+		'movie_field',
 		array(
-			'show_in_rest' => true,
-			'type'         => 'string',
-			'single'       => true,
-			'default'      => '',
+			'label'          => 'Movie field label',
+			'default'        => 'Movie field default value',
+			'object_subtype' => 'movie',
+			'show_in_rest'   => true,
+			'single'         => true,
+			'type'           => 'string',
+		)
+	);
+	register_meta(
+		'post',
+		'field_with_only_label',
+		array(
+			'label'          => 'Field with only label',
+			'object_subtype' => 'movie',
+			'show_in_rest'   => true,
+			'single'         => true,
+			'type'           => 'string',
+		)
+	);
+	register_meta(
+		'post',
+		'field_without_label_or_default',
+		array(
+			'object_subtype' => 'movie',
+			'show_in_rest'   => true,
+			'single'         => true,
+			'type'           => 'string',
 		)
 	);
 	register_meta(
 		'post',
 		'_protected_field',
 		array(
-			'type'         => 'string',
-			'show_in_rest' => true,
-			'single'       => true,
-			'default'      => 'protected field value',
+			'default'        => 'Protected field value',
+			'object_subtype' => 'movie',
+			'show_in_rest'   => true,
+			'single'         => true,
+			'type'           => 'string',
 		)
 	);
 	register_meta(
 		'post',
 		'show_in_rest_false_field',
 		array(
-			'show_in_rest' => false,
-			'type'         => 'string',
-			'single'       => true,
-			'default'      => 'show_in_rest false field value',
+			'default'        => 'show_in_rest false field value',
+			'object_subtype' => 'movie',
+			'show_in_rest'   => false,
+			'single'         => true,
+			'type'           => 'string',
 		)
 	);
 }

diff --git a/packages/e2e-tests/plugins/block-bindings/index.js b/packages/e2e-tests/plugins/block-bindings/index.js
@@ -0,0 +1,55 @@
+const { unlock } =
+	wp.privateApis.__dangerousOptInToUnstableAPIsOnlyForCoreModules(
+		'I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.',
+		'@wordpress/blocks'
+	);
+
+const { registerBlockBindingsSource } = unlock( wp.blocks.privateApis );
+const { fieldsList } = window.testingBindings || {};
+
+const getValues = ( { bindings } ) => {
+	const newValues = {};
+	for ( const [ attributeName, source ] of Object.entries( bindings ) ) {
+		newValues[ attributeName ] = fieldsList[ source.args.key ]?.value;
+	}
+	return newValues;
+};
+const setValues = ( { registry, bindings } ) => {
+	Object.values( bindings ).forEach( ( { args, newValue } ) => {
+		// Example of what could be done.
+		registry.dispatch( 'core' ).editEntityRecord( 'postType', 'post', 1, {
+			meta: { [ args?.key ]: newValue },
+		} );
+	} );
+};
+
+registerBlockBindingsSource( {
+	name: 'testing/complete-source',
+	label: 'Complete Source',
+	getValues,
+	setValues,
+	canUserEditValue: () => true,
+	getFieldsList: () => fieldsList,
+} );
+
+registerBlockBindingsSource( {
+	name: 'testing/can-user-edit-false',
+	label: 'Can User Edit: False',
+	getValues,
+	setValues,
+	canUserEditValue: () => false,
+} );
+
+registerBlockBindingsSource( {
+	name: 'testing/can-user-edit-undefined',
+	label: 'Can User Edit: Undefined',
+	getValues,
+	setValues,
+} );
+
+registerBlockBindingsSource( {
+	name: 'testing/set-values-undefined',
+	label: 'Set Values: Undefined',
+	getValues,
+	canUserEditValue: () => true,
+} );