diff --git a/.changeset/fair-scissors-teach.md b/.changeset/fair-scissors-teach.md
new file mode 100644
index 00000000..8bd1ad48
--- /dev/null
+++ b/.changeset/fair-scissors-teach.md
@@ -0,0 +1,5 @@
+---
+"@wpengine/wp-graphql-content-blocks": patch
+---
+
+tests : Backfill tests for Core Image block.
diff --git a/tests/unit/CoreImageTest.php b/tests/unit/CoreImageTest.php
index 18c32a8f..35236b1c 100644
--- a/tests/unit/CoreImageTest.php
+++ b/tests/unit/CoreImageTest.php
@@ -3,8 +3,19 @@
namespace WPGraphQL\ContentBlocks\Unit;
final class CoreImageTest extends PluginTestCase {
- public $instance;
+
+ /**
+ * The ID of the post created for the test.
+ *
+ * @var int
+ */
public $post_id;
+
+ /**
+ * The ID of the attachment created for the test.
+ *
+ * @var int
+ */
public $attachment_id;
public function setUp(): void {
@@ -15,17 +26,7 @@ public function setUp(): void {
$this->post_id = wp_insert_post(
[
'post_title' => 'Post Title',
- 'post_content' => preg_replace(
- '/\s+/',
- ' ',
- trim(
- '
-
- 
-
- '
- )
- ),
+ 'post_content' => '',
'post_status' => 'publish',
]
);
@@ -41,98 +42,466 @@ public function tearDown(): void {
parent::tearDown();
}
- public function test_retrieve_core_image_media_details() {
- $query = '
+ /**
+ * Get the query for the CoreImage block.
+ *
+ * @param string $attributes The attributes to add to query.
+ */
+ public function query(): string {
+ return '
fragment CoreImageBlockFragment on CoreImage {
attributes {
id
- }
- mediaDetails {
- height
width
+ height
+ alt
+ align
+ src
+ style
+ sizeSlug
+ linkClass
+ linkTarget
+ linkDestination
+ borderColor
+ caption
+ className
+ cssClassName
+ url
+ rel
+ href
+ title
+ lock
+ anchor
}
}
-
- query GetPosts {
- posts(first: 1) {
- nodes {
- editorBlocks {
- ...CoreImageBlockFragment
+
+ query Post( $id: ID! ) {
+ post(id: $id, idType: DATABASE_ID) {
+ databaseId
+ editorBlocks {
+ apiVersion
+ blockEditorCategoryName
+ clientId
+ cssClassNames
+ innerBlocks {
+ name
}
+ parentClientId
+ renderedHtml
+ name
+ ...CoreImageBlockFragment
}
}
}
';
- $actual = graphql( [ 'query' => $query ] );
- $node = $actual['data']['posts']['nodes'][0];
+ }
+
+ /**
+ * Test that the CoreImage block is retrieved correctly.
+ *
+ * Covers the following attributes:
+ * - apiVersion
+ * - blockEditorCategoryName
+ * - clientId
+ * - cssClassNames
+ * - innerBlocks
+ * - name
+ * - parentClientId
+ * - renderedHtml
+ * - attributes
+ */
+ public function test_retrieve_core_image_fields_attributes(): void {
+ $block_content = '
+
+
+
+
+ ';
+
+ $query = $this->query();
+
+ // Update the post content with the block content.
+ wp_update_post(
+ [
+ 'ID' => $this->post_id,
+ 'post_content' => $block_content,
+ ]
+ );
+
+ $variables = [
+ 'id' => $this->post_id,
+ ];
+
+ $actual = graphql( compact( 'query', 'variables' ) );
+
+ $node = $actual['data']['post'];
+
+ // Verify that the ID of the first post matches the one we just created.
+ $this->assertEquals( $this->post_id, $node['databaseId'] );
+ $this->assertEquals( 1, count( $node['editorBlocks'] ) );
+ $this->assertEquals( 'core/image', $node['editorBlocks'][0]['name'] );
+
+ $this->assertArrayNotHasKey( 'errors', $actual, 'There should not be any errors' );
+ $this->assertArrayHasKey( 'data', $actual, 'The data key should be present' );
+ $this->assertArrayHasKey( 'post', $actual['data'], 'The post key should be present' );
+
+ $this->assertEquals( $this->post_id, $actual['data']['post']['databaseId'], 'The post ID should match' );
+ $this->assertEquals( 1, count( $actual['data']['post']['editorBlocks'] ) );
+
+ $block = $actual['data']['post']['editorBlocks'][0];
+
+ $this->assertNotEmpty( $block['apiVersion'], 'The apiVersion should be present' );
+ $this->assertEquals( 'media', $block['blockEditorCategoryName'], 'The blockEditorCategoryName should be media' );
+ $this->assertNotEmpty( $block['clientId'], 'The clientId should be present' );
+ $this->assertNotEmpty( $block['cssClassNames'], 'The cssClassNames should be present' );
+ $this->assertEmpty( $block['innerBlocks'], 'There should be no inner blocks' );
+ $this->assertEquals( 'core/image', $block['name'], 'The block name should be core/image' );
+ $this->assertEmpty( $block['parentClientId'], 'There should be no parentClientId' );
+ $this->assertNotEmpty( $block['renderedHtml'], 'The renderedHtml should be present' );
$this->assertEquals(
[
- 'width' => 50,
- 'height' => 50,
+ 'align' => 'left',
+ 'id' => $this->attachment_id,
+ 'className' => 'test-css-class-name',
+ 'src' => 'http://mysite.local/wp-content/uploads/2023/05/online-programming-course-hero-section-bg.svg',
+ 'url' => 'http://mysite.local/wp-content/uploads/2023/05/online-programming-course-hero-section-bg.svg',
+ 'width' => null,
+ 'height' => null,
+ 'alt' => '',
+ 'style' => null,
+ 'sizeSlug' => null,
+ 'linkClass' => null,
+ 'linkTarget' => null,
+ 'linkDestination' => null,
+ 'borderColor' => null,
+ 'caption' => '',
+ 'cssClassName' => 'wp-block-image',
+ 'rel' => null,
+ 'href' => null,
+ 'title' => null,
+ 'lock' => null,
+ 'anchor' => null,
],
- $node['editorBlocks'][0]['mediaDetails']
+ $node['editorBlocks'][0]['attributes']
);
}
- public function test_retrieve_core_image_attributes() {
- $query = '
+ /**
+ * Test that the CoreImage block mediaDetails are retrieved correctly.
+ *
+ * Covers the following attributes:
+ * - height
+ * - width
+ */
+ public function test_retrieve_core_image_media_details(): void {
+ $block_content = '
+
+
+
+
+
+ Align left
+ ';
+
+ $query = '
fragment CoreImageBlockFragment on CoreImage {
attributes {
id
- width
+ }
+ mediaDetails {
height
- alt
- src
- style
- sizeSlug
- linkClass
- linkTarget
- linkDestination
- align
- caption
- cssClassName
+ width
}
}
-
- query GetPosts {
- posts(first: 1) {
- nodes {
- databaseId
- editorBlocks {
+
+ query Post( $id: ID! ) {
+ post(id: $id, idType: DATABASE_ID) {
+ editorBlocks {
+ apiVersion
+ blockEditorCategoryName
+ name
+ innerBlocks {
name
- ...CoreImageBlockFragment
}
+ ...CoreImageBlockFragment
}
}
}
';
- $actual = graphql( [ 'query' => $query ] );
- $node = $actual['data']['posts']['nodes'][0];
- // Verify that the ID of the first post matches the one we just created.
- $this->assertEquals( $this->post_id, $node['databaseId'] );
- // There should be only one block using that query when not using flat: true
- $this->assertEquals( 1, count( $node['editorBlocks'] ) );
- $this->assertEquals( 'core/image', $node['editorBlocks'][0]['name'] );
+ // Update the post content with the block content.
+ wp_update_post(
+ [
+ 'ID' => $this->post_id,
+ 'post_content' => $block_content,
+ ]
+ );
+
+ $query = $query;
+ $variables = [
+ 'id' => $this->post_id,
+ ];
+
+ $actual = graphql( compact( 'query', 'variables' ) );
+
+ $this->assertArrayNotHasKey( 'errors', $actual, 'There should not be any errors' );
+ $this->assertArrayHasKey( 'data', $actual, 'The data key should be present' );
+ $this->assertArrayHasKey( 'post', $actual['data'], 'The post key should be present' );
+
+ $block = $actual['data']['post']['editorBlocks'][0];
$this->assertEquals(
+ [
+ 'width' => 50, // Previously untested.
+ 'height' => 50, // Previously untested.
+ ],
+ $block['mediaDetails']
+ );
+ }
+
+ /**
+ * Test that the CoreImage block attributes are retrieved correctly.
+ *
+ * Covers the following attributes:
+ * - width
+ * - height
+ * - alt
+ * - id
+ * - src
+ * - style
+ * - sizeSlug
+ * - linkClass
+ * - linkTarget
+ * - linkDestination
+ * - align
+ * - caption
+ * - className
+ * - url
+ * - borderColor
+ * - title
+ * - lock
+ * - anchor
+ * - rel
+ * - href
+ */
+ public function test_retrieve_core_image_attributes(): void {
+
+ $block_content = '
+
+
+
+
+
+ Align left
+ ';
+
+ $query = $this->query();
+
+ // Update the post content with the block content.
+ wp_update_post(
+ [
+ 'ID' => $this->post_id,
+ 'post_content' => $block_content,
+ ]
+ );
+
+ $variables = [
+ 'id' => $this->post_id,
+ ];
+
+ $actual = graphql( compact( 'query', 'variables' ) );
+
+ $this->assertArrayNotHasKey( 'errors', $actual, 'There should not be any errors' );
+ $this->assertArrayHasKey( 'data', $actual, 'The data key should be present' );
+ $this->assertArrayHasKey( 'post', $actual['data'], 'The post key should be present' );
+
+ $block = $actual['data']['post']['editorBlocks'][0];
+
+ // WordPress 6.4+ adds layout styles, so `cssClassName` needs to be checked separately.
+ $this->assertStringContainsString( 'wp-block-image', $block['attributes']['cssClassName'] );
+ $this->assertStringContainsString( 'size-full', $block['attributes']['cssClassName'] );
+ $this->assertStringContainsString( 'is-resized', $block['attributes']['cssClassName'] );
+ unset( $block['attributes']['cssClassName'] );
+
+ $this->assertEquals( // Previously untested.
[
'width' => '500',
'height' => 500.0,
- 'alt' => '',
+ 'alt' => 'alt-text',
'id' => $this->attachment_id,
'src' => 'http://mysite.local/wp-content/uploads/2023/05/online-programming-course-hero-section-bg.svg',
- 'style' => null,
+ 'style' => wp_json_encode(
+ [
+ 'color' => [
+ 'duotone' => 'var:preset|duotone|purple-green',
+ ],
+ ]
+ ),
'sizeSlug' => 'full',
- 'linkClass' => null,
- 'linkTarget' => null,
+ 'linkClass' => 'test-link-css-class',
+ 'linkTarget' => '_blank',
'linkDestination' => 'none',
- 'align' => null,
- 'caption' => '',
- 'cssClassName' => 'wp-block-image size-full is-resized',
+ 'align' => 'left',
+ 'caption' => 'Align left',
+ 'className' => 'test-css-class-name',
+ 'url' => 'http://mysite.local/wp-content/uploads/2023/05/online-programming-course-hero-section-bg.svg',
+ 'borderColor' => 'vivid-red',
+ 'title' => 'test-title',
+ 'lock' => wp_json_encode(
+ [
+ 'move' => true,
+ 'remove' => true,
+ ]
+ ),
+ 'anchor' => 'test-anchor',
+
+ 'rel' => 'https://www.youtube.com/ noreferrer noopener',
+ 'href' => 'http://decoupled.local/dcf-1-0/',
+
],
- $node['editorBlocks'][0]['attributes']
+ $block['attributes']
+ );
+ }
+
+ /**
+ * Test that the CoreImage block previously untested attributes are retrieved correctly.
+ *
+ * Covers the following attributes:
+ * - aspectRatio
+ * - scale
+ */
+ public function test_retrieve_core_aspectratio_scale_attributes(): void {
+ // `aspectRatio` and `scale` are only supported in WP 6.3+.
+ if ( ! is_wp_version_compatible( '6.3' ) ) {
+ $this->markTestSkipped( 'The aspectRatio and scale attributes are only supported in WP 6.3+' );
+ }
+
+ $block_content = '
+
+
+
+
+
+ Align left
+ ';
+
+ // Update the post content with the block content.
+ wp_update_post(
+ [
+ 'ID' => $this->post_id,
+ 'post_content' => $block_content,
+ ]
+ );
+
+ $variables = [
+ 'id' => $this->post_id,
+ ];
+
+ $query = '
+ fragment CoreImageBlockFragment on CoreImage {
+ attributes {
+ aspectRatio
+ scale
+ }
+ }
+
+ query Post( $id: ID! ) {
+ post(id: $id, idType: DATABASE_ID) {
+ databaseId
+ editorBlocks {
+ name
+ ...CoreImageBlockFragment
+ }
+ }
+ }';
+
+ $actual = graphql( compact( 'query', 'variables' ) );
+
+ $this->assertArrayNotHasKey( 'errors', $actual, 'There should not be any errors' );
+ $this->assertArrayHasKey( 'data', $actual, 'The data key should be present' );
+ $this->assertArrayHasKey( 'post', $actual['data'], 'The post key should be present' );
+
+ $block = $actual['data']['post']['editorBlocks'][0];
+
+ $this->assertEquals(
+ [
+ 'aspectRatio' => '4/3', // Previously untested.
+ 'scale' => 'cover', // Previously untested.
+
+ ],
+ $block['attributes']
+ );
+ }
+
+ /**
+ * Test that the CoreImage block previously untested attributes are retrieved correctly.
+ *
+ * Covers the following attributes:
+ * - lightbox
+ */
+ public function test_retrieve_core_lightbox_attribute(): void {
+ // `lightbox` is only supported in WP 6.4+.
+ if ( ! is_wp_version_compatible( '6.4' ) ) {
+ $this->markTestSkipped( 'The lightbox attribute is only supported in WP 6.4+' );
+ }
+
+ $block_content = '
+
+
+
+
+
+ Align left
+ ';
+
+ // Update the post content with the block content.
+ wp_update_post(
+ [
+ 'ID' => $this->post_id,
+ 'post_content' => $block_content,
+ ]
+ );
+
+ $variables = [
+ 'id' => $this->post_id,
+ ];
+
+ $query = '
+ fragment CoreImageBlockFragment on CoreImage {
+ attributes {
+ lightbox
+ }
+ }
+
+ query Post( $id: ID! ) {
+ post(id: $id, idType: DATABASE_ID) {
+ databaseId
+ editorBlocks {
+ name
+ ...CoreImageBlockFragment
+ }
+ }
+ }';
+
+ $actual = graphql( compact( 'query', 'variables' ) );
+
+ $this->assertArrayNotHasKey( 'errors', $actual, 'There should not be any errors' );
+ $this->assertArrayHasKey( 'data', $actual, 'The data key should be present' );
+ $this->assertArrayHasKey( 'post', $actual['data'], 'The post key should be present' );
+
+ $block = $actual['data']['post']['editorBlocks'][0];
+
+ $this->assertEquals(
+ [
+ 'lightbox' => wp_json_encode( // Previously untested.
+ [
+ 'enabled' => false,
+ ]
+ ),
+
+ ],
+ $block['attributes']
);
}
}