Changeset 53751 for trunk/tests/phpunit/tests/image/editor.php

Timestamp:

07/21/2022 06:01:01 PM (2 years ago)

Author:

adamsilverstein

Message:

Media: enable generating multiple mime types for image uploads; specifically WebP versions for JPEG images by default.

This changeset adds the capability for core media uploads to generate sub sized images in more than a single mime type. The output formats for each mime type can be controlled through a filter. WebP is used as an additional output format for JPEG images by default to improve front end performance.

When generating additional mime types, only images which are smaller than the respective original are retained. By default, additional mime type images are only generated for the built-in core image sizes and any custom sizes that have opted in.

Image meta is updated with a new 'sources' array containing file details for each mime type. Each image size in the 'sizes' array also gets a new 'sources' array that contains the image file details for each mime type.

This change also increases image upload retries to accommodate additional image sizes. It also adds a $mime_type parameter to the wp_get_missing_image_subsizes function and filter.

This change adds three new filters to enable full control of secondary mime image generation and output:

• A new filter wp_image_sizes_with_additional_mime_type_support that filters the sizes that support secondary mime type output. Developers can use this to control the output of additional mime type sub-sized images on a per size basis.
• A new filter wp_upload_image_mime_transforms that filters the output mime types for a given input mime type. Developers can use this to control generation of additional mime types for a given input mime type or even override the original mime type.
• A new filter wp_content_image_mimes which controls image mime type output selection and order for frontend content. Developers can use this to control the mime type output preference order for content images. Content images inserted from the media library will use the available image versions based on the order from this filter.

Thanks to the many contributors who helped develop, test and give feedback on this feature.

A haiku to summarize:

Upload a JPEG
Images of all sizes
Output as WebPs

Props flixos90, MatthiasReinholz, studiolxv, markhowellsmead, eatingrules, pbiron, mukesh27, joegrainger, mehulkaklotar, tweetythierry, akshitsethi, peterwilsoncc, eugenemanuilov, mitogh, shetheliving, clarkeemily, codekraft, mikeschroder, clorith, kasparsd, spacedmonkey, trevorpfromsandee, jb510, scofennellgmailcom, seedsca, cagsmith, karinclimber, dainemawer, baxbridge, grapplerulrich, sobatkras, chynnabenton, tonylocalword, barneydavey, kwillmorth, garymatthews919, olliejones, imarkinteractive, jeffpaul, feastdesignco, webbeetle, masteradhoc.

See #55443.

File:

• trunk/tests/phpunit/tests/image/editor.php (modified) (4 diffs)

trunk/tests/phpunit/tests/image/editor.php

@@ -132 +132 @@
 
         // Removing PNG to WEBP conversion on save. Quality setting should reset to the default.
+        $editor->reset_output_mime_type();
         remove_filter( 'image_editor_output_format', array( $this, 'image_editor_output_formats' ) );
         $editor->save();
@@ -155 +156 @@
 
         // After removing the conversion the quality setting should reset to the filtered value for the original image type, JPEG.
+        $editor->reset_output_mime_type();
         remove_filter( 'image_editor_output_format', array( $this, 'image_editor_output_formats' ) );
         $editor->save();
@@ -227 +229 @@
 
         // Test with a suffix only.
-        $this->assertSame( 'canola-100x50.png', wp_basename( $editor->generate_filename( null, null, 'png' ) ) );
+        $this->assertSame( 'canola-100x50-jpg.png', wp_basename( $editor->generate_filename( null, null, 'png' ) ) );
 
         // Combo!
-        $this->assertSame( trailingslashit( realpath( get_temp_dir() ) ) . 'canola-new.png', $editor->generate_filename( 'new', realpath( get_temp_dir() ), 'png' ) );
+        $this->assertSame( trailingslashit( realpath( get_temp_dir() ) ) . 'canola-new-jpg.png', $editor->generate_filename( 'new', realpath( get_temp_dir() ), 'png' ) );
 
         // Test with a stream destination.
@@ -363 +365 @@
     }
 
+    /**
+     * Test creating  the original image mime type when the image is uploaded.
+     *
+     * @ticket 55443
+     *
+     * @dataProvider provider_image_with_default_behaviors_during_upload
+     */
+    public function it_should_create_the_original_image_mime_type_when_the_image_is_uploaded( $file_location, $expected_mime, $targeted_mime ) {
+        $attachment_id = $this->factory->attachment->create_upload_object( $file_location );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertIsArray( $metadata );
+        foreach ( $metadata['sizes'] as $size_name => $properties ) {
+            $this->assertArrayHasKey( 'sources', $properties );
+            $this->assertIsArray( $properties['sources'] );
+            $this->assertArrayHasKey( $expected_mime, $properties['sources'] );
+            $this->assertArrayHasKey( 'filesize', $properties['sources'][ $expected_mime ] );
+            $this->assertArrayHasKey( 'file', $properties['sources'][ $expected_mime ] );
+            $this->assertArrayHasKey( $targeted_mime, $properties['sources'] );
+            $this->assertArrayHasKey( 'filesize', $properties['sources'][ $targeted_mime ] );
+            $this->assertArrayHasKey( 'file', $properties['sources'][ $targeted_mime ] );
+        }
+    }
+
+    /**
+     * Data provider for it_should_create_the_original_image_mime_type_when_the_image_is_uploaded.
+     */
+    public function provider_image_with_default_behaviors_during_upload() {
+        yield 'JPEG image' => array(
+            DIR_TESTDATA . '/images/test-image.jpg',
+            'image/jpeg',
+            'image/webp',
+        );
+
+        yield 'WebP image' => array(
+            DIR_TESTDATA . '/images/webp-lossy.webp',
+            'image/webp',
+            'image/jpeg',
+        );
+    }
+
+    /**
+     * Test Do not create the sources property if no transform is provided.
+     *
+     * @ticket 55443
+     */
+    public function it_should_not_create_the_sources_property_if_no_transform_is_provided() {
+        add_filter( 'wp_upload_image_mime_transforms', '__return_empty_array' );
+
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertIsArray( $metadata );
+        foreach ( $metadata['sizes'] as $size_name => $properties ) {
+            $this->assertArrayNotHasKey( 'sources', $properties );
+        }
+    }
+
+    /**
+     * Test creating the sources property when no transform is available.
+     *
+     * @ticket 55443
+     */
+    public function it_should_create_the_sources_property_when_no_transform_is_available() {
+        add_filter(
+            'wp_upload_image_mime_transforms',
+            function () {
+                return array( 'image/jpeg' => array() );
+            }
+        );
+
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertIsArray( $metadata );
+        foreach ( $metadata['sizes'] as $size_name => $properties ) {
+            $this->assertArrayHasKey( 'sources', $properties );
+            $this->assertIsArray( $properties['sources'] );
+            $this->assertArrayHasKey( 'image/jpeg', $properties['sources'] );
+            $this->assertArrayHasKey( 'filesize', $properties['sources']['image/jpeg'] );
+            $this->assertArrayHasKey( 'file', $properties['sources']['image/jpeg'] );
+            $this->assertArrayNotHasKey( 'image/webp', $properties['sources'] );
+        }
+    }
+
+    /**
+     * Test not creating the sources property if the mime is not specified on the transforms images.
+     *
+     * @ticket 55443
+     */
+    public function it_should_not_create_the_sources_property_if_the_mime_is_not_specified_on_the_transforms_images() {
+        add_filter(
+            'wp_upload_image_mime_transforms',
+            function () {
+                return array( 'image/jpeg' => array() );
+            }
+        );
+
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/webp-lossy.webp'
+        );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertIsArray( $metadata );
+        foreach ( $metadata['sizes'] as $size_name => $properties ) {
+            $this->assertArrayNotHasKey( 'sources', $properties );
+        }
+    }
+
+
+    /**
+     * Test creating a WebP version with all the required properties.
+     *
+     * @ticket 55443
+     */
+    public function it_should_create_a_webp_version_with_all_the_required_properties() {
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+        $this->assertArrayHasKey( 'sources', $metadata['sizes']['thumbnail'] );
+        $this->assertArrayHasKey( 'image/jpeg', $metadata['sizes']['thumbnail']['sources'] );
+        $this->assertArrayHasKey( 'filesize', $metadata['sizes']['thumbnail']['sources']['image/jpeg'] );
+        $this->assertArrayHasKey( 'file', $metadata['sizes']['thumbnail']['sources']['image/jpeg'] );
+        $this->assertArrayHasKey( 'image/webp', $metadata['sizes']['thumbnail']['sources'] );
+        $this->assertArrayHasKey( 'filesize', $metadata['sizes']['thumbnail']['sources']['image/webp'] );
+        $this->assertArrayHasKey( 'file', $metadata['sizes']['thumbnail']['sources']['image/webp'] );
+        $this->assertStringEndsNotWith( '.jpeg', $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] );
+        $this->assertStringEndsWith( '.webp', $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] );
+    }
+
+    /**
+     * Test removing `scaled` suffix from the generated filename.
+     *
+     * @ticket 55443
+     */
+    public function it_should_remove_scaled_suffix_from_the_generated_filename() {
+        // The leafs image is 1080 pixels wide with this filter we ensure a -scaled version is created.
+        add_filter(
+            'big_image_size_threshold',
+            function () {
+                return 850;
+            }
+        );
+
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+        $metadata      = wp_get_attachment_metadata( $attachment_id );
+        $this->assertStringEndsWith( '-scaled.jpg', get_attached_file( $attachment_id ) );
+        $this->assertArrayHasKey( 'image/webp', $metadata['sizes']['medium']['sources'] );
+        $this->assertStringEndsNotWith( '-scaled.webp', $metadata['sizes']['medium']['sources']['image/webp']['file'] );
+        $this->assertStringEndsWith( '-300x200.webp', $metadata['sizes']['medium']['sources']['image/webp']['file'] );
+    }
+
+    /**
+     * Test removing the generated webp images when the attachment is deleted.
+     *
+     * @ticket 55443
+     */
+    public function it_should_remove_the_generated_webp_images_when_the_attachment_is_deleted() {
+        // Make sure no editor is available.
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $file    = get_attached_file( $attachment_id, true );
+        $dirname = pathinfo( $file, PATHINFO_DIRNAME );
+
+        $this->assertIsString( $file );
+        $this->assertFileExists( $file );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+        $sizes    = array( 'thumbnail', 'medium' );
+
+        foreach ( $sizes as $size_name ) {
+            $this->assertArrayHasKey( 'image/webp', $metadata['sizes'][ $size_name ]['sources'] );
+            $this->assertArrayHasKey( 'file', $metadata['sizes'][ $size_name ]['sources']['image/webp'] );
+            $this->assertFileExists(
+                path_join( $dirname, $metadata['sizes'][ $size_name ]['sources']['image/webp']['file'] )
+            );
+        }
+
+        wp_delete_attachment( $attachment_id );
+
+        foreach ( $sizes as $size_name ) {
+            $this->assertFileDoesNotExist(
+                path_join( $dirname, $metadata['sizes'][ $size_name ]['sources']['image/webp']['file'] )
+            );
+        }
+    }
+
+    /**
+     * Test removing the attached WebP version if the attachment is force deleted but empty trash day is not defined.
+     *
+     * @ticket 55443
+     */
+    public function it_should_remove_the_attached_webp_version_if_the_attachment_is_force_deleted_but_empty_trash_day_is_not_defined() {
+        // Make sure no editor is available.
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $file    = get_attached_file( $attachment_id, true );
+        $dirname = pathinfo( $file, PATHINFO_DIRNAME );
+
+        $this->assertIsString( $file );
+        $this->assertFileExists( $file );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertFileExists(
+            path_join( $dirname, $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] )
+        );
+
+        wp_delete_attachment( $attachment_id, true );
+
+        $this->assertFileDoesNotExist(
+            path_join( $dirname, $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] )
+        );
+    }
+
+    /**
+     * Test removing the WebP version of the image if the image is force deleted and empty trash days is set to zero.
+     *
+     * @ticket 55443
+     */
+    public function it_should_remove_the_webp_version_of_the_image_if_the_image_is_force_deleted_and_empty_trash_days_is_set_to_zero() {
+        // Make sure no editor is available.
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $file    = get_attached_file( $attachment_id, true );
+        $dirname = pathinfo( $file, PATHINFO_DIRNAME );
+
+        $this->assertIsString( $file );
+        $this->assertFileExists( $file );
+
+        $metadata = wp_get_attachment_metadata( $attachment_id );
+
+        $this->assertFileExists(
+            path_join( $dirname, $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] )
+        );
+
+        define( 'EMPTY_TRASH_DAYS', 0 );
+
+        wp_delete_attachment( $attachment_id, true );
+
+        $this->assertFileDoesNotExist(
+            path_join( $dirname, $metadata['sizes']['thumbnail']['sources']['image/webp']['file'] )
+        );
+    }
+
+    /**
+     * Test avoiding the change of URLs of images that are not part of the media library.
+     *
+     * @ticket 55443
+     */
+    public function it_should_avoid_the_change_of_urls_of_images_that_are_not_part_of_the_media_library() {
+        $paragraph = '<p>Donec accumsan, sapien et <img src="https://ia600200.us.archive.org/16/items/SPD-SLRSY-1867/hubblesite_2001_06.jpg">, id commodo nisi sapien et est. Mauris nisl odio, iaculis vitae pellentesque nec.</p>';
+
+        $this->assertSame( $paragraph, webp_uploads_update_image_references( $paragraph ) );
+    }
+
+    /**
+     * Test avoiding replacing not existing attachment IDs.
+     *
+     * @ticket 55443
+     */
+    public function it_should_avoid_replacing_not_existing_attachment_i_ds() {
+        $paragraph = '<p>Donec accumsan, sapien et <img class="wp-image-0" src="https://ia600200.us.archive.org/16/items/SPD-SLRSY-1867/hubblesite_2001_06.jpg">, id commodo nisi sapien et est. Mauris nisl odio, iaculis vitae pellentesque nec.</p>';
+
+        $this->assertSame( $paragraph, webp_uploads_update_image_references( $paragraph ) );
+    }
+
+    /**
+     * Test preventing replacing a WebP image.
+     *
+     * @ticket 55443
+     */
+    public function it_should_test_preventing_replacing_a_webp_image() {
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/webp-lossy.webp'
+        );
+
+        $tag = wp_get_attachment_image( $attachment_id, 'medium', false, array( 'class' => "wp-image-{$attachment_id}" ) );
+
+        $this->assertSame( $tag, webp_uploads_img_tag_update_mime_type( $tag, 'the_content', $attachment_id ) );
+    }
+
+    /**
+     * Test preventing replacing a jpg image if the image does not have the target class name.
+     *
+     * @ticket 55443
+     */
+    public function it_should_test_preventing_replacing_a_jpg_image_if_the_image_does_not_have_the_target_class_name() {
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $tag = wp_get_attachment_image( $attachment_id, 'medium' );
+
+        $this->assertSame( $tag, webp_uploads_update_image_references( $tag ) );
+    }
+
+    /**
+     * Test replacing the references to a JPG image to a WebP version.
+     *
+     * @dataProvider provider_replace_images_with_different_extensions
+     *
+     * @ticket 55443
+     */
+    public function it_should_replace_the_references_to_a_jpg_image_to_a_webp_version( $image_path ) {
+        $attachment_id = $this->factory->attachment->create_upload_object( $image_path );
+
+        $tag          = wp_get_attachment_image( $attachment_id, 'medium', false, array( 'class' => "wp-image-{$attachment_id}" ) );
+        $expected_tag = $tag;
+        $metadata     = wp_get_attachment_metadata( $attachment_id );
+        foreach ( $metadata['sizes'] as $size => $properties ) {
+            $expected_tag = str_replace( $properties['sources']['image/jpeg']['file'], $properties['sources']['image/webp']['file'], $expected_tag );
+        }
+
+        $this->assertNotEmpty( $expected_tag );
+        $this->assertNotSame( $tag, $expected_tag );
+        $this->assertSame( $expected_tag, webp_uploads_img_tag_update_mime_type( $tag, 'the_content', $attachment_id ) );
+    }
+
+    public function provider_replace_images_with_different_extensions() {
+        yield 'An image with a .jpg extension' => array( DIR_TESTDATA . '/images/test-image.jpg' );
+        yield 'An image with a .jpeg extension' => array( DIR_TESTDATA . '/images/test-image.jpeg' );
+    }
+
+    /**
+     * Test the full image size from the original mime type.
+     *
+     * @ticket 55443
+     */
+    public function it_should_contain_the_full_image_size_from_the_original_mime() {
+        $attachment_id = $this->factory->attachment->create_upload_object(
+            DIR_TESTDATA . '/images/test-image.jpg'
+        );
+
+        $tag = wp_get_attachment_image( $attachment_id, 'full', false, array( 'class' => "wp-image-{$attachment_id}" ) );
+
+        $expected = array(
+            'ext'  => 'jpg',
+            'type' => 'image/jpeg',
+        );
+        $this->assertSame( $expected, wp_check_filetype( get_attached_file( $attachment_id ) ) );
+        $this->assertContains( wp_basename( get_attached_file( $attachment_id ) ), webp_uploads_img_tag_update_mime_type( $tag, 'the_content', $attachment_id ) );
+    }
+
+    /**
+     * Test preventing replacing an image with no available sources.
+     *
+     * @ticket 55443
+     */
+    public function it_should_prevent_replacing_an_image_with_no_available_sources() {
+        add_filter( 'wp_upload_image_mime_transforms', '__return_empty_array' );
+
+        $attachment_id = $this->factory->attachment->create_upload_object( DIR_TESTDATA . '/images/test-image.jpg' );
+
+        $tag = wp_get_attachment_image( $attachment_id, 'full', false, array( 'class' => "wp-image-{$attachment_id}" ) );
+        $this->assertSame( $tag, webp_uploads_img_tag_update_mime_type( $tag, 'the_content', $attachment_id ) );
+    }
+
+    /**
+     * Test preventing update not supported images with no available sources.
+     *
+     * @dataProvider provider_it_should_prevent_update_not_supported_images_with_no_available_sources
+     *
+     * @ticket 55443
+     */
+    public function it_should_prevent_update_not_supported_images_with_no_available_sources( $image_path ) {
+        $attachment_id = $this->factory->attachment->create_upload_object( $image_path );
+
+        $this->assertIsNumeric( $attachment_id );
+        $tag = wp_get_attachment_image( $attachment_id, 'full', false, array( 'class' => "wp-image-{$attachment_id}" ) );
+
+        $this->assertSame( $tag, webp_uploads_img_tag_update_mime_type( $tag, 'the_content', $attachment_id ) );
+    }
+
+    /**
+     * Data provider for it_should_prevent_update_not_supported_images_with_no_available_sources.
+     */
+    public function provider_it_should_prevent_update_not_supported_images_with_no_available_sources() {
+        yield 'PNG image' => array( DIR_TESTDATA . '/images/test-image.png' );
+        yield 'GIFT image' => array( DIR_TESTDATA . '/images/test-image.gif' );
+    }
+
 }