Page MenuHomePhabricator

MFA: TalkSectionAddOverlay should use Overlay.make pattern
Open, HighPublic

Description

Following on from T215370 we will begin removing inheritance in the TalkSectionAddOverlay.

The TalkSectionAddOverlay currently extends Overlay. It is another rather simplistic overlay.

It is an overlay which contains three Panel views, each containing some text, an input and a textarea!
Let's create a new component (proposed name UserInput) that contains these 3.

Acceptance criteria

  • The TalkSectionAddOverlay is replaced with a factory function (maybe this is the same factory function in mobile.startup/talk/overlay but takes an additional parameter ?
  • The factory function lives inside mobile.startup
  • The overlay for #/talk/new loads instantly without a LoadingOverlay.
  • The factory function that loads the UserInput component, its i18n message and the code to wire it up with appropriate events is inside mobile.talk.overlays ResourceLoader module off the critical path
  • The new components do not use templatePartials property on View
  • Inline templates that are necessary, drop any that are redundant (e.g. the header templatePartial)
  • The event bus is probably not needed any more. Consider replacing the talk-added-wo-overlay, talk-discussion-added events with a callback inside skins.minerva.talk/init.js that updates the parent talk overlay directly.
  • All changes are backwards compatible. For every patch merged the add talk topic overlay is kept in tact.
  • All code touched as part of this change has 100% code coverage or a good explanation to why it's not exactly 100%.
  • The size of the mobile.startup module remains more or less the same.

QA steps

Scenario 1: A successful save:

Scenario 2: A failed save:

  • Login
  • Visit https://reading-web-staging.wmflabs.org/w/index.php?title=Spain&mobileaction=toggle_view_mobile#/talk/new
  • Fill in details of a topic
  • Drop your internet connection to 2g using your browsers developer tools (network tab)
  • Verify that on hitting save the form save button disables and inputs are not selectable
  • Quickly click the offline checkbox
  • Verify that the save button is enabled again and you can type in inputs again
  • Do this a few times
  • Verify that when your connection is normal the save finally goes through
  • Confirm the new talk topic shows on the list of talk topics

Sign off steps

Details

Related Gerrit Patches:
mediawiki/skins/MinervaNeue : masterCreate addTopicOverlay the non-deprecated way
mediawiki/extensions/MobileFrontend : masterRevert "Generalise a CSS rule for paragraphs within panels"
mediawiki/extensions/MobileFrontend : masterGeneralise a CSS rule for paragraphs within panels
mediawiki/extensions/MobileFrontend : masterReplace TalkSectionAddOverlay with factory function and new component
mediawiki/extensions/MobileFrontend : masterAdd the AddTopicForm component
mediawiki/extensions/MobileFrontend : masterPrepare for a talk topic form component
mediawiki/extensions/MobileFrontend : masterDon't duplicate panel rules
mediawiki/extensions/MobileFrontend : masterDrop unused View parameter
mediawiki/extensions/MobileFrontend : masterMark a unit test as async
mediawiki/skins/MinervaNeue : masterMinerva should use the MobileFrontend eventBusSingleton
mediawiki/extensions/MobileFrontend : masterGeneralise some textarea rules
mediawiki/extensions/MobileFrontend : masterProvide a way to prevent overlay closing without extending prototype
mediawiki/extensions/MobileFrontend : masterImprove overlay header building

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes
Jdlrobson triaged this task as High priority.Feb 25 2019, 11:48 PM
Jdlrobson moved this task from Incoming to Upcoming on the Readers-Web-Backlog board.
Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)Feb 26 2019, 5:39 PM
Jdlrobson raised the priority of this task from High to Needs Triage.Feb 26 2019, 7:09 PM

@Jdlrobson I'm a huge fan of those QA steps!

phuedx removed a subscriber: phuedx.Feb 27 2019, 12:00 PM
Jdlrobson triaged this task as High priority.Feb 27 2019, 6:10 PM

Change 493624 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] WIP: Replace TalkSectionAddOverlay with factory function and new component

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

Change 493726 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Minerva should use the MobileFrontend eventBusSingleton

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

Change 493742 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Create addTopicOverlay the non-deprecated way

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

Change 493747 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Improve overlay header building

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

Change 493755 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Provide a way to prevent overlay closing without extending prototype

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

Change 493757 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Generalise some textarea rules

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

Change 493747 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Improve overlay header building

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

Change 493755 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Provide a way to prevent overlay closing without extending prototype

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

Change 493757 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Generalise some textarea rules

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

Jdlrobson removed Jdlrobson as the assignee of this task.Mar 6 2019, 1:35 AM
Jdlrobson renamed this task from TalkSectionAddOverlay is an Overlay to MFA: TalkSectionAddOverlay should use Overlay.make pattern.Mar 6 2019, 6:18 PM
Jdlrobson added a project: Technical-Debt.

Change 493726 merged by jenkins-bot:
[mediawiki/skins/MinervaNeue@master] Minerva should use the MobileFrontend eventBusSingleton

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

Change 494844 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Mark a unit test as async

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

Change 494844 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Mark a unit test as async

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

Change 496546 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Drop unused View parameter

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

Change 496547 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Generalise a CSS rule for paragraphs within panels

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

Change 496548 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Don't duplicate panel rules

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

Change 496549 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Prepare for a talk topic form component

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

Change 496550 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Add the AddTopicForm component

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

Change 496546 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Drop unused View parameter

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

Change 496548 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Don't duplicate panel rules

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

Change 496549 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Prepare for a talk topic form component

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

Change 496547 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Generalise a CSS rule for paragraphs within panels

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

ovasileva assigned this task to pmiazga.Mar 20 2019, 5:19 PM

Change 496550 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Add the AddTopicForm component

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

Change 493742 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Create addTopicOverlay the non-deprecated way

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

Moving back to sprint for more analysis/reflection on how these changes can be made more effortlessly. I certainly have learned a lot about the challenges from this task about dissecting our current code.

Jdlrobson removed the point value for this task.Mar 22 2019, 8:12 PM

reseting story points

Jdlrobson claimed this task.May 1 2019, 9:02 PM
Jdlrobson added a subscriber: pmiazga.

JR to review the acceptance criteria based on work done and adjust description accordingly.

Change 493624 abandoned by Jdlrobson:
Replace TalkSectionAddOverlay with factory function and new component

Reason:
This approach fizzled out.

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

Change 529472 had a related patch set uploaded (by Esanders; owner: Esanders):
[mediawiki/extensions/MobileFrontend@master] Revert "Generalise a CSS rule for paragraphs within panels"

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

Change 529472 abandoned by Bartosz Dziewoński:
Revert "Generalise a CSS rule for paragraphs within panels"

Reason:
Superseded by https://gerrit.wikimedia.org/r/531324

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

Change 493742 abandoned by Jdlrobson:
Create addTopicOverlay the non-deprecated way

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