@RHo @JMinor this needs a design for when the user hasn't read anything recently. The widget stays visible even though we report that there's no data.

Ohhh.... thats an oversight on my part. I didn't realize widgets couldn't be selectively dislayed.

Basically this would only occur for new users who have not yet opened a single article, correct?

Potential solutions:

• Show some kind of user education "Read an article and see it bookmarked here"
• Show the most read article from the previous day?
• Show a random article
• Show the Main_page for the primary language

Given that the user has to "install" the widget the chances someone would choose to do so without ever opening a single article seems small, but obvs we still need something to show.

Per our planning meeting discussion, let's start by putting a simple user education message centered in the widget area for new users with 0 reading history. If that looks craptastic we can iterate on other solutions.

^ I tried to match the empty state of Apple's widgets (which are more matter of fact than user education) but let me know and I can update the copy and/or styling

(Also, the title saying WIKIPEDIA instead of WHERE YOU LEFT OFF is a known issue i'm trying to fix)

Can we try something like below for the message:

No recently read articles
Explore Wikipedia for more articles to read

Zeplin is here:
https://zpl.io/Z21KiN7

Testing

We will also need to add these to our Regression test list.

Install

1. Open the app and load any article
2. Close the app and go to the device's Today screen
3. Tap the Edit button at the bottom
4. Tap the green Add button next to Wikipedia "Continue where you left off" item
5. Tap Done
6. Verify the widget is shown on the Today screen, shows the article from step 1 and matches the mock

Click through

1. Tap on the article and verify the app opens, with the article displayed

Sync with history

1. In the article from the previous tests, tap any link to open a second article.
2. Go to the History tab and verify that that both articles are shown in correct order
3. Go to the device's Today screen and verify that the widget now shows the second article from step 1 of this test.

Section links

1. Open the Barack Obama article in the app, and scroll to the "Cultural and political image" section
2. Tap the W icon and go to the Explore screen
3. Go to the device's Today screen and verify that the widget now shows Barack, with the subheadline "Cultural and political image" shown.
4. Tap the widget
5. Verify that the Barack article opens, and the article is positioned in the "Cultural and political image" section.
6. Open the Table of Contents and verify that the "Cultural and political image" section is highlighted.
7. verify that the button in the upper left says "< Explore" and loads the explore tab when tapped

History item deletion

1. Go to the history tab
2. Swipe to delete the first item (should be Barack Obama)
3. Note the item now at the top of the History
4. Go to the device's Today screen and verify that the widget now shows the article from step 3

No History

1. Go to the History tab
2. Tap "Clear all" and then confirm, verify that the History list is now empty.
3. Go to the device's Today screen and verify that the widget now shows a message as mocked above

Timer

1. open any article in the app
2. quit the app and note the time
3. 4 hours later go to the device's Today screen and verify that the widget now shows the article from step 1, and the timer in the lower left says "4 Hours"

Currently, I am able to break this following these steps:

1. Open the Pablo Escobar article from the top read card on Explore
2. Let the article load
3. Go back and tap the Rob Lowe article
4. Check the widget: Rob Lowe as expected
5. Go back to app and press back to Explore then go to History
6. Rob is on top, Pablo is second
7. Go to the widget: Pablo is now shown as the current article

Expected behavior: Rob Lowe should still be shown as the Continue reading article.

Note that returning to the History screen Rob Lowe is still shown at the top of the History, as expected.

I am still seeing the bahavior described in my last comment, even after Corey fixed T144417 (which I was hoping was related/causal).

The continue reading item often does not matching the last item in my history. I can provide logs or jump on a hangout to debug from source, if helpful, but this is a blocker.

@RHo Looks like there was an issue with upload of screenshots.

To put in writing, here are the changes from the previous iteration:

Use Text Extract, with fallback to wikidata description as the sub item (rather than the section titile)
When there is no image, allow the text to fill the horizontal space
Change Widget name to "Continue Reading"

@JMinor - hmm weird I updated the Pholio at the same time as updating on Zeplin. Just added images again.

Also @Fjalapeno you can see the redlined versions in Zeplin:
https://zpl.io/Z21KiN7
(select the "Widget" tag)
It includes a new mock showing how it looks when there is no section or image.

https://github.com/wikimedia/wikipedia-ios/pull/884

https://github.com/wikimedia/wikipedia-ios/pull/885

hi @Mhurd and @Fjalapeno – a few visual design bugs that I can see on the simulator and from the Git images posted (unfortunately cannot get it working on my phone).

1. Size of the Continue reading image should be the same as Top read articles' images. At the moment it is slightly bigger.
2. Continue reading image should be in the same position as the Top read articles' images. Actual: It is slightly closer to the left (ie., greater padding on the RHS).
3. Top read article images should be a square 86x86pt size. At the moment they are slightly narrower.
4. Title of the expanded Top read widget (ie., where it says the Wikipedia language) should be in font type SF UI Display with the heavier font-weight Black (but still in the same color #555A5F)
5. Sparkline should move to always be below the last line of text rather than being locked in the bottom LHS corner of each list item.

Here's a screenshot capturing feedback above in visual form:

Cross posting on the Top read widget ticket T142760: Create a Top Read widget as well.

@RHo I'll try to fix those.

^ @Fjalapeno

https://github.com/wikimedia/wikipedia-ios/pull/887

Testing with iPhone 6S (iOS 10.0.1) and Wikipedia 5.2.0 (939). I'm in the middle of the Timer steps and will update on that later today. In one area Section Links Step 3 the widget does not show the subheadline of the article (I am using a phone). Per instruction from @JMinor I'm still using the store version of the app so I can test any issues again on future TestFlight builds.

Testing with iPhone 6S (iOS 10.0.1) and Wikipedia 5.2.0 (939). The Timer test passed. I'm uploading the Barack Obama screencaps regarding Section Links Step 3 just in case these might be an area of discussion.

Thanks @Nicholas.tsg

We changed the design of the widget slightly, so in the Section Links test we can remove step 3 ("Go to the device's Today screen and verify that the widget now shows Barack, with the subheadline "Cultural and political image" shown.")

The rest of the test is still valid, and should be added to the regression script along with the other widget tests.