Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-69454

Use a consistent search input field across all Moodle searches

    XMLWordPrintable

    Details

    • Testing Instructions:
      Hide

      *For reference: Search input styling can be found in the component library.

      1. Navbar search input (please test on theme classic too)

      Login as admin
      Create one course and name it “Dragon training”
      Navigate to “Site Administration > Advanced features”
      Check the “Enable global search” option
      Run cron
      Click the search icon in the to navbar
      *Verify *on clicking the search icon an input field appears
      Verify the keyboard focus is on the search input field
      Type "Dragon" in the input field and press enter
      Verify you are now on the search results page and see your course
      Click the search icon again
      Type something in the input field
      Click the close button
      Verify the search input closes

      2. Navbar search input on mobile

      Reduce the browser size to 320 x 256px
      Verify the search icon is visible in the navbar
      Click the search icon
      Verify the search input opens as an overlay of the navbar
      Click the close button
      Verify the search input disappears

      3. Admin search

      Navigate to Site Administration
      Search for “Theme designer”
      Verify you have found the “Theme designer mode” setting
      Verify the search input box button is blue

      4. Frontpage search

      Navigate to the site homepage
      Click the cog icon and select “Edit Settings”
      On “Front page items when logged in” select “Course search box”
      Save changes
      Search for a course “Dragon training”
      Verify you see the course when clicking the search icon
      Verify the search input box button is blue

      5. Block searches

      Create a new course
      Add the “Blog menu” block
      Add the “Search forums” block
      Add the “Global search” block
      Add the “Administration” block
      Add a blog item
      Create a new forum activity in the course
      Add a forum post
      Verify all search inputs look similar (placeholder is ok to be different)
      Verify all search inputs can do a search

      6. Wiki search

      Add a Wiki activity in your course and create a page with some text
      Verify you see the standard search input in the page header
      Search for a word on your new page
      Verify the search shows a result and the input still holds your search word

      7. Glossary search

      Add a Glossary activity in your course and create a glossary entry with:
      concept: Lorum Ipsum
      Definition: cats and dogs
      Save changes
      On the glossary main page Search for “Lorum”, do not check the “Search full text option”
      Verify the search returns your entry
      Now search for the word “cats”, again do not check the “Search full text option”
      Verify there are no search results
      Search for the work “cats” again and check the “Search full text option”
      Verify the search returns your entry and the input still holds your search word

      8. Forum search

      Add a Forum activity to your course or use an existing forum.
      Create a forum post
      Verify you see the standard search input in the page header
      Search for a word you used in your forum post
      Verify the search shows a result and the input still holds your search word

      9. Message search

      Add a test user (if there are no other users than the admin)
      Open the message drawer
      In the search input search for the user
      Verify the search finds the user
      Verify the search input is styled like a normal search input

      10. Tag search

      Navigate to page /tag/manage.php
      Click the “Default collection” link
      Search for a tag
      Verify the search input shows a result and the input still holds your search word
      Verify the search input is styled like a normal search input
      Click the reset filter link
      Verify the search is cleared and all tags are shown on the page

      11. Capability search

      Navigate to Site administration > Users > Capability overview
      In the search input type “comments”
      Verify on typing a close icon appears
      Verify you see search results related to comments
      Click the close icon
      Verify the search is cleared and the search input field is empty again

      12. Template library

      Navigate to Site administration > Development > Template library
      In the search input type “search_input”
      Verify after typing a close icon appears
      Verify you see search results related to the templates matching “Search_input”
      Click the close icon
      Verify the search is cleared and the search input field is empty

      13. Activity chooser

      Navigate to any course and turn editing on
      Click the “Add an activity or resource” link on the page
      On the activity chooser enter the word “Lesson”
      Verify after typing a close icon appears
      Verify the search finds the lesson activity on typing
      Click the close icon
      Verify the search is cleared and the search input field is empty

      14. Cohort search

      Navigate to site administration > Users > Cohorts
      Create a new cohort named “Group Blue” and save it
      Navigate back to the available cohorts page
      Use the search field to search “Blue”
      Verify the search finds the “Group Blue” cohort*

      15. Content bank search

      Navigate to the site homepage
      Click the contentbank link in the navdrawer
      Upload the 3 h5p files attached to this issue
      On the contentbank page type "Ips"
      Verify after typing a close icon appears
      Verify the Ipsums.h5p file is found
      Click the close icon
      Verify the search is cleared and the search input field is empty

      16. Course backup search

      Create 3 Course Categories: "Math, Language, Arts"
      Create 3 Courses: "Trigonometry, French, Monet"
      Click the cog icon and in the dropdown select "Restore"
      Upload the mbz file attached to this issue
      Click continue until you see the page "Restore as a new course"
      In the search box type "Art"
      Verify only the "Arts" category shows
      Scroll down the page
      In the box "Search courses" type French
      Verify only the "French" course is shown

       

       

       

      Show
      *For reference: Search input styling can be found in the component library . 1. Navbar search input (please test on theme classic too) Login as admin Create one course and name it “Dragon training” Navigate to “Site Administration > Advanced features” Check the “Enable global search” option Run cron Click the search icon in the to navbar *Verify *on clicking the search icon an input field appears Verify the keyboard focus is on the search input field Type "Dragon" in the input field and press enter Verify you are now on the search results page and see your course Click the search icon again Type something in the input field Click the close button Verify the search input closes 2. Navbar search input on mobile Reduce the browser size to 320 x 256px Verify the search icon is visible in the navbar Click the search icon Verify the search input opens as an overlay of the navbar Click the close button Verify the search input disappears 3. Admin search Navigate to Site Administration Search for “Theme designer” Verify you have found the “Theme designer mode” setting Verify the search input box button is blue 4. Frontpage search Navigate to the site homepage Click the cog icon and select “Edit Settings” On “Front page items when logged in” select “Course search box” Save changes Search for a course “Dragon training” Verify you see the course when clicking the search icon Verify the search input box button is blue 5. Block searches Create a new course Add the “Blog menu” block Add the “Search forums” block Add the “Global search” block Add the “Administration” block Add a blog item Create a new forum activity in the course Add a forum post Verify all search inputs look similar (placeholder is ok to be different) Verify all search inputs can do a search 6. Wiki search Add a Wiki activity in your course and create a page with some text Verify you see the standard search input in the page header Search for a word on your new page Verify the search shows a result and the input still holds your search word 7. Glossary search Add a Glossary activity in your course and create a glossary entry with: concept: Lorum Ipsum Definition: cats and dogs Save changes On the glossary main page Search for “Lorum”, do not check the “Search full text option” Verify the search returns your entry Now search for the word “cats”, again do not check the “Search full text option” Verify there are no search results Search for the work “cats” again and check the “Search full text option” Verify the search returns your entry and the input still holds your search word 8. Forum search Add a Forum activity to your course or use an existing forum. Create a forum post Verify you see the standard search input in the page header Search for a word you used in your forum post Verify the search shows a result and the input still holds your search word 9. Message search Add a test user (if there are no other users than the admin) Open the message drawer In the search input search for the user Verify the search finds the user Verify the search input is styled like a normal search input 10. Tag search Navigate to page /tag/manage.php Click the “Default collection” link Search for a tag Verify the search input shows a result and the input still holds your search word Verify the search input is styled like a normal search input Click the reset filter link Verify the search is cleared and all tags are shown on the page 11. Capability search Navigate to Site administration > Users > Capability overview In the search input type “comments” Verify on typing a close icon appears Verify you see search results related to comments Click the close icon Verify the search is cleared and the search input field is empty again 12. Template library Navigate to Site administration > Development > Template library In the search input type “search_input” Verify after typing a close icon appears Verify you see search results related to the templates matching “Search_input” Click the close icon Verify the search is cleared and the search input field is empty 13. Activity chooser Navigate to any course and turn editing on Click the “Add an activity or resource” link on the page On the activity chooser enter the word “Lesson” Verify after typing a close icon appears Verify the search finds the lesson activity on typing Click the close icon Verify the search is cleared and the search input field is empty 14. Cohort search Navigate to site administration > Users > Cohorts Create a new cohort named “Group Blue” and save it Navigate back to the available cohorts page Use the search field to search “Blue” Verify the search finds the “Group Blue” cohort* 15. Content bank search Navigate to the site homepage Click the contentbank link in the navdrawer Upload the 3 h5p files attached to this issue On the contentbank page type "Ips" Verify after typing a close icon appears Verify the Ipsums.h5p file is found Click the close icon Verify the search is cleared and the search input field is empty 16. Course backup search Create 3 Course Categories: "Math, Language, Arts" Create 3 Courses: "Trigonometry, French, Monet" Click the cog icon and in the dropdown select "Restore" Upload the mbz file attached to this issue Click continue until you see the page "Restore as a new course" In the search box type "Art" Verify  only the "Arts" category shows Scroll down the page In the box "Search courses" type French Verify  only the "French" course is shown      
    • Affected Branches:
      MOODLE_310_STABLE, MOODLE_400_STABLE
    • Fixed Branches:
      MOODLE_310_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-69454-master

      Description

      As part of Amaia Anabitarte's project week together with Barbara Ramiro we have started redesigning the search inputs across Moodle

      This tracker issues is about implementing these designs in the Moodle UI

        Attachments

        1. chart-7143-2.h5p
          110 kB
        2. Collage-3065-2.h5p
          646 kB
        3. ipsums.h5p
          1.25 MB
        4. mdl-69454_PR_global_search.gif
          mdl-69454_PR_global_search.gif
          24 kB
        5. Screenshot_1.jpg
          Screenshot_1.jpg
          42 kB
        6. Screenshot_10.jpg
          Screenshot_10.jpg
          27 kB
        7. Screenshot_2.jpg
          Screenshot_2.jpg
          38 kB
        8. Screenshot_3.jpg
          Screenshot_3.jpg
          83 kB
        9. Screenshot_4.jpg
          Screenshot_4.jpg
          78 kB
        10. Screenshot_5.jpg
          Screenshot_5.jpg
          46 kB
        11. Screenshot_6.jpg
          Screenshot_6.jpg
          40 kB
        12. Screenshot_7.jpg
          Screenshot_7.jpg
          84 kB
        13. Screenshot_8.jpg
          Screenshot_8.jpg
          32 kB
        14. Screenshot_9.jpg
          Screenshot_9.jpg
          78 kB
        15. Search Icon w_ Close Icon, Standard Icon Button (Proposed).pdf
          46 kB
        16. Search Menu w_ Close Icon (Proposed).pdf
          73 kB
        17. Search w_ Empathised Button (Proposed).pdf
          49 kB
        18. Search w_ Standard Button (Proposed).pdf
          53 kB

          Activity

            People

            Assignee:
            basbrands Bas Brands
            Reporter:
            basbrands Bas Brands
            Peer reviewer:
            Ferran Recio
            Integrator:
            Eloy Lafuente (stronk7)
            Tester:
            Janelle Barcega
            Participants:
            Component watchers:
            Bas Brands
            Votes:
            1 Vote for this issue
            Watchers:
            7 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved:
              Fix Release Date:
              9/Nov/20

                Time Tracking

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 1 week, 5 hours, 25 minutes
                1w 5h 25m