githaven-fork/web_src/js/utils/image.test.js
silverwind 5e72526da4
Downscale pasted PNG images based on metadata (#29123)
Some images like MacOS screenshots contain
[pHYs](http://www.libpng.org/pub/png/book/chapter11.html#png.ch11.div.8)
data which we can use to downscale uploaded images so they render in the
same dppx ratio in which they were taken.

Before:

<img width="584" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/50979e3a-5d5a-40dc-a0a4-36eb6e28f14a">

After:

<img width="329" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/0690902a-f2fe-4c6b-97b3-6fdd67c21bad">
2024-02-19 02:23:06 +00:00

30 lines
1.5 KiB
JavaScript

import {pngChunks, imageInfo} from './image.js';
const pngNoPhys = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAAAAAA6fptVAAAADUlEQVQIHQECAP3/AAAAAgABzePRKwAAAABJRU5ErkJggg==';
const pngPhys = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAEElEQVQI12OQNZcAIgYIBQAL8gGxdzzM0A==';
const pngEmpty = 'data:image/png;base64,';
async function dataUriToBlob(datauri) {
return await (await globalThis.fetch(datauri)).blob();
}
test('pngChunks', async () => {
expect(await pngChunks(await dataUriToBlob(pngNoPhys))).toEqual([
{name: 'IHDR', data: new Uint8Array([0, 0, 0, 1, 0, 0, 0, 1, 8, 0, 0, 0, 0])},
{name: 'IDAT', data: new Uint8Array([8, 29, 1, 2, 0, 253, 255, 0, 0, 0, 2, 0, 1])},
{name: 'IEND', data: new Uint8Array([])},
]);
expect(await pngChunks(await dataUriToBlob(pngPhys))).toEqual([
{name: 'IHDR', data: new Uint8Array([0, 0, 0, 2, 0, 0, 0, 2, 8, 2, 0, 0, 0])},
{name: 'pHYs', data: new Uint8Array([0, 0, 22, 37, 0, 0, 22, 37, 1])},
{name: 'IDAT', data: new Uint8Array([8, 215, 99, 144, 53, 151, 0, 34, 6, 8, 5, 0, 11, 242, 1, 177])},
]);
expect(await pngChunks(await dataUriToBlob(pngEmpty))).toEqual([]);
});
test('imageInfo', async () => {
expect(await imageInfo(await dataUriToBlob(pngNoPhys))).toEqual({width: 1, dppx: 1});
expect(await imageInfo(await dataUriToBlob(pngPhys))).toEqual({width: 2, dppx: 2});
expect(await imageInfo(await dataUriToBlob(pngEmpty))).toEqual({width: 0, dppx: 1});
});