commit 6126f44deb98e91efb4fb6a13dd7eb4c2c46d8e1 Author: Kathy Brade brade@pearlcrescent.com Date: Wed Oct 9 16:54:54 2019 -0400
Bug 31768: Introduce toolbar and network settings changes in onboarding
Update the "Tor Network" onboarding page to include a note that settings can now be accessed via the application preferences and add an "Adjust Your Tor Network Settings" action button which opens about:preferences#tor.
Replace the Tor Browser 8.5 "update" onboarding tour with a 9.0 one that includes the revised "Tor Network" page and a revised "Toolbar" page. The latter explains that Torbutton's toolbar item has been removed ("Goodbye Onion Button") and explains how to access the New Identity feature using the hamburger menu and new toolbar item. --- browser/app/profile/000-tor-browser.js | 6 +- browser/components/uitour/UITour.jsm | 7 +++ browser/extensions/onboarding/api.js | 5 +- .../extensions/onboarding/content/Onboarding.jsm | 70 +++++++++++---------- .../onboarding/content/img/figure_tor-network.png | Bin 27931 -> 11982 bytes .../content/img/figure_tor-toolbar-layout.png | Bin 10569 -> 13269 bytes .../onboarding/content/onboarding-tour-agent.js | 6 ++ .../extensions/onboarding/content/onboarding.css | 4 ++ 8 files changed, 60 insertions(+), 38 deletions(-)
diff --git a/browser/app/profile/000-tor-browser.js b/browser/app/profile/000-tor-browser.js index 49f5b6a37000..c146a83e26fe 100644 --- a/browser/app/profile/000-tor-browser.js +++ b/browser/app/profile/000-tor-browser.js @@ -347,9 +347,9 @@ pref("browser.download.panel.shown", true); pref("dom.securecontext.whitelist_onions", true);
// Onboarding. -pref("browser.onboarding.tourset-version", 3); -pref("browser.onboarding.newtour", "welcome,privacy,tor-network,circuit-display,security,expect-differences,onion-services"); -pref("browser.onboarding.updatetour", "toolbar-update-8.5,security-update-8.5"); +pref("browser.onboarding.tourset-version", 4); +pref("browser.onboarding.newtour", "welcome,privacy,tor-network-9.0,circuit-display,security,expect-differences,onion-services"); +pref("browser.onboarding.updatetour", "toolbar-update-9.0,tor-network-9.0"); pref("browser.onboarding.skip-tour-button.hide", true);
// prefs to disable jump-list entries in the taskbar on Windows (see bug #12885) diff --git a/browser/components/uitour/UITour.jsm b/browser/components/uitour/UITour.jsm index 2a4c81d69374..3753e55a81a1 100644 --- a/browser/components/uitour/UITour.jsm +++ b/browser/components/uitour/UITour.jsm @@ -72,11 +72,15 @@ const TOR_BROWSER_PAGE_ACTIONS_ALLOWED = new Set([ "showInfo", // restricted to TOR_BROWSER_TARGETS_ALLOWED "showMenu", // restricted to TOR_BROWSER_MENUS_ALLOWED "hideMenu", // restricted to TOR_BROWSER_MENUS_ALLOWED + "showHighlight", // restricted to TOR_BROWSER_TARGETS_ALLOWED + "hideHighlight", // restricted to TOR_BROWSER_TARGETS_ALLOWED + "openPreferences", "closeTab", "torBrowserOpenSecurityLevelPanel", ]);
const TOR_BROWSER_TARGETS_ALLOWED = new Set([ + "torBrowser-newIdentityButton", "torBrowser-circuitDisplay", "torBrowser-circuitDisplay-diagram", "torBrowser-circuitDisplay-newCircuitButton", @@ -136,6 +140,9 @@ var UITour = { torBrowserCircuitDisplayTarget("circuit-display-nodes")], ["torBrowser-circuitDisplay-newCircuitButton", torBrowserCircuitDisplayTarget("circuit-reload-button")], + ["torBrowser-newIdentityButton", { + query: "#new-identity-button", + }],
[ "accountStatus", diff --git a/browser/extensions/onboarding/api.js b/browser/extensions/onboarding/api.js index d11e525b9f8c..29b6f68a7914 100644 --- a/browser/extensions/onboarding/api.js +++ b/browser/extensions/onboarding/api.js @@ -39,13 +39,12 @@ const PREF_WHITELIST = [ // Tor Browser tours: "onboarding-tour-tor-welcome", "onboarding-tour-tor-privacy", - "onboarding-tour-tor-network", + "onboarding-tour-tor-network-9-0", "onboarding-tour-tor-circuit-display", "onboarding-tour-tor-security", "onboarding-tour-tor-expect-differences", "onboarding-tour-tor-onion-services", - "onboarding-tour-tor-toolbar-update-8-5", - "onboarding-tour-tor-security-update-8-5", + "onboarding-tour-tor-toolbar-update-9-0", #if 0 // Firefox tours. To reduce conflicts when rebasing against newer Firefox // code, we use the preprocessor to omit this code block. diff --git a/browser/extensions/onboarding/content/Onboarding.jsm b/browser/extensions/onboarding/content/Onboarding.jsm index 6d4dbfa35b40..4d991acf869d 100644 --- a/browser/extensions/onboarding/content/Onboarding.jsm +++ b/browser/extensions/onboarding/content/Onboarding.jsm @@ -119,19 +119,41 @@ var onboardingTourset = { return div; }, }, - "tor-network": { - id: "onboarding-tour-tor-network", + // In Tor Browser 9.0, we replaced the Tor Network panel with an updated one. + "tor-network-9.0": { + id: "onboarding-tour-tor-network-9-0", tourNameId: "onboarding.tour-tor-network", - instantComplete: true, + highlightId: "onboarding.tour-tor-update.prefix-new", getPage(win) { let div = win.document.createElement("div");
- createOnboardingTourDescription(div, + let desc = createOnboardingTourDescription(div, "onboarding.tour-tor-network.title", "onboarding.tour-tor-network.description"); + let additionalDesc = win.document.createElement("p"); + additionalDesc.className = "onboarding-tour-description-para2"; + additionalDesc.setAttribute("data-l10n-id", + "onboarding.tour-tor-network.description-para2"); + desc.appendChild(additionalDesc); + createOnboardingTourContent(div, "resource://onboarding/img/figure_tor-network.png"); - createOnboardingTourButton(div, - "onboarding-tour-tor-network-button", "onboarding.tour-tor-network.button"); + let btnContainer = createOnboardingTourButton(div, + "onboarding-tour-tor-network-action-button", "onboarding.tour-tor-network.action-button"); + btnContainer.className = "onboarding-tour-tor-action-button-container";
+ // The next button (right side) is a "Done" button if we are displaying + // the tour to users who updated their browser; otherwise, it is a + // button that takes the user to the next onboarding page. + let nextBtnID, nextBtnL10nID; + if (this._tourType === "update") { + // Using the onion services IDs here seems like a mistake, but it + // provides the functionality and translated string ("Done") we need. + nextBtnID = "onboarding-tour-tor-onion-services-next-button"; + nextBtnL10nID = "onboarding.tour-tor-onion-services.next-button"; + } else { + nextBtnID = "onboarding-tour-tor-network-button"; + nextBtnL10nID = "onboarding.tour-tor-network.button"; + } + createOnboardingTourButton(div, nextBtnID, nextBtnL10nID); return div; }, }, @@ -156,7 +178,6 @@ var onboardingTourset = { "security": { id: "onboarding-tour-tor-security", tourNameId: "onboarding.tour-tor-security", - highlightId: "onboarding.tour-tor-update.prefix-new", getPage(win) { let div = win.document.createElement("div");
@@ -215,42 +236,27 @@ var onboardingTourset = { }, }, // Tour items for users who have updated their Tor Browser: - "toolbar-update-8.5": { - id: "onboarding-tour-tor-toolbar-update-8-5", + "toolbar-update-9.0": { + id: "onboarding-tour-tor-toolbar-update-9-0", tourNameId: "onboarding.tour-tor-toolbar", highlightId: "onboarding.tour-tor-update.prefix-updated", - instantComplete: true, getPage(win) { let div = win.document.createElement("div");
let desc = createOnboardingTourDescription(div, - "onboarding.tour-tor-toolbar-update-8.5.title", "onboarding.tour-tor-toolbar-update-8.5.description"); + "onboarding.tour-tor-toolbar-update-9.0.title", "onboarding.tour-tor-toolbar-update-9.0.description"); + let additionalDesc = win.document.createElement("p"); + additionalDesc.className = "onboarding-tour-description-para2"; + additionalDesc.setAttribute("data-l10n-id", + "onboarding.tour-tor-toolbar-update-9.0.description-para2"); + desc.appendChild(additionalDesc);
createOnboardingTourContent(div, "resource://onboarding/img/figure_tor-toolbar-layout.png"); - createOnboardingTourButton(div, - "onboarding-tour-tor-toolbar-next-button", "onboarding.tour-tor-toolbar-update-8.5.next-button"); - - return div; - }, - }, - "security-update-8.5": { - id: "onboarding-tour-tor-security-update-8-5", - tourNameId: "onboarding.tour-tor-security", - highlightId: "onboarding.tour-tor-update.prefix-new", - getPage(win) { - let div = win.document.createElement("div"); - - let desc = createOnboardingTourDescription(div, - "onboarding.tour-tor-security-update-8.5.title", "onboarding.tour-tor-security-update-8.5.description"); - - createOnboardingTourContent(div, "resource://onboarding/img/figure_tor-security-level.png"); let btnContainer = createOnboardingTourButton(div, - "onboarding-tour-tor-security-button", "onboarding.tour-tor-security-level.button"); + "onboarding-tour-tor-toolbar-update-9-0-button", "onboarding.tour-tor-toolbar-update-9.0.button"); btnContainer.className = "onboarding-tour-tor-action-button-container"; - // It is confusing to use the two onion-services IDs below, but they - // provide the functionality and translated string ("Done") that we need. createOnboardingTourButton(div, - "onboarding-tour-tor-onion-services-next-button", "onboarding.tour-tor-onion-services.next-button"); + "onboarding-tour-tor-toolbar-next-button", "onboarding.tour-tor-toolbar-update-9.0.next-button");
return div; }, diff --git a/browser/extensions/onboarding/content/img/figure_tor-network.png b/browser/extensions/onboarding/content/img/figure_tor-network.png index fe0fa9408daa..87829397ab2a 100644 Binary files a/browser/extensions/onboarding/content/img/figure_tor-network.png and b/browser/extensions/onboarding/content/img/figure_tor-network.png differ diff --git a/browser/extensions/onboarding/content/img/figure_tor-toolbar-layout.png b/browser/extensions/onboarding/content/img/figure_tor-toolbar-layout.png index 624ef6514d39..6d8651e58c17 100644 Binary files a/browser/extensions/onboarding/content/img/figure_tor-toolbar-layout.png and b/browser/extensions/onboarding/content/img/figure_tor-toolbar-layout.png differ diff --git a/browser/extensions/onboarding/content/onboarding-tour-agent.js b/browser/extensions/onboarding/content/onboarding-tour-agent.js index a08320d0535a..7cdb10063f28 100644 --- a/browser/extensions/onboarding/content/onboarding-tour-agent.js +++ b/browser/extensions/onboarding/content/onboarding-tour-agent.js @@ -21,6 +21,12 @@ let onClick = evt => { case "onboarding-tour-tor-security-button": Mozilla.UITour.torBrowserOpenSecurityLevelPanel(); break; + case "onboarding-tour-tor-toolbar-update-9-0-button": + Mozilla.UITour.showHighlight("torBrowser-newIdentityButton", "zoom"); + break; + case "onboarding-tour-tor-network-action-button": + Mozilla.UITour.openPreferences("tor"); + break; #if 0 // Firefox onboarding actions. To reduce conflicts when rebasing against // newer Firefox code, we use the preprocessor to omit this code block. diff --git a/browser/extensions/onboarding/content/onboarding.css b/browser/extensions/onboarding/content/onboarding.css index f71ec1d13789..eb214de5e254 100644 --- a/browser/extensions/onboarding/content/onboarding.css +++ b/browser/extensions/onboarding/content/onboarding.css @@ -377,6 +377,10 @@ color: #420c5d; }
+.onboarding-tour-description-para2 { + margin-top: 16px; +} + .onboarding-tour-description-suffix { margin-top: 6px; font-size: 13px;