Page MenuHomePhabricator

Newcomer tasks: mobile peek erroneously in production
Closed, ResolvedPublic

Description

I just created a new account in Czech Wikipedia on mobile to take some screenshots of our features, and I noticed that the mobile peek is in production. Unfortunately, it is in production in a way that damages the editing and help panel experiences. This experience is not just present for new accounts, but also for old ones. I also see it our other target wikis. I am using Safari on an iPhone 6SIn this video, you can see me going through the steps below: https://drive.google.com/file/d/1Wsd90wtL7TdtpaTYsklRcS7p2cHMJywt/view

  1. I arrive on the article from the suggested edits module in read mode, and everything looks normal. The mobile peek is not present.
  2. I tap the edit pencil, and the editor loads. The "gray background" that the mobile peek puts on top of the text is present, but the mobile peek is not. The help panel button is also not there. When I click into the text to edit, there is this glitchy moment where the editor toolbar jumps up and down.
  3. When I "x" out of the editor back to read mode, the mobile peek is present with the gray background.
  4. Then I open it up and go to the help panel.
  5. After closing the help panel and clicking the edit pencil again, the help panel button is present as expected.

Here are some screenshots from Czech Wikipedia in production:

gray background.png (1×750 px, 384 KB)

mobile peek.png (1×750 px, 259 KB)

Event Timeline

Yes, the issue is present in cswiki wmf.28. It does not seem to be reproducible in betalabs; for production the issue is present with the browser mobile emulator. The issue is present only when VE is an editor (which is a default editor for new users on cswiki.

In production there is kind of reverse order of features that should be presented:

betalabsproduction wmf.28
click on SE articleclick on SE article
the article is displayed with the mobile peek (the background is grey and the edit pencil button has a blue dotno mobile peek is present, and no blue dot
dismiss the mobile peek - the help button appearsclick on the edit button - the mobile peek appears/or just the grey background appears
click on 'X' and then again on the edit button - the mobile peek appears

Change 593925 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@master] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/593925

Change 593925 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/593925

Change 594134 had a related patch set uploaded (by Urbanecm; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@wmf/1.35.0-wmf.30] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/594134

Change 594134 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@wmf/1.35.0-wmf.30] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/594134

Change 594137 had a related patch set uploaded (by Gergő Tisza; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@wmf/1.35.0-wmf.28] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/594137

Change 594137 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@wmf/1.35.0-wmf.28] Help panel: Check if guidance feature flag is set before loading mobile peek

https://gerrit.wikimedia.org/r/594137

Mentioned in SAL (#wikimedia-operations) [2020-05-04T11:43:25Z] <tgr@deploy1001> Synchronized php-1.35.0-wmf.28/extensions/GrowthExperiments/modules/helppanel/ext.growthExperiments.HelpPanel.cta.js: SWAT: [[gerrit:594137|Help panel: Check if guidance feature flag is set before loading mobile peek (T251589)]] (duration: 01m 10s)

Mentioned in SAL (#wikimedia-operations) [2020-05-04T11:46:41Z] <tgr@deploy1001> Synchronized php-1.35.0-wmf.30/extensions/GrowthExperiments/modules/helppanel/ext.growthExperiments.HelpPanel.cta.js: SWAT: [[gerrit:594134|Help panel: Check if guidance feature flag is set before loading mobile peek (T251589)]] (duration: 01m 06s)

This was backported to wmf.28 and wmf.30. I've checked at cswiki, looks like it works to me.

Confirmed - resolved; checked on cswiki, wmf.28.

@Catrope @Tgr @kostajh -- a reminder to please post on this task the time period that the bug was in production.

The mobile peek was added in rEGREbcc0bd182b42: Guidance: Implement mobile peek which was first included in wmf.23, which was deployed on March 12. (868f78e is the only other somewhat relevant commit I can see, but that just moves code around and doesn't change loading behavior.) So it seems like the error might have started then. I'm not able to reproduce it locally though (something to do with ResourceLoader race conditions due to load.php being slow on Vagrant, I think), so I'm not 100% sure. Also, I understand why the peek would show up (it was executed whenever the help panel was loaded, as long as the geclickid tracking was active) but I don't really understand why it would show up in the weird broken gray version - it seems like all the content should have been loaded just the same even if we are in the editor. Possibly the editor overlay is on top of the drawer overlay (we have seen a similar issue with the homepage overlays) but then it would not be visible at all.

The fix was on May 4 as per T251589#6104205.

Possibly the editor overlay is on top of the drawer overlay (we have seen a similar issue with the homepage overlays) but then it would not be visible at all.

That's indeed what's happening on my local setup. Now that I knew what to look for, I can confirm the issue was present in wmf.23. Still not sure why a part of the drawer appeared on top of the editor overlay in production, and whether that was the case for the full wmf.23 - wmf.28 period. The way it works on my local setup, there is no noticeable change during editing at all, and after cancelling the editor the whole page is grayed out and you need to click to get rid of it (the drawer tries to display but presumably being obscured by the overlay messes up the positioning so the content part is somewhere below the viewport edge). If you save, the grey layer is visible for a very brief moment, but then the page gets reloaded so it disappears.