1483655 - Add a new explainer to the Recommended by Pocket section

Status: VERIFIED FIXED

(Firefox :: New Tab Page, enhancement, P1)

Description

[Nick Chapman]

In order to help more people understand and sign up for the Pocket service, we'd like to add a new message under the stories recommended by Pocket where we currently have trending topics.

The plan is outlined here:

https://docs.google.com/document/d/1CslJyAUrVg20Ad7FlY7gkGZv8_OKRRU9_DhJ3m6KuoU/

The Invision spec can be found here:

https://mozilla.invisionapp.com/share/AMNI4YWRJK6#/screens/314216120_pocket-Section-Disclaimer

Comment 1

[[github robot]]

Commit pushed to master at https://github.com/mozilla/activity-stream

https://github.com/mozilla/activity-stream/commit/7c31c0ca241318a811da4b28ad803735a155ed81
Bug 1483655 - Add a new explainer to the Recommended by Pocket section

Comment 2

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/activity-stream/pull/4401

Comment 3

[Scott [:thecount] Downe]

Two small design related issues noticed in this, which I have a patch to fix.

1. Flicker of logged in/out state while the page loads. You can see this in an attachment.

2. The height of the cta was actually a few pixels larger than the topics, which potentially causes a slight shift in content as it loads. I made sure on max screen sizes the content doesn't move.

Fix here: https://github.com/mozilla/activity-stream/pull/4401

Comment 4

[Scott [:thecount] Downe]

Example of the issue for item 1: https://user-images.githubusercontent.com/197334/45060065-6ad37680-b06c-11e8-9341-f2a6cf17bba3.gif

Comment 5

[Ed Lee :Mardak]

https://hg.mozilla.org/mozilla-central/rev/8937a84b0811

Comment 6

[[github robot]]

Commit pushed to master at https://github.com/mozilla/activity-stream

https://github.com/mozilla/activity-stream/commit/1486faa2a75a5fdb220375bf6f52a2a0c585cb02
Bug 1483655 - Ensure pocket cta doesn't flash between logged in and out while loading, and ensure content doesn't shift when adding cta.

Comment 7

[Ciprian Muresan [:cmuresan], Ecosystem QA]

I have verified that the new explainer correctly appears if the "browser.newtabpage.activity-stream.pocketCta" pref  is set to {"cta_button":"","cta_text":"","cta_url":"","use_cta":true} and that it changes accordingly when the user is logged into a Pocket account. 

Verified on Windows 10 x64, Mac 10.13, and Arch Linux x64 on the latest Nightly 64.0a1 (Build ID 20180920220102) and on an older Nightly build (63.0a1, 20180903220141).

Comment 8

[GitHub Bugzilla PR Linker]

Attachment: Link to GitHub pull-request: https://github.com/mozilla/activity-stream/pull/4475