Palette-based PNG cause failure attempting AVIF/WebP conversion under GD

[adamsilverstein]

When uploading a palette based PNG image and attempting to use core's image_editor_output_format to output WebP or AVIF images, conversion fails with a PHP error when using GD. GD cannot convert palette-based PNG to WebP/AVIF formats so to fix the issue, a palette image is first converted to truecolor (imagepalettetotruecolor). Testing shows the PHP error is resolved and the resulting images are still significantly smaller than their PNG counterparts.

This issue was originally reported in the Performance Lab Modern Images plugin - ​https://github.com/WordPress/performance/issues/1561. The issue is fixed by this PR in the plugin: ​https://github.com/WordPress/performance/pull/2024. The purpose of this ticket is to bring that fix directly into core, into WP_Image_Editor_GD.

We can start by adding a unit test to demonstrate the issue.

Trac ticket: https://core.trac.wordpress.org/ticket/63773

[adamsilverstein]

I added a simple test to convert an indexed PNG to a WebP. As expected, it fails.

Test - ​https://github.com/WordPress/wordpress-develop/pull/9368/files#diff-551c6fb8796176aa11b26a07c677b2b56c97f02d496fc3028cde5c083730d52d

"Fatal error: Paletter image not supported by webp in /var/www/src/wp-includes/class-wp-image-editor.php on line 577" (​https://github.com/WordPress/wordpress-develop/actions/runs/16655700347/job/47140087933?pr=9368)

Pushing the fix next...

[adamsilverstein]

Pushed the fix in ​https://github.com/WordPress/wordpress-develop/pull/9368/commits/73b5cb2a1a37e1d275668011fdd06a903d0f75c5, tests should now pass.

This is ready for review and testing.

Test instructions

1. Add a filter to WordPress as an mu plugin:

// Convert PNG's uploads to WebP.
add_filter( 'image_editor_output_format', function( $format ) {
	return array(
		'image/png' => 'image/webp'
	);
} );

2. Upload the sample dice image from the PR (or any palette based PNG image) to the media library.
3. Check the generated files and PHP logs.

Expected

All files are generated as WebPs.
No errors in logs.

Actual (before fix)

Fill sized image is generated with zero file size and is not a valid image.
PHP error or warning in log.

[b1ink0]

I confirmed the fix by uploading a palette-based PNG and everything converted to WebP properly without any PHP errors. To double-check, I commented out the imagepalettetotruecolor logic and got the expected "Palette image not supported by webp" error, so the fix is working.

Also tested this patch with the Modern Image Formats 2.5.1 ​https://wordpress.org/plugins/webp-uploads/ plugin active as an additional test case and had no issues there either.

[ozgursar]

Patch Testing Report

Patch Tested: ​https://github.com/WordPress/wordpress-develop/pull/9368

Environment

• WordPress: 7.0-alpha-61215-src
• PHP: 8.2.29
• Server: nginx/1.29.4
• Database: mysqli (Server: 8.4.7 / Client: mysqlnd 8.2.29)
• Browser: Chrome 144.0.0.0
• OS: macOS
• Theme: Twenty Twenty-One 2.7
• MU Plugins: None activated
• Plugins:
  • Code Snippets 3.9.4
  • Test Reports 1.2.1

Steps taken

1. Download the sample image from PR ​https://raw.githubusercontent.com/WordPress/wordpress-develop/6e5d64ef20c75f464632f1c7c4fb92bf60d55a36/tests/phpunit/data/images/png-tests/dice-palette.png
2. In order to use GD and confirm it via admin notices add the following code via Code Snippets or functions.php

add_filter('wp_image_editors', function($editors) {
    return array('WP_Image_Editor_GD');
});

add_action('admin_notices', function() {
    $implementations = _wp_image_editor_choose(array('mime_type' => 'image/png'));
    echo '<div class="notice notice-info"><p>';
    echo 'Image Editor: ' . (!is_wp_error($implementations) && !empty($implementations) ? $implementations : 'Error or none found');
    echo '</p></div>';
});

add_filter('image_editor_output_format', function($formats) {
    $formats['image/png'] = 'image/webp';
    return $formats;
});

3. You should now see Image Editor: WP_Image_Editor_GD at the admin notices section.
4. Media > Add Media File > Upload the sample dice-palette.png
5. ❌ Bug occurs. Generated webp image is zero file size.
6. The following error is added to log.

[DATETIME] PHP Warning: imagewebp(): Palette image not supported by webp in /var/www/src/wp-includes/class-wp-image-editor.php on line 577

7. Manually check the wp-content/uploads to confirm the filesize to be zero.
8. Apply patch.
9. Reupload the dice-palette.png sample image.
10. Image properly gets uploaded, no error is logged.
11. ✅ Patch is solving the problem.

Expected result

• Patch works as expected. GD library can properly convert a palette based PNG image to webp.

Screenshots/Screencast with results

Media before applying patch:

Filesize before applying patch:

---

Media after applying patch:

Filesize after applying patch: