|
| 1 | +import fs from 'fs'; |
| 2 | +import { PNG } from 'pngjs'; |
| 3 | + |
| 4 | +import resizeImageWidth from '../resizeImageWidth'; |
| 5 | + |
| 6 | +const testImageBeforePath = './src/algorithms/image-processing/seam-carving/__tests__/test-image-before.png'; |
| 7 | +const testImageAfterPath = './src/algorithms/image-processing/seam-carving/__tests__/test-image-after.png'; |
| 8 | + |
| 9 | +/** |
| 10 | + * Compares two images and finds the number of different pixels. |
| 11 | + * |
| 12 | + * @param {ImageData} imgA - ImageData for the first image. |
| 13 | + * @param {ImageData} imgB - ImageData for the second image. |
| 14 | + * @param {number} threshold - Color difference threshold [0..255]. Smaller - stricter. |
| 15 | + * @returns {number} - Number of different pixels. |
| 16 | + */ |
| 17 | +function pixelsDiff(imgA, imgB, threshold = 0) { |
| 18 | + if (imgA.width !== imgB.width || imgA.height !== imgB.height) { |
| 19 | + throw new Error('Images must have the same size'); |
| 20 | + } |
| 21 | + |
| 22 | + let differentPixels = 0; |
| 23 | + const numColorParams = 4; // RGBA |
| 24 | + |
| 25 | + for (let pixelIndex = 0; pixelIndex < imgA.data.length; pixelIndex += numColorParams) { |
| 26 | + // Get pixel's color for each image. |
| 27 | + const [aR, aG, aB] = imgA.data.subarray(pixelIndex, pixelIndex + numColorParams); |
| 28 | + const [bR, bG, bB] = imgB.data.subarray(pixelIndex, pixelIndex + numColorParams); |
| 29 | + |
| 30 | + // Get average pixel's color for each image (make them greyscale). |
| 31 | + const aAvgColor = Math.floor((aR + aG + aB) / 3); |
| 32 | + const bAvgColor = Math.floor((bR + bG + bB) / 3); |
| 33 | + |
| 34 | + // Compare pixel colors. |
| 35 | + if (Math.abs(aAvgColor - bAvgColor) > threshold) { |
| 36 | + differentPixels += 1; |
| 37 | + } |
| 38 | + } |
| 39 | + |
| 40 | + return differentPixels; |
| 41 | +} |
| 42 | + |
| 43 | +const pngLoad = (path) => new Promise((resolve) => { |
| 44 | + fs.createReadStream(path) |
| 45 | + .pipe(new PNG()) |
| 46 | + .on('parsed', function Parsed() { |
| 47 | + /** @type {ImageData} */ |
| 48 | + const imageData = { |
| 49 | + colorSpace: 'srgb', |
| 50 | + width: this.width, |
| 51 | + height: this.height, |
| 52 | + data: this.data, |
| 53 | + }; |
| 54 | + resolve(imageData); |
| 55 | + }); |
| 56 | +}); |
| 57 | + |
| 58 | +describe('resizeImageWidth', () => { |
| 59 | + it('should perform content-aware image width reduction', async () => { |
| 60 | + const imgBefore = await pngLoad(testImageBeforePath); |
| 61 | + const imgAfter = await pngLoad(testImageAfterPath); |
| 62 | + |
| 63 | + const toWidth = Math.floor(imgBefore.width / 2); |
| 64 | + |
| 65 | + const { |
| 66 | + img: imgResized, |
| 67 | + size: resizedSize, |
| 68 | + } = resizeImageWidth({ img: imgBefore, toWidth }); |
| 69 | + |
| 70 | + expect(imgResized).toBeDefined(); |
| 71 | + expect(resizedSize).toBeDefined(); |
| 72 | + |
| 73 | + expect(resizedSize).toEqual({ w: toWidth, h: imgBefore.height }); |
| 74 | + expect(imgResized.width).toBe(imgAfter.width); |
| 75 | + expect(imgResized.height).toBe(imgAfter.height); |
| 76 | + |
| 77 | + const colorThreshold = 50; |
| 78 | + const differentPixels = pixelsDiff(imgResized, imgAfter, colorThreshold); |
| 79 | + |
| 80 | + // Allow 10% of pixels to be different |
| 81 | + const pixelsThreshold = Math.floor((imgAfter.width * imgAfter.height) / 10); |
| 82 | + |
| 83 | + expect(differentPixels).toBeLessThanOrEqual(pixelsThreshold); |
| 84 | + }); |
| 85 | +}); |
0 commit comments