From 4b3999fc0c46afe14e762ef4f7819065e47509d4 Mon Sep 17 00:00:00 2001 From: Tim Taubert Date: Wed, 27 Feb 2013 13:37:45 +0100 Subject: [PATCH] Bug 727765 - part 1 - use nsIDOMWindowUtils.getScrollbarWidth() to avoid black borders at the right; r=jaws --- toolkit/components/thumbnails/PageThumbs.jsm | 11 +++- .../components/thumbnails/test/Makefile.in | 2 + .../test/background_red_scroll.html | 3 ++ .../test/browser_thumbnails_bug727765.js | 20 ++++++++ .../test/browser_thumbnails_redirect.js | 5 +- toolkit/components/thumbnails/test/head.js | 51 ++++++++----------- 6 files changed, 58 insertions(+), 34 deletions(-) create mode 100644 toolkit/components/thumbnails/test/background_red_scroll.html create mode 100644 toolkit/components/thumbnails/test/browser_thumbnails_bug727765.js diff --git a/toolkit/components/thumbnails/PageThumbs.jsm b/toolkit/components/thumbnails/PageThumbs.jsm index 6fce7245c19d..f45d4980abbc 100644 --- a/toolkit/components/thumbnails/PageThumbs.jsm +++ b/toolkit/components/thumbnails/PageThumbs.jsm @@ -238,8 +238,15 @@ this.PageThumbs = { * @return An array containing width, height and scale. */ _determineCropSize: function PageThumbs_determineCropSize(aWindow, aCanvas) { - let sw = aWindow.innerWidth; - let sh = aWindow.innerHeight; + let utils = aWindow.QueryInterface(Ci.nsIInterfaceRequestor) + .getInterface(Ci.nsIDOMWindowUtils); + let sbWidth = {}, sbHeight = {}; + utils.getScrollbarSize(false, sbWidth, sbHeight); + + // Even in RTL mode, scrollbars are always on the right. + // So there's no need to determine a left offset. + let sw = aWindow.innerWidth - sbWidth.value; + let sh = aWindow.innerHeight - sbHeight.value; let {width: thumbnailWidth, height: thumbnailHeight} = aCanvas; let scale = Math.min(Math.max(thumbnailWidth / sw, thumbnailHeight / sh), 1); diff --git a/toolkit/components/thumbnails/test/Makefile.in b/toolkit/components/thumbnails/test/Makefile.in index 2a34edb84ba8..5342883ffb24 100644 --- a/toolkit/components/thumbnails/test/Makefile.in +++ b/toolkit/components/thumbnails/test/Makefile.in @@ -19,8 +19,10 @@ _BROWSER_FILES = \ browser_thumbnails_storage.js \ browser_thumbnails_storage_migrate3.js \ browser_thumbnails_bug726727.js \ + browser_thumbnails_bug727765.js \ head.js \ background_red.html \ + background_red_scroll.html \ background_red_redirect.sjs \ privacy_cache_control.sjs \ $(NULL) diff --git a/toolkit/components/thumbnails/test/background_red_scroll.html b/toolkit/components/thumbnails/test/background_red_scroll.html new file mode 100644 index 000000000000..1e30bd3c6723 --- /dev/null +++ b/toolkit/components/thumbnails/test/background_red_scroll.html @@ -0,0 +1,3 @@ + + + diff --git a/toolkit/components/thumbnails/test/browser_thumbnails_bug727765.js b/toolkit/components/thumbnails/test/browser_thumbnails_bug727765.js new file mode 100644 index 000000000000..cab825e375be --- /dev/null +++ b/toolkit/components/thumbnails/test/browser_thumbnails_bug727765.js @@ -0,0 +1,20 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +const URL = "http://mochi.test:8888/browser/toolkit/components/thumbnails/" + + "test/background_red_scroll.html"; + +// Test for black borders caused by scrollbars. +function runTests() { + // Create a tab with a page with a red background and scrollbars. + yield addTab(URL); + yield captureAndCheckColor(255, 0, 0, "we have a red thumbnail"); + + // Check the thumbnail color of the bottom right pixel. + yield whenFileExists(URL); + yield retrieveImageDataForURL(URL, function (aData) { + let [r, g, b] = [].slice.call(aData, -4); + is("" + [r,g,b], "255,0,0", "we have a red thumbnail"); + next(); + }); +} diff --git a/toolkit/components/thumbnails/test/browser_thumbnails_redirect.js b/toolkit/components/thumbnails/test/browser_thumbnails_redirect.js index 9055be2df326..52a4a50e8c9c 100644 --- a/toolkit/components/thumbnails/test/browser_thumbnails_redirect.js +++ b/toolkit/components/thumbnails/test/browser_thumbnails_redirect.js @@ -18,5 +18,8 @@ function runTests() { // Wait until the referrer's thumbnail's file has been written. yield whenFileExists(URL); - yield checkThumbnailColor(URL, 255, 0, 0, "referrer has a red thumbnail"); + yield retrieveImageDataForURL(URL, function ([r, g, b]) { + is("" + [r,g,b], "255,0,0", "referrer has a red thumbnail"); + next(); + }); } diff --git a/toolkit/components/thumbnails/test/head.js b/toolkit/components/thumbnails/test/head.js index bbb716812b9b..20ac4bacb01a 100644 --- a/toolkit/components/thumbnails/test/head.js +++ b/toolkit/components/thumbnails/test/head.js @@ -3,8 +3,8 @@ let tmp = {}; Cu.import("resource://gre/modules/PageThumbs.jsm", tmp); -let PageThumbs = tmp.PageThumbs; -let PageThumbsStorage = tmp.PageThumbsStorage; +Cu.import("resource:///modules/sessionstore/SessionStore.jsm", tmp); +let {PageThumbs, PageThumbsStorage, SessionStore} = tmp; Cu.import("resource://gre/modules/PlacesUtils.jsm"); @@ -29,12 +29,15 @@ let TestRunner = { */ run: function () { waitForExplicitFinish(); - this._iter = runTests(); - if (this._iter) - this.next(); - else - finish(); + SessionStore.promiseInitialized.then(function () { + this._iter = runTests(); + if (this._iter) { + this.next(); + } else { + finish(); + } + }.bind(this)); }, /** @@ -102,19 +105,20 @@ function captureAndCheckColor(aRed, aGreen, aBlue, aMessage) { // Capture the screenshot. PageThumbs.captureAndStore(browser, function () { - checkThumbnailColor(browser.currentURI.spec, aRed, aGreen, aBlue, aMessage); + retrieveImageDataForURL(browser.currentURI.spec, function ([r, g, b]) { + is("" + [r,g,b], "" + [aRed, aGreen, aBlue], aMessage); + next(); + }); }); } /** - * Retrieve a thumbnail from the cache and compare its pixel color values. - * @param aURL The URL of the thumbnail's page. - * @param aRed The red component's intensity. - * @param aGreen The green component's intensity. - * @param aBlue The blue component's intensity. - * @param aMessage The info message to print when comparing the pixel color. + * For a given URL, loads the corresponding thumbnail + * to a canvas and passes its image data to the callback. + * @param aURL The url associated with the thumbnail. + * @param aCallback The function to pass the image data to. */ -function checkThumbnailColor(aURL, aRed, aGreen, aBlue, aMessage) { +function retrieveImageDataForURL(aURL, aCallback) { let width = 100, height = 100; let thumb = PageThumbs.getThumbnailURL(aURL, width, height); @@ -130,25 +134,10 @@ function checkThumbnailColor(aURL, aRed, aGreen, aBlue, aMessage) { // Draw the image to a canvas and compare the pixel color values. let ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0, width, height); - checkCanvasColor(ctx, aRed, aGreen, aBlue, aMessage); - - next(); + aCallback(ctx.getImageData(0, 0, 100, 100).data); }); } -/** - * Checks the top-left pixel of a given canvas' 2d context for a given color. - * @param aContext The 2D context of a canvas. - * @param aRed The red component's intensity. - * @param aGreen The green component's intensity. - * @param aBlue The blue component's intensity. - * @param aMessage The info message to print when comparing the pixel color. - */ -function checkCanvasColor(aContext, aRed, aGreen, aBlue, aMessage) { - let [r, g, b] = aContext.getImageData(0, 0, 1, 1).data; - ok(r == aRed && g == aGreen && b == aBlue, aMessage); -} - /** * Checks if a thumbnail for the given URL exists. * @param aURL The url associated to the thumbnail.