Due: August 28th Locales: en-US only UI: bug 1176256comment13 Rough test: https://github.com/tptour/tptour.github.io This bug is to execute the web development for a demo-ready Tracking Protection UITour.

Working branch: https://github.com/mozilla/bedrock/tree/bug-1190447-tracking-protection-uitour

Initial version is now up on demo2 for feedback. Testing instructions: 1. Add "https://www-demo2.allizom.org" to the comma-delimited preference `browser.uitour.testingOrigins`. It won't exist by default. 2. Enable UITour logging in the Browser Console to file better UITour bugs: `browser.uitour.loglevel` = "All". 3. Enable tracking protection: `privacy.trackingprotection.enabled` and/or `privacy.trackingprotection.pbmode.enabled`. 4. Set `privacy.trackingprotection.introURL` to "https://www-demo2.allizom.org/%LOCALE%/firefox/%VERSION%/tracking-protection/start/" and `privacy.trackingprotection.ui.enabled` to True to test about:privatebrowsing. 5. Open a new private browsing window and click the blue button that says "See how this works".

NI javaun, MattN, aislinn Hey guys, please test the above, and provide feedback before Friday. Thanks!

tested and provided feedback in meeting

Some notes from the meeting re: feedback - Use Page Visibility API to preserve info-panel state on switching tabs. - Add a slight delay before starting the blocked-content fade animation. - Remove the underline from the Visit Privacy Preferences link. - Update info panel text on step 2 to match the in-product button text. - Switch disable/enable text on step 2 if prompting the user to re-enable tracking protection on the page. - When the user finishes the tour, fade content out and show *something* (text & copy TBD). - Designs need to be seen by Creative team for a cursory look. If I've forgotten or missed anything here, please add it here in the bug. Thanks all!

Ok updates as per Comment 5 are now up on demo2 for feedback. Hopefully this should be enough for user testing, but if anyone has any other requests before Friday please let me know. Thanks!

Please note that for now the FAQ link points to this URL: https://support.mozilla.org/kb/tracking-protection-pbm If someone has the correct URL for the FAQ page, please let me know and I will update.

Can we change the copy on the end page to 'learn about' versus 'learn a bit about' - think its clearer. Can you also make the copy that says 'Learn more about' the same size as the body copy we use in the tooltips - it looks large to me. Also the blue link doesn't need an underline since its already blue to signify its a link. Otherwise looks good!

(In reply to agrigas from comment #8) > Can we change the copy on the end page to 'learn about' versus 'learn a bit > about' - think its clearer. Can you also make the copy that says 'Learn more > about' the same size as the body copy we use in the tooltips - it looks > large to me. Also the blue link doesn't need an underline since its already > blue to signify its a link. Otherwise looks good! Sure will do, thanks!

SVG version

Ok latest updates are now up on demo2, thanks for the feedback everyone!

I'm already seeing a regression on MacOSX. The doorhanger on step one is dropped to the left, right aligned, so most of the window is hanging off the edge of the browser chrome

(In reply to Javaun Moradi [:javaun] from comment #12) > I'm already seeing a regression on MacOSX. The doorhanger on step one is > dropped to the left, right aligned, so most of the window is hanging off the > edge of the browser chrome This isn't a regression - it's Bug 1188400 and happens when you move/resize the browser window.

Note: The TP Tour on demo2 has now been updated to use https://trackertest.org/ instead of https://doubleclick.net/ as iframe src targets.

Strings exposed for localization https://l10n.mozilla-community.org/~pascalc/langchecker/?locale=all&website=0&file=firefox/tracking-protection-tour.lang

Hi Rebecca! This is ready for WebQA. Could you please begin testing? See testing instructions in comment 2. Please let me or Alex know if you have any questions. Thanks!

Note: we do still have one known bug (bug 1188400) that is present in FF 42. It's considered a non-blocker for 42 beta, but should hopefully be fixed for general release.

Tested on Nightly. Everything looks good. My only question is: On the 3rd panel if you click "disable protection" instead of the tour "got it" button, tracking is turned off and the UI tour starts over immediately. Should the tour restart immediately and display panel 1 when they had virtually finished the tour?

(In reply to Rebecca Billings [:rbillings] from comment #18) > Tested on Nightly. Everything looks good. My only question is: On the 3rd > panel if you click "disable protection" instead of the tour "got it" button, > tracking is turned off and the UI tour starts over immediately. Should the > tour restart immediately and display panel 1 when they had virtually > finished the tour? That isn't the intended behavior. If the user clicks Disable, the explanation tool tip on the right should stay where it is and the copy should change to say 'its easy to disable.' Another issue i noticed, on step #3 - the tooltip anchored off the control panel should finish animating in at the same time as the control panel. Right now its jumpy and one opens and then the other opens. They should both open together if possible.

(In reply to agrigas from comment #19) > (In reply to Rebecca Billings [:rbillings] from comment #18) > > Tested on Nightly. Everything looks good. My only question is: On the 3rd > > panel if you click "disable protection" instead of the tour "got it" button, > > tracking is turned off and the UI tour starts over immediately. Should the > > tour restart immediately and display panel 1 when they had virtually > > finished the tour? > > That isn't the intended behavior. If the user clicks Disable, the > explanation tool tip on the right should stay where it is and the copy > should change to say 'its easy to disable.' This is incorrect. The default behaviour when someone disables tracking protection is for the browser to reload the page. What happens in this scenario is so far intended as discussed. It is too late to change for FF 42 beta and would require further FF engineering work. > Another issue i noticed, on step #3 - the tooltip anchored off the control > panel should finish animating in at the same time as the control panel. > Right now its jumpy and one opens and then the other opens. They should both > open together if possible. This is not possible. We need to wait for the control centre panel to open before showing the info panel.

(In reply to Alex Gibson [:agibson] from comment #20) > (In reply to agrigas from comment #19) > > (In reply to Rebecca Billings [:rbillings] from comment #18) > > > Tested on Nightly. Everything looks good. My only question is: On the 3rd > > > panel if you click "disable protection" instead of the tour "got it" button, > > > tracking is turned off and the UI tour starts over immediately. Should the > > > tour restart immediately and display panel 1 when they had virtually > > > finished the tour? > > > > That isn't the intended behavior. If the user clicks Disable, the > > explanation tool tip on the right should stay where it is and the copy > > should change to say 'its easy to disable.' > > This is incorrect. The default behaviour when someone disables tracking > protection is for the browser to reload the page. What happens in this > scenario is so far intended as discussed. It is too late to change for FF 42 > beta and would require further FF engineering work. If we have to refresh the page, then we should at least leave the user where they were - not restart the tour completely. I remember we discussed changing the copy and leaving the 'Got it' button so they could complete the tour after trying out the disable function. > > > Another issue i noticed, on step #3 - the tooltip anchored off the control > > panel should finish animating in at the same time as the control panel. > > Right now its jumpy and one opens and then the other opens. They should both > > open together if possible. > > This is not possible. We need to wait for the control centre panel to open > before showing the info panel.

(In reply to agrigas from comment #21) > (In reply to Alex Gibson [:agibson] from comment #20) > > (In reply to agrigas from comment #19) > > > (In reply to Rebecca Billings [:rbillings] from comment #18) > > > > Tested on Nightly. Everything looks good. My only question is: On the 3rd > > > > panel if you click "disable protection" instead of the tour "got it" button, > > > > tracking is turned off and the UI tour starts over immediately. Should the > > > > tour restart immediately and display panel 1 when they had virtually > > > > finished the tour? > > > > > > That isn't the intended behavior. If the user clicks Disable, the > > > explanation tool tip on the right should stay where it is and the copy > > > should change to say 'its easy to disable.' > > > > This is incorrect. The default behaviour when someone disables tracking > > protection is for the browser to reload the page. What happens in this > > scenario is so far intended as discussed. It is too late to change for FF 42 > > beta and would require further FF engineering work. > > If we have to refresh the page, then we should at least leave the user where > they were - not restart the tour completely. I remember we discussed > changing the copy and leaving the 'Got it' button so they could complete the > tour after trying out the disable function. > > > > > Another issue i noticed, on step #3 - the tooltip anchored off the control > > > panel should finish animating in at the same time as the control panel. > > > Right now its jumpy and one opens and then the other opens. They should both > > > open together if possible. > > > > This is not possible. We need to wait for the control centre panel to open > > before showing the info panel. As far as I inderstand, we can't tell if the user has previously disabled tracking protection when the page loads without opening the control panel first.

I should add, when the page reloads the copy does change as discussed to prompt the user to enable.

Matt, Javaun - the only way I can think to work around Comment 21 would be to track the user's state somehow on page reload. We could potentially use a query param once the user gets to step 3, which we could then check for again on page reload - but this is a bit of a workaround, and doesn't actually guarantee the user has clicked enable/disable (they could just reload the page, for example). Is this something we want to try and do, or is the current behavior ok for now? (I'm also being a bit cautious in that we don't want to be interpreted as tracking the user here). This is now a bit of a last minute change, but potentially something we could do if we think it's warranted?

Also discovered a new related edge-case bug today: Bug 1203904

Alex and I just chatted. We're going to proceed w/ his fix. For now, we'll add a query param just to step 3 so that if a user does click the open CC panel to "disable" TP for the session, then when the page reloads (this is what TP does when you enable/disable), the tour will automatically go back to step 3. we need this because step 3 has the exposed CC hanger with a callout panel that says "Got it" and allows the user to end the tour. We'll discuss next week in the UI tour meeting if we need to do more here.

Ok the updated code is now up on demo2 that addresses Comment 21, thanks all!

Changes look good on demo2

Commits pushed to master at https://github.com/mozilla/bedrock https://github.com/mozilla/bedrock/commit/a5611de83788c2bafd9bdcbeab09c5c741278484 [fix bug 1190447] Tracking Protection UITour development https://github.com/mozilla/bedrock/commit/0eb2292924992f6fcc4e131e78880ae1b8e04b6c Merge pull request #3282 from alexgibson/bug-1190447-tracking-protection-uitour [fix bug 1190447] Tracking Protection UITour development