Skip to content

Commit

Permalink
Fixed regression in image fields, adjusted and added tests.
Browse files Browse the repository at this point in the history
  • Loading branch information
@christophherr
christophherr committed Jul 18, 2018
1 parent d13bada commit 8cab5cf
Show file tree
Hide file tree
Showing 3 changed files with 174 additions and 14 deletions.
2 changes: 1 addition & 1 deletion lib/api/fields/types/views/image.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
// phpcs:disable Generic.WhiteSpace.ScopeIndent.Incorrect, Generic.WhiteSpace.ScopeIndent.IncorrectExact -- View file is indented for HTML structure.
?>

<button class="bs-add-image button button-small" type="button" <?php echo isset( $hide_add_link ) ? 'style="display: none"' : ''; ?>><?php echo esc_html( $link_text ); ?></button>
<button class="bs-add-image button button-small" type="button" <?php echo isset( $hide_add_link ) && $hide_add_link ? 'style="display: none"' : ''; ?>><?php echo esc_html( $link_text ); ?></button>
<input id="<?php echo esc_attr( $field['id'] ); ?>" type="hidden" name="<?php echo esc_attr( $field['name'] ); ?>" value="">
<div class="bs-images-wrap" data-multiple="<?php echo esc_attr( $is_multiple ); ?>">
<?php
Expand Down
88 changes: 83 additions & 5 deletions tests/phpunit/integration/api/fields/types/beansFieldImage.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@ public function setUp() {
}

/**
* Test beans_field_image() should render a single image field.
* Test beans_field_image() should render a single image field and hide the upload button when an image exists.
*/
public function test_should_render_single_image_field() {
public function test_should_render_single_image_field_and_hide_upload_button_when_image_exists() {
$post_id = self::factory()->post->create();
$image_id = self::factory()->attachment->create_object( 'image.png', $post_id, [
'post_mime_type' => 'image/jpeg',
Expand Down Expand Up @@ -84,9 +84,9 @@ public function test_should_render_single_image_field() {
}

/**
* Test beans_field_image() should render multiple images field.
* Test beans_field_image() should render multiple images field and show the upload button when images exist.
*/
public function test_should_render_multiple_images_field() {
public function test_should_render_multiple_images_field_and_show_upload_button_when_images_exist() {
$images = [];
$post_id = self::factory()->post->create();
$images[] = self::factory()->attachment->create_object( 'image-1.png', $post_id, [
Expand Down Expand Up @@ -114,7 +114,7 @@ public function test_should_render_multiple_images_field() {
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" style="display: none">Add Images</button>
<button class="bs-add-image button button-small" type="button" >Add Images</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="1">
<div class="bs-image-wrap">
Expand Down Expand Up @@ -202,4 +202,82 @@ public function test_should_render_single_image_field_with_default_alt_when_none
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
}

/**
* Test beans_field_image() should show the upload button for a single image field without image.
*
* @ticket #305
* @link https://github.com/Getbeans/Beans/issues/305
*/
public function test_should_show_upload_button_for_single_image_field_without_image() {
$post_id = self::factory()->post->create();
$field = $this->merge_field_with_default( [
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'value' => null, // Attachment ID.
], false );

// Run the function and grab the HTML out of the buffer.
ob_start();
beans_field_image( $field );
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" >Add Image</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="">
<div class="bs-image-wrap bs-image-template">
<input class="image-id" type="hidden" name="beans_fields[beans_image_test]" value="" disabled="disabled" />
<img src="" alt="">
<div class="bs-toolbar">
<button aria-label="Edit Image" type="button" class="button bs-button-edit dashicons dashicons-edit"></button>
<button aria-label="Delete Image" type="button" class="button bs-button-trash dashicons dashicons-post-trash"></button>
</div>
</div>
</div>
EOB;
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
}

/**
* Test beans_field_image() should show the upload button for a multiple image field without image.
*
* @ticket #305
* @link https://github.com/Getbeans/Beans/issues/305
*/
public function test_should_show_upload_button_for_multiple_image_field_without_image() {
$post_id = self::factory()->post->create();
$field = $this->merge_field_with_default( [
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'multiple' => true,
'value' => null, // Attachment ID.
], false );

// Run the function and grab the HTML out of the buffer.
ob_start();
beans_field_image( $field );
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" >Add Images</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="1">
<div class="bs-image-wrap bs-image-template">
<input class="image-id" type="hidden" name="beans_fields[beans_image_test][]" value="" disabled="disabled" />
<img src="" alt="">
<div class="bs-toolbar">
<button aria-label="Manage Images" type="button" class="button bs-button-menu dashicons dashicons-menu"></button>
<button aria-label="Edit Image" type="button" class="button bs-button-edit dashicons dashicons-edit"></button>
<button aria-label="Delete Image" type="button" class="button bs-button-trash dashicons dashicons-post-trash"></button>
</div>
</div>
</div>
EOB;
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
}
}
98 changes: 90 additions & 8 deletions tests/phpunit/unit/api/fields/types/beansFieldImage.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,9 @@ protected function setUp() {
}

/**
* Test beans_field_image() should render a single image field.
* Test beans_field_image() should render a single image field and hide the upload button when an image exists.
*/
public function test_should_render_single_image_field() {
public function test_should_render_single_image_field_and_hide_upload_button_when_image_exists() {
Monkey\Functions\expect( 'wp_get_attachment_image_src' )
->with( 1, 'thumbnail' )
->once()
Expand All @@ -49,7 +49,7 @@ public function test_should_render_single_image_field() {
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'value' => 1, // attachment ID.
'value' => 1, // Attachment ID.
], false );

// Run the function and grab the HTML out of the buffer.
Expand Down Expand Up @@ -85,9 +85,9 @@ public function test_should_render_single_image_field() {
}

/**
* Test beans_field_image() should render a multiple images field.
* Test beans_field_image() should render a multiple images field and show the upload button when images exist.
*/
public function test_should_render_multiple_images_field() {
public function test_should_render_multiple_images_field_and_show_upload_button_when_images_exist() {
Monkey\Functions\expect( 'wp_get_attachment_image_src' )
->times( 2 )
->andReturnUsing( function ( $image_id ) {
Expand All @@ -105,7 +105,7 @@ public function test_should_render_multiple_images_field() {
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'value' => [ 1, 2 ], // attachment IDs.
'value' => [ 1, 2 ], // Attachment IDs.
'multiple' => true,
], false );

Expand All @@ -115,7 +115,7 @@ public function test_should_render_multiple_images_field() {
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" style="display: none">Add Images</button>
<button class="bs-add-image button button-small" type="button" >Add Images</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="1">
<div class="bs-image-wrap">
Expand Down Expand Up @@ -167,7 +167,7 @@ public function test_should_render_single_image_field_with_default_alt_when_none
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'value' => 1, // attachment ID.
'value' => 1, // Attachment ID.
], false );

// Run the function and grab the HTML out of the buffer.
Expand Down Expand Up @@ -196,6 +196,88 @@ public function test_should_render_single_image_field_with_default_alt_when_none
</div>
</div>
</div>
EOB;
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
}

/**
* Test beans_field_image() should show the upload button for a single image field without image.
*
* @ticket #305
* @link https://github.com/Getbeans/Beans/issues/305
*/
public function test_should_show_upload_button_for_single_image_field_without_image() {
$field = $this->merge_field_with_default( [
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'value' => null, // Attachment ID.
], false );

Monkey\Functions\expect( 'wp_get_attachment_image_src' )->never();
Monkey\Functions\expect( 'get_post_meta' )->never();

// Run the function and grab the HTML out of the buffer.
ob_start();
beans_field_image( $field );
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" >Add Image</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="">
<div class="bs-image-wrap bs-image-template">
<input class="image-id" type="hidden" name="beans_fields[beans_image_test]" value="" disabled="disabled" />
<img src="" alt="">
<div class="bs-toolbar">
<button aria-label="Edit Image" type="button" class="button bs-button-edit dashicons dashicons-edit"></button>
<button aria-label="Delete Image" type="button" class="button bs-button-trash dashicons dashicons-post-trash"></button>
</div>
</div>
</div>
EOB;
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
}

/**
* Test beans_field_image() should show the upload button for a multiple image field without image.
*
* @ticket #305
* @link https://github.com/Getbeans/Beans/issues/305
*/
public function test_should_show_upload_button_for_multiple_image_field_without_image() {
$field = $this->merge_field_with_default( [
'id' => 'beans_image_test',
'type' => 'image',
'label' => 'Image Test',
'multiple' => true,
'value' => null, // Attachment ID.
], false );

Monkey\Functions\expect( 'wp_get_attachment_image_src' )->never();
Monkey\Functions\expect( 'get_post_meta' )->never();

// Run the function and grab the HTML out of the buffer.
ob_start();
beans_field_image( $field );
$html = ob_get_clean();

$expected = <<<EOB
<button class="bs-add-image button button-small" type="button" >Add Images</button>
<input id="beans_image_test" type="hidden" name="beans_fields[beans_image_test]" value="">
<div class="bs-images-wrap" data-multiple="1">
<div class="bs-image-wrap bs-image-template">
<input class="image-id" type="hidden" name="beans_fields[beans_image_test][]" value="" disabled="disabled" />
<img src="" alt="">
<div class="bs-toolbar">
<button aria-label="Manage Images" type="button" class="button bs-button-menu dashicons dashicons-menu"></button>
<button aria-label="Edit Image" type="button" class="button bs-button-edit dashicons dashicons-edit"></button>
<button aria-label="Delete Image" type="button" class="button bs-button-trash dashicons dashicons-post-trash"></button>
</div>
</div>
</div>
EOB;
// Run the test.
$this->assertSame( $this->format_the_html( $expected ), $this->format_the_html( $html ) );
Expand Down

0 comments on commit 8cab5cf

Please sign in to comment.