Add tests for updated selectors API

WordPress · Mar 13, 2023 · 43257ba · 43257ba
1 parent d43c099
commit 43257ba
Show file tree

Hide file tree

Showing 2 changed files with 103 additions and 2 deletions.
diff --git a/phpunit/bootstrap.php b/phpunit/bootstrap.php
@@ -134,6 +134,46 @@ function gutenberg_register_test_block_for_feature_selectors() {
 			),
 		)
 	);
+
+	WP_Block_Type_Registry::get_instance()->register(
+		'my/block-with-selectors',
+		array(
+			'api_version' => 2,
+			'attributes'  => array(
+				'textColor' => array(
+					'type' => 'string',
+				),
+				'style'     => array(
+					'type' => 'object',
+				),
+			),
+			'supports'    => array(
+				'__experimentalBorder' => array(
+					'radius' => true,
+				),
+				'color'                => array(
+					'background' => true,
+					'text'       => true,
+				),
+				'spacing'              => array(
+					'padding' => true,
+				),
+				'typography'           => array(
+					'fontSize' => true,
+				),
+			),
+			'selectors'   => array(
+				'root'       => '.custom-root-selector',
+				'border'     => array(
+					'root' => '.custom-root-selector img',
+				),
+				'color'      => array(
+					'text' => '.custom-root-selector > figcaption',
+				),
+				'typography' => '.custom-root-selector > figcaption',
+			),
+		)
+	);
 }
 tests_add_filter( 'init', 'gutenberg_register_test_block_for_feature_selectors' );
 
@@ -142,4 +182,3 @@ function gutenberg_register_test_block_for_feature_selectors() {
 
 // Use existing behavior for wp_die during actual test execution.
 remove_filter( 'wp_die_handler', 'fail_if_died' );
-
diff --git a/phpunit/class-wp-theme-json-test.php b/phpunit/class-wp-theme-json-test.php
@@ -803,7 +803,7 @@ public function test_get_stylesheet_handles_whitelisted_block_level_element_pseu
 	 * bootstrap. After a core block adopts feature level selectors we could
 	 * remove that filter and instead use the core block for the following test.
 	 */
-	public function test_get_stylesheet_with_block_support_feature_level_selectors() {
+	public function test_get_stylesheet_with_deprecated_feature_level_selectors() {
 		$theme_json = new WP_Theme_JSON_Gutenberg(
 			array(
 				'version'  => WP_Theme_JSON_Gutenberg::LATEST_SCHEMA,
@@ -856,6 +856,68 @@ public function test_get_stylesheet_with_block_support_feature_level_selectors()
 		$this->assertEquals( $expected, $theme_json->get_stylesheet() );
 	}
 
+	/**
+	 * This test relies on a block having already been registered prior to
+	 * theme.json generating block metadata. Until a core block adopts the
+	 * new selectors API, we need to register a test block.
+	 * This is achieved via `tests_add_filter()` in Gutenberg's phpunit
+	 * bootstrap. After a core block adopts feature level selectors we could
+	 * remove that filter and instead use the core block for the following test.
+	 */
+	public function test_get_stylesheet_with_block_json_selectors() {
+		$theme_json = new WP_Theme_JSON_Gutenberg(
+			array(
+				'version'  => WP_Theme_JSON_Gutenberg::LATEST_SCHEMA,
+				'settings' => array(
+					'border'     => array(
+						'radius' => true,
+					),
+					'color'      => array(
+						'custom'  => false,
+						'palette' => array(
+							array(
+								'slug'  => 'green',
+								'color' => 'green',
+							),
+						),
+					),
+					'spacing'    => array(
+						'padding' => true,
+					),
+					'typography' => array(
+						'fontSize' => true,
+					),
+				),
+				'styles'   => array(
+					'blocks' => array(
+						'my/block-with-selectors' => array(
+							'border'     => array(
+								'radius' => '9999px',
+							),
+							'color'      => array(
+								'background' => 'grey',
+								'text'       => 'navy',
+							),
+							'spacing'    => array(
+								'padding' => '20px',
+							),
+							'typography' => array(
+								'fontSize' => '3em',
+							),
+						),
+					),
+				),
+			)
+		);
+
+		$base_styles   = 'body{--wp--preset--color--green: green;}body { margin: 0;}.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }';
+		$block_styles  = '.custom-root-selector{background-color: grey;padding: 20px;}.custom-root-selector img{border-radius: 9999px;}.custom-root-selector > figcaption{color: navy;font-size: 3em;}';
+		$preset_styles = '.has-green-color{color: var(--wp--preset--color--green) !important;}.has-green-background-color{background-color: var(--wp--preset--color--green) !important;}.has-green-border-color{border-color: var(--wp--preset--color--green) !important;}';
+		$expected      = $base_styles . $block_styles . $preset_styles;
+
+		$this->assertEquals( $expected, $theme_json->get_stylesheet() );
+	}
+
 	public function test_allow_indirect_properties() {
 		$actual = WP_Theme_JSON_Gutenberg::remove_insecure_properties(
 			array(