diff options
Diffstat (limited to 'toolkit/components/thumbnails/test/browser_thumbnails_bg_image_capture.js')
-rw-r--r-- | toolkit/components/thumbnails/test/browser_thumbnails_bg_image_capture.js | 95 |
1 files changed, 95 insertions, 0 deletions
diff --git a/toolkit/components/thumbnails/test/browser_thumbnails_bg_image_capture.js b/toolkit/components/thumbnails/test/browser_thumbnails_bg_image_capture.js new file mode 100644 index 0000000000..03f30c544a --- /dev/null +++ b/toolkit/components/thumbnails/test/browser_thumbnails_bg_image_capture.js @@ -0,0 +1,95 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +const BASE_URL = + "http://mochi.test:8888/browser/toolkit/components/thumbnails/"; + +/** + * These tests ensure that when trying to capture a url that is an image file, + * the image itself is captured instead of the the browser window displaying the + * image, and that the thumbnail maintains the image aspect ratio. + */ +add_task(async function thumbnails_bg_image_capture() { + // Test that malformed input causes _finishCurrentCapture to be called with + // the correct reason. + const emptyUrl = "data:text/plain,"; + await bgCapture(emptyUrl, { + isImage: true, + onDone: (url, reason) => { + // BackgroundPageThumbs.TEL_CAPTURE_DONE_LOAD_FAILED === 6 + is(reason, 6, "Should have the right failure reason"); + }, + }); + + for (const { url, color, width, height } of [ + { + url: BASE_URL + "test/sample_image_red_1920x1080.jpg", + color: [255, 0, 0], + width: 1920, + height: 1080, + }, + { + url: BASE_URL + "test/sample_image_green_1024x1024.jpg", + color: [0, 255, 0], + width: 1024, + height: 1024, + }, + { + url: BASE_URL + "test/sample_image_blue_300x600.jpg", + color: [0, 0, 255], + width: 300, + height: 600, + }, + ]) { + dontExpireThumbnailURLs([url]); + const capturedPromise = bgAddPageThumbObserver(url); + await bgCapture(url); + await capturedPromise; + ok(thumbnailExists(url), "The image thumbnail should exist after capture"); + + const thumb = PageThumbs.getThumbnailURL(url); + const htmlns = "http://www.w3.org/1999/xhtml"; + const img = document.createElementNS(htmlns, "img"); + img.src = thumb; + await BrowserTestUtils.waitForEvent(img, "load"); + + // 448px is the default max-width of an image thumbnail + const expectedWidth = Math.min(448, width); + // Tall images are clipped to {width}x{width} + const expectedHeight = Math.min( + (expectedWidth * height) / width, + expectedWidth + ); + // Fuzzy equality to account for rounding + ok( + Math.abs(img.naturalWidth - expectedWidth) <= 1, + "The thumbnail should have the right width" + ); + ok( + Math.abs(img.naturalHeight - expectedHeight) <= 1, + "The thumbnail should have the right height" + ); + + // Draw the image to a canvas and compare the pixel color values. + const canvas = document.createElementNS(htmlns, "canvas"); + canvas.width = expectedWidth; + canvas.height = expectedHeight; + const ctx = canvas.getContext("2d"); + ctx.drawImage(img, 0, 0, expectedWidth, expectedHeight); + const [r, g, b] = ctx.getImageData( + 0, + 0, + expectedWidth, + expectedHeight + ).data; + // Fuzzy equality to account for image encoding + ok( + Math.abs(r - color[0]) <= 2 && + Math.abs(g - color[1]) <= 2 && + Math.abs(b - color[2]) <= 2, + "The thumbnail should have the right color" + ); + + removeThumbnail(url); + } +}); |