From b6c5befc7838c532b334db01a0cb826f098c4063 Mon Sep 17 00:00:00 2001 From: Paolo Amadini Date: Wed, 15 Jul 2015 14:20:39 +0100 Subject: [PATCH] Bug 1177152 - Add Tracking Protection tour entry point to about:privatebrowsing. r=ttaubert --- browser/app/profile/firefox.js | 1 + .../content/aboutPrivateBrowsing.css | 83 +++++++++++++++- .../content/aboutPrivateBrowsing.js | 39 +++++--- .../content/aboutPrivateBrowsing.xhtml | 14 +++ .../privatebrowsing/test/browser/browser.ini | 1 + .../browser/browser_privatebrowsing_about.js | 98 +++++++++++++++++++ .../chrome/browser/aboutPrivateBrowsing.dtd | 10 ++ browser/themes/linux/jar.mn | 1 + browser/themes/osx/jar.mn | 1 + browser/themes/shared/mask-and-shield.svg | 9 ++ browser/themes/windows/jar.mn | 1 + 11 files changed, 243 insertions(+), 15 deletions(-) create mode 100644 browser/components/privatebrowsing/test/browser/browser_privatebrowsing_about.js create mode 100755 browser/themes/shared/mask-and-shield.svg diff --git a/browser/app/profile/firefox.js b/browser/app/profile/firefox.js index 280f255ee8c..4a4d77d0dc9 100644 --- a/browser/app/profile/firefox.js +++ b/browser/app/profile/firefox.js @@ -1919,6 +1919,7 @@ pref("browser.apps.URL", "https://marketplace.firefox.com/discovery/"); #ifdef NIGHTLY_BUILD pref("browser.polaris.enabled", false); pref("privacy.trackingprotection.ui.enabled", false); +pref("privacy.trackingprotection.introURL", "https://support.mozilla.org/kb/tracking-protection-firefox"); #endif #ifdef NIGHTLY_BUILD diff --git a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css index 6283c2781be..e9f37b845ed 100644 --- a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css +++ b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css @@ -8,6 +8,7 @@ body { display: flex; + flex-direction: column; box-sizing: border-box; min-height: 100vh; padding: 0 48px; @@ -15,9 +16,17 @@ body { justify-content: center; } +body.tour { + margin: 0; + padding: 0; + align-items: stretch; +} + body.normal .showPrivate, -body.private .showNormal { - display: none; +body.private .showNormal, +body.tour #pageContainer, +body:not(.tour) .showTour { + display: none !important; } #pageContainer { @@ -59,3 +68,73 @@ button { margin-top: 1.2em; -moz-margin-start: 0; } + +/* TRACKING PROTECTION TOUR */ + +#tourTop, +#tourBottom, +#tourFooter { + text-align: center; + padding: 0 31px; +} + +#tourTop, +#tourBottom { + flex: 1; +} + +#tourTop { + display: flex; + flex-direction: column; + justify-content: flex-end; + background-color: rgb(108,192,65); + color: white; + font-style: italic; +} + +#tourTitle { + margin: 16px 0 0; + background: url("chrome://browser/skin/mask-and-shield.svg") top no-repeat; + background-size: 179px 88px; + padding-top: 114px; + font-size: 38px; +} + +#tourSubtitle { + margin: 12px 0 32px; + font-size: 24px; +} + +#tourDescription, +#tourFooter { + margin: 16px auto; + max-width: 550px; +} + +#startTour { + display: inline-block; + width: 255px; + border-radius: 2px; + background-color: var(--in-content-primary-button-background); + color: var(--in-content-selected-text); + padding: 2px 5px; + line-height: 36px; + text-decoration: none; +} + +#startTour:hover { + background-color: var(--in-content-primary-button-background-hover); +} + +#tourFooter { + margin: 16px auto; +} + +#tourFooter, +#tourLearnMore { + font-size: 12px; +} + +#tourFooterText { + opacity: 0.6; +} diff --git a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.js b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.js index b2f6b3dc7d8..2f32f90e68c 100644 --- a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.js +++ b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.js @@ -4,10 +4,18 @@ const {classes: Cc, interfaces: Ci, utils: Cu} = Components; +Cu.import("resource://gre/modules/Services.jsm"); Cu.import("resource://gre/modules/PrivateBrowsingUtils.jsm"); -var stringBundle = Cc["@mozilla.org/intl/stringbundle;1"].getService(Ci.nsIStringBundleService) - .createBundle("chrome://browser/locale/aboutPrivateBrowsing.properties"); +let stringBundle = Services.strings.createBundle( + "chrome://browser/locale/aboutPrivateBrowsing.properties"); + +let useTour = false; +try { + useTour = Services.prefs.getBoolPref("privacy.trackingprotection.ui.enabled"); +} catch (ex) { + // The preference is not available. +} if (!PrivateBrowsingUtils.isContentWindowPrivate(window)) { document.title = stringBundle.GetStringFromName("title.normal"); @@ -18,28 +26,33 @@ if (!PrivateBrowsingUtils.isContentWindowPrivate(window)) { } function setFavIcon(url) { - var icon = document.createElement("link"); + let icon = document.createElement("link"); icon.setAttribute("rel", "icon"); icon.setAttribute("type", "image/png"); icon.setAttribute("href", url); - var head = document.getElementsByTagName("head")[0]; + let head = document.getElementsByTagName("head")[0]; head.insertBefore(icon, head.firstChild); } document.addEventListener("DOMContentLoaded", function () { + let formatURLPref = Cc["@mozilla.org/toolkit/URLFormatterService;1"] + .getService(Ci.nsIURLFormatter).formatURLPref; + let learnMoreURL = formatURLPref("app.support.baseURL") + "private-browsing"; + if (!PrivateBrowsingUtils.isContentWindowPrivate(window)) { + // Normal browsing window. document.body.setAttribute("class", "normal"); + } else if (!useTour) { + // Private browsing window, classic version. + document.getElementById("learnMore").setAttribute("href", learnMoreURL); + } else { + // Private browsing window, Tracking Protection tour version. + document.body.setAttribute("class", "tour"); + let tourURL = formatURLPref("privacy.trackingprotection.introURL"); + document.getElementById("startTour").setAttribute("href", tourURL); + document.getElementById("tourLearnMore").setAttribute("href", learnMoreURL); } - // Set up the help link - let learnMoreURL = Cc["@mozilla.org/toolkit/URLFormatterService;1"] - .getService(Ci.nsIURLFormatter) - .formatURLPref("app.support.baseURL"); - let learnMore = document.getElementById("learnMore"); - if (learnMore) { - learnMore.setAttribute("href", learnMoreURL + "private-browsing"); - } - let startPrivateBrowsing = document.getElementById("startPrivateBrowsing"); if (startPrivateBrowsing) { startPrivateBrowsing.addEventListener("command", openPrivateWindow); diff --git a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.xhtml b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.xhtml index 1e465d6707f..f6cea0feaa9 100644 --- a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.xhtml +++ b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.xhtml @@ -45,5 +45,19 @@

&aboutPrivateBrowsing.learnMore;

+
+

&aboutPrivateBrowsing.title;

+

&trackingProtection.subtitle;

+
+
+

&trackingProtection.description;

+

&trackingProtection.startTour;

+

&trackingProtection.showPreferences;

+
+

+ &aboutPrivateBrowsing.shortdescription; + &aboutPrivateBrowsing.learnMore; +

diff --git a/browser/components/privatebrowsing/test/browser/browser.ini b/browser/components/privatebrowsing/test/browser/browser.ini index 18bc27fafad..48410bc5df0 100644 --- a/browser/components/privatebrowsing/test/browser/browser.ini +++ b/browser/components/privatebrowsing/test/browser/browser.ini @@ -16,6 +16,7 @@ support-files = title.sjs [browser_privatebrowsing_DownloadLastDirWithCPS.js] +[browser_privatebrowsing_about.js] [browser_privatebrowsing_aboutHomeButtonAfterWindowClose.js] [browser_privatebrowsing_aboutSessionRestore.js] [browser_privatebrowsing_cache.js] diff --git a/browser/components/privatebrowsing/test/browser/browser_privatebrowsing_about.js b/browser/components/privatebrowsing/test/browser/browser_privatebrowsing_about.js new file mode 100644 index 00000000000..4c438466553 --- /dev/null +++ b/browser/components/privatebrowsing/test/browser/browser_privatebrowsing_about.js @@ -0,0 +1,98 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +/** + * Opens a new private window and loads "about:privatebrowsing" there. + */ +function* openAboutPrivateBrowsing() { + let win = yield BrowserTestUtils.openNewBrowserWindow({ private: true }); + let tab = win.gBrowser.selectedBrowser; + tab.loadURI("about:privatebrowsing"); + yield BrowserTestUtils.browserLoaded(tab); + return { win, tab }; +} + +/** + * Clicks the given link and checks this opens the given URI in the same tab. + */ +function* testLinkOpensUrl({ win, tab, elementId, expectedUrl }) { + let loadedPromise = BrowserTestUtils.browserLoaded(tab); + yield ContentTask.spawn(tab, { elementId }, function* ({ elementId }) { + content.document.getElementById(elementId).click(); + }); + yield loadedPromise; + is(tab.currentURI.spec, expectedUrl, + `Clicking ${elementId} opened ${expectedUrl} in the same tab.`); + win.gBrowser.goBack(); +} + +/** + * Clicks the given link and checks this opens a new tab with the given URI. + */ +function* testLinkOpensTab({ win, tab, elementId, expectedUrl }) { + let newTabPromise = BrowserTestUtils.waitForNewTab(win.gBrowser, expectedUrl); + yield ContentTask.spawn(tab, { elementId }, function* ({ elementId }) { + content.document.getElementById(elementId).click(); + }); + let newTab = yield newTabPromise; + ok(true, `Clicking ${elementId} opened ${expectedUrl} in a new tab.`); + yield BrowserTestUtils.removeTab(newTab); +} + +/** + * Tests the Learn More action in the classic "about:privatebrowsing" window. + */ +add_task(function* test_classicActions() { + // Use classic version and change the remote URL to prevent network access. + Services.prefs.setBoolPref("privacy.trackingprotection.ui.enabled", false); + Services.prefs.setCharPref("app.support.baseURL", "https://example.com/"); + registerCleanupFunction(function () { + Services.prefs.clearUserPref("app.support.baseURL"); + Services.prefs.clearUserPref("privacy.trackingprotection.ui.enabled"); + }); + + let { win, tab } = yield openAboutPrivateBrowsing(); + + yield testLinkOpensTab({ win, tab, + elementId: "learnMore", + expectedUrl: "https://example.com/private-browsing", + }); + + yield BrowserTestUtils.closeWindow(win); +}); + +/** + * Tests the Tracking Protection tour actions in "about:privatebrowsing". + */ +add_task(function* test_tourActions() { + // Use tour version and change the remote URLs to prevent network access. + Services.prefs.setBoolPref("privacy.trackingprotection.ui.enabled", true); + Services.prefs.setCharPref("app.support.baseURL", "https://example.com/"); + Services.prefs.setCharPref("privacy.trackingprotection.introURL", + "https://example.com/tour"); + registerCleanupFunction(function () { + Services.prefs.clearUserPref("privacy.trackingprotection.introURL"); + Services.prefs.clearUserPref("app.support.baseURL"); + Services.prefs.clearUserPref("privacy.trackingprotection.ui.enabled"); + }); + + let { win, tab } = yield openAboutPrivateBrowsing(); + + yield testLinkOpensUrl({ win, tab, + elementId: "startTour", + expectedUrl: "https://example.com/tour", + }); + + yield testLinkOpensTab({ win, tab, + elementId: "showPreferences", + expectedUrl: "about:preferences#privacy", + }); + + yield testLinkOpensTab({ win, tab, + elementId: "tourLearnMore", + expectedUrl: "https://example.com/private-browsing", + }); + + yield BrowserTestUtils.closeWindow(win); +}); diff --git a/browser/locales/en-US/chrome/browser/aboutPrivateBrowsing.dtd b/browser/locales/en-US/chrome/browser/aboutPrivateBrowsing.dtd index b47eb902e9e..9dbde15203e 100644 --- a/browser/locales/en-US/chrome/browser/aboutPrivateBrowsing.dtd +++ b/browser/locales/en-US/chrome/browser/aboutPrivateBrowsing.dtd @@ -10,6 +10,8 @@ + + @@ -17,3 +19,11 @@ + + + + + + + + diff --git a/browser/themes/linux/jar.mn b/browser/themes/linux/jar.mn index 7258b0cb79a..f747e489c30 100644 --- a/browser/themes/linux/jar.mn +++ b/browser/themes/linux/jar.mn @@ -58,6 +58,7 @@ browser.jar: skin/classic/browser/magnifier@2x.png (../shared/magnifier@2x.png) skin/classic/browser/mask.png (../shared/mask.png) skin/classic/browser/mask@2x.png (../shared/mask@2x.png) + skin/classic/browser/mask-and-shield.svg (../shared/mask-and-shield.svg) skin/classic/browser/menuPanel.png skin/classic/browser/menuPanel@2x.png skin/classic/browser/menuPanel-customize.png diff --git a/browser/themes/osx/jar.mn b/browser/themes/osx/jar.mn index 02ad1f3cfd8..197621d9a8f 100644 --- a/browser/themes/osx/jar.mn +++ b/browser/themes/osx/jar.mn @@ -72,6 +72,7 @@ browser.jar: skin/classic/browser/magnifier@2x.png (../shared/magnifier@2x.png) skin/classic/browser/mask.png (../shared/mask.png) skin/classic/browser/mask@2x.png (../shared/mask@2x.png) + skin/classic/browser/mask-and-shield.svg (../shared/mask-and-shield.svg) skin/classic/browser/menuPanel.png skin/classic/browser/menuPanel@2x.png skin/classic/browser/menuPanel-customize.png diff --git a/browser/themes/shared/mask-and-shield.svg b/browser/themes/shared/mask-and-shield.svg new file mode 100755 index 00000000000..30ec312e757 --- /dev/null +++ b/browser/themes/shared/mask-and-shield.svg @@ -0,0 +1,9 @@ + + + + + + diff --git a/browser/themes/windows/jar.mn b/browser/themes/windows/jar.mn index 2bb5934e11c..4a3d4d811e9 100644 --- a/browser/themes/windows/jar.mn +++ b/browser/themes/windows/jar.mn @@ -63,6 +63,7 @@ browser.jar: skin/classic/browser/magnifier@2x.png (../shared/magnifier@2x.png) skin/classic/browser/mask.png (../shared/mask.png) skin/classic/browser/mask@2x.png (../shared/mask@2x.png) + skin/classic/browser/mask-and-shield.svg (../shared/mask-and-shield.svg) skin/classic/browser/menu-back.png skin/classic/browser/menu-back-XP.png skin/classic/browser/menu-forward.png