Page MenuHomePhabricator

Mobile Homepage: Show module details in a mobile overlay
Closed, ResolvedPublic

Description

This task is about enhancing the basic version (T222832) so that the details of each module is shown in a mobile overlay instead of as a separate page.

The overlays will look and feel like all other mobile overlays.

See parent task for detailed specs.

Event Timeline

Change 514614 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@master] (wip) Show module details in mobile overlays

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

Change 514614 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Homepage: Show module details in MobileFrontend overlay

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

Change 517577 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@master] Show spinner when loading overlay content

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

There is a strange behavior for back button when the back button is clicked from Mentorship/Help popup.
@kostajh - need your opinion on

  • whether the present behavior of back button is expected (and acceptable)
  • could it be a regression of some sort?
  1. Click 'Your mentor' module, then click 'Ask your mentor a question' (the same behavior for the "Get help with editing" module).
  2. A popup form will be present - click on the Back button - instead of going back, no navigation action happens. Instead the forward button becomes active but clicking on it does not provide any navigation either.

The screen recording shows no navigation actions when back/forward buttons are clicked.

  1. If the back button clicked one more time - it goes back to the side menu that some time occupies the whole screen:

IMG_7739.PNG (1×640 px, 53 KB)

It's worth noting that the same problem exists for the help panel -- try editing a page on mobile, opening the help panel, then tapping back. (See also T215430) I'll create a new task for fixing this behavior, and will move this task back into QA.

Change 517577 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Show spinner when loading overlay content

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

Since navigation issues will be covered in a separate task, I'm moving it to Design Review column.

The modals containing modules details successfully open up but there is a potentially critical visual bug:

  • The module title is aligned to left, which makes it misleading to understand if that's the title of the currently shown module or the title of the previous screen, which the arrow is pointing at.

Screenshot 2019-06-20 19.33.29.png (1×754 px, 123 KB)

  • As per mockups the title should be center aligned

Screenshot 2019-06-20 19.39.00.png (1×692 px, 121 KB)

Moving the task to "Needs PM Review" for @MMiller_WMF to decide about task priority.

Thanks, @Cntlsn. That alignment is not a blocker for release, but is an important design element that we should fix. I am moving this to "In Progress".

Change 518270 had a related patch set uploaded (by Sbisson; owner: Sbisson):
[mediawiki/extensions/GrowthExperiments@master] Mobile overlay: align title on center

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

Thanks, @Cntlsn. That alignment is not a blocker for release, but is an important design element that we should fix. I am moving this to "In Progress".

I've made a patch for it.

Change 518270 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Mobile overlay: align title on center, make bold

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

This is working well in production. Resolved.