Page MenuHomePhabricator

Build search/depicts prototype
Closed, ResolvedPublic

Description

Implement a prototype for searching depicts based off of these designs:

Acceptance criteria:

This can be tested on https://federated-commons.wmflabs.org/wiki/Main_Page

  • The is a search widget (input field, media types dropdown, submit button) top-right
  • Clicking input field reveals menu to toggle input modes (keywords & tags)
  • Selecting on of the input modes changes the input field to said mode
  • "keywords" input mode shows autocomplete after 2 or more characters have been input
  • When selecting from autocomplete, "keyword" input field receives text from autocomplete; adding more characters fires new autocomplete results that replace the existing text
  • "tags" input mode shows autocomplete after 2 or more characters have been input
  • When selecting from autocomplete, "tags" input field receives text from autocomplete in a capsule; adding more characters fires a new autocomplete result to add a new capsule
  • Clicking a capsule in "tags" input mode opens a popover window
  • A property can be selected, after which the operators dropdown is enabled with "is", "is not" and "is empty" options
  • When property "quantity" is selected, "is greater than" and "is less than" are additional options
  • An operator can be selected, after which the value input field is enabled (except for "is empty", which requires no value)
  • Typing a value behaves like the "keywords" dropdown (autocomplete, selecting from it fills the input field)
  • Unless the value is something that has been selected from the autocomplete, the input field will indicate (red border & text) that the input is invalid when blurred
  • For "quantity", the value can only be a number
  • Clicking "Add qualifier" adds another property-operator-input line
  • Clicking "save" closes the popover and adds an asterisk to the capsule in the search input field (if properties have been added)
  • After having clicked "save", clicking the capsule again opens the popover with any existing valid input
  • Clicking "cancel" closes the popover
  • After having clicked "cancel", clicking the capsule again opens the popover without the changes that were canceled (but may include earlier changes that had been saved)
  • The media types dropdown allows selecting any combination of media types
  • Hitting the return key inside the input field (both "keywords" and "tags") submits the search form, taking the user to Special:Search
  • Clicking the submit button (search icon) submits the search form, taking the user to Special:Search
  • The correct results are displayed (note: results for anything inside the properties popover can't really be tested ATM, since adding qualifiers to depicts statements has not yet been enabled)

QA Results

Related Objects

StatusAssignedTask
Declineddchen
OpenNone
OpenNone
DuplicateNone
OpenNone
ResolvedAbit
OpenNone
DuplicateNone
OpenNone
OpenNone
OpenNone
OpenNone
OpenNone
ResolvedRamsey-WMF
Resolvedmatthiasmullie
Resolvedmatthiasmullie
Resolvedmatthiasmullie
Resolvedmatthiasmullie

Event Timeline

Restricted Application added a project: Multimedia. · View Herald TranscriptJul 9 2018, 3:54 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript

Change 441040 had a related patch set uploaded (by Matthias Mullie; owner: Matthias Mullie):
[mediawiki/extensions/WikibaseMediaInfo@master] Search prototype

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

Ramsey-WMF triaged this task as High priority.Mar 8 2019, 4:25 PM
Ramsey-WMF moved this task from Untriaged to Next up on the Multimedia board.

Change 441040 had a related patch set uploaded (by Matthias Mullie; owner: Matthias Mullie):
[mediawiki/extensions/WikibaseMediaInfo@master] Search prototype

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

Change 441040 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Search prototype

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

matthiasmullie updated the task description. (Show Details)

Test Result

Status: ✅ PASS
OS: macOS Mojave
Browser: Chrome

Test Artifact(s):

This can be tested on https://federated-commons.wmflabs.org/wiki/Main_Page

✅ AC1: The is a search widget (input field, media types dropdown, submit button) top-right
✅ AC2: Clicking input field reveals menu to toggle input modes (keywords & tags)
✅ AC3: Selecting on of the input modes changes the input field to said mode
✅ AC4: "keywords" input mode shows autocomplete after 2 or more characters have been input
✅ AC5: When selecting from autocomplete, "keyword" input field receives text from autocomplete; adding more characters fires new autocomplete results that replace the existing text

✅ AC6: "tags" input mode shows autocomplete after 2 or more characters have been input
✅ AC7: When selecting from autocomplete, "tags" input field receives text from autocomplete in a capsule; adding more characters fires a new autocomplete result to add a new capsule
✅ AC8: Clicking a capsule in "tags" input mode opens a popover window
✅ AC9: A property can be selected, after which the operators dropdown is enabled with "is", "is not" and "is empty" options

✅ AC10: When property "quantity" is selected, "is greater than" and "is less than" are additional options
✅ AC11: An operator can be selected, after which the value input field is enabled (except for "is empty", which requires no value)


✅ AC12: Typing a value behaves like the "keywords" dropdown (autocomplete, selecting from it fills the input field)
✅ AC13: Unless the value is something that has been selected from the autocomplete, the input field will indicate (red border & text) that the input is invalid when blurred


✅ AC14: For "quantity", the value can only be a number
✅ AC15: Clicking "Add qualifier" adds another property-operator-input line

✅ AC16: Clicking "save" closes the popover and adds an asterisk to the capsule in the search input field (if properties have been added)

✅ AC17: After having clicked "save", clicking the capsule again opens the popover with any existing valid input

✅ AC18: Clicking "cancel" closes the popover
Added qualifiers and then clicked Cancel.

✅ AC19: After having clicked "cancel", clicking the capsule again opens the popover without the changes that were canceled (but may include earlier changes that had been saved)
Previously added but not saved qualifiers are gone.

✅ AC20: The media types dropdown allows selecting any combination of media types

✅ AC21: Hitting the return key inside the input field (both "keywords" and "tags") submits the search form, taking the user to Special:Search

✅ AC22: Clicking the submit button (search icon) submits the search form, taking the user to Special:Search

✅ AC23: The correct results are displayed (note: results for anything inside the properties popover can't really be tested ATM, since adding qualifiers to depicts statements has not yet been enabled)

Edtadros updated the task description. (Show Details)Mar 30 2019, 3:58 AM
Edtadros reassigned this task from Edtadros to Ramsey-WMF.
Edtadros added subscribers: Ramsey-WMF, Edtadros.

@Ramsey-WMF This all passes.

Thanks, Edward! This one is a little weird process-wise because it's still going through user testing. Depending on user feedback, I'll either close this and we'll make a new ticket reflecting redesign, or confirm that existing behavior is what we're going with and move this to Verify on Production.

Ramsey-WMF closed this task as Resolved.Apr 10 2019, 5:01 PM

As promised, since it looks like we're going to tweak this and go in a different direction, going to close this one and start new ticket(s) when we have made more decisions on what's next.

Thanks, Edward! This one is a little weird process-wise because it's still going through user testing. Depending on user feedback, I'll either close this and we'll make a new ticket reflecting redesign, or confirm that existing behavior is what we're going with and move this to Verify on Production.