1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
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);
}
});
|
