Page MenuHomePhabricator

Username input field should allow auto-completion of usernames
Closed, ResolvedPublic

Description

The username input field is currently a plain text field. It should instead use Lookup field to autocomplete a username via MW API.

Prior art, for engineering reference: GrowthExperiments Mentee selection.

Acceptance criteria:

  • Username field does a lookup using the MW API for listing all users
  • Submitting the form posts the username
  • API should reject non-existent usernames (but accept IP addresses)
  • Only allow selecting a single username

Event Timeline

There is a Lookup component example in GrowthExperiments, that searches for Mentees. We can adapt that to work for this field.

Change 964565 had a related patch set uploaded (by Dreamy Jazz; author: Dreamy Jazz):

[mediawiki/extensions/ReportIncident@master] [WIP] Validate username in the username field

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

Change 964565 merged by jenkins-bot:

[mediawiki/extensions/ReportIncident@master] Suggest usernames for the reported username field

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

Suggested QA steps:

  1. Install the ReportIncident (if not already installed)
  2. Log into an account that has not submitted a report in the last day
  3. Open a user talk page
  4. Click on the "Report" link in the "Tools" menu
  5. Navigate to the second step of the dialog (with the form)
  6. Enter a single character into the reported user field (such as a)
  7. Verification step 1: Verify that suggested usernames starting with that character appear
  8. Enter a random long string of characters in to the reported user field
  9. Verification step 2: Verify that no suggested username appears (because such a username does not exist).
  10. Copy a username for an existing account and paste it into the reported user field
  11. Verification step 3: Verify that the username you pasted in appears in the suggested usernames list as the first item
  12. Click on the suggested username.
  13. Fill in the rest of the form
  14. Open DevTools (or inspect element), and navigate to the Network tab
  15. Submit the form
  16. Verification step 4: Verify that dialog closes
  17. Verification step 5: Verify that request body includes 'reportedUser': 'username' where the text username is the username you entered in step 10.

Test wiki created on Patch demo by DJacksonA using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/0ca007bc0f/w

I have verified the Username Input Field will allow autocompletion of Usernames, and the user's form data includes the correct details for the 'reportedUser" and that also includes the remaining user-inserted details of the form, in addition to those items I also verified the remaining functionality of the form was working as expected.
Great work as always @Dreamy_Jazz, and thank you for the QA Steps!!!!

Screenshot below shows the DevTools - Network - Request Body Details of the user's form data that was pulled from page 2 of the Report Incident:

image.png (940×1 px, 724 KB)


Screenshots below shows the Suggested Usernames Listing:

image.png (890×450 px, 247 KB)

image.png (611×926 px, 222 KB)

image.png (887×1 px, 98 KB)

Test wiki on Patch demo by DJacksonA using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/0ca007bc0f/w/