Photoshop UXP: How to get pixels as PNG as base64? Only JPEG is documented

I want to use const dataImage = await imaging.encodeImageData(options); for a PNG

This works really well for getting from a layer, a base64 image, that can be used easily later and displayed in an <img>.
Unfortunately it seems there is no documented way to get a PNG.

But it seems it’s actually limited to JPEG, this is a big surprise to me, see:
Photoshop’s imaging types source code:

    /**
     * This API is exposed to allow image data to be used with UXP image elements. With the current version of UXP
     * you must use jpeg/base64 encoding when assigning to an image element.
     *
     * ```javascript
     * const dataImage = await imaging.encodeImageData(options);
     * ```
     *
     * Example:
     * ```javascript
     * const imageElement = document.createElement('img');
     *
     * const jpegData = await imaging.encodeImageData({"imageData": imgObj.imageData, "base64": true});
     *
     * const dataUrl = "data:image/jpeg;base64," + jpegData;
     * imageElement.src = dataUrl;
     * document.body.appendChild(imageElement);
     * ```
     *
     * @minVersion 24.4
     * @async
     */
    function encodeImageData(options: EncodeImageDataOptions): Promise<number[] | string>;

Does someone has an idea to get a PNG out of this array from getData()?

      const imageObj = await psImg.getPixels({
        layerID: 1,
      })
      const pixelData = await imageObj.imageData.getData({})

Types

        /**
         * Return pixel information from an `PhotoshopImageData` instance as a typed array.
         * The return type depends on the `componentSize` of the image.
         *
         * | Component Size | Return type |
         * | -------------- | ----------- |
         * | 8              | Uint8Array  |
         * | 16             | Uint16Array |
         * | 32             | Float32Array  |
         *
         * Example:
         * ```javascript
         * const pixelData = await imageObj.imageData.getData()
         * ```
         * @param options
         */
        getData: (options: GetDataOptions) => Promise<Uint8Array | Uint16Array | Float32Array>;

You could try this

With 2D canvas support
https://developer.adobe.com/photoshop/uxp/2022/uxp-api/reference-js/Global%20Members/HTML%20Elements/HTMLCanvasElement/

Thanks, this seems to be to convert image formats though.
I did not precise this clearly before, my goal of having a PNG format is to keep the transparency of the artwork. With JPEG I get a white background for example, with a PNG the background would be transparent.
So converting a JPEG to a PNG in not helping here, unfortunately.

Oh, gotcha. You already have transparency, and UXP gives only JPEG :check_mark:

As far I know uxp canvas can’t set bitmap directly. Canvas in browser can.