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

Update general Moodle navigation

XMLWordPrintable

    • MOODLE_400_STABLE
    • MOODLE_400_STABLE
    • Navigation improvements 4.0
    • primary_secondary_nav
    • Hide

      Behat & PHPUnit passes.

       testing instructions

      Test 1: Convert user menu to use templates

      1. Check the user menu on the top right, making sure that all the links and images are rendered correctly.
      2. Additional scenarios, log in as admin:
        1. Switch roles
        2. Switch users (Log in as)
        3. User with incorrect login attempts before successful (require config update)
          1. Set 'displayloginfailures'  to true in Site admin OR in config.php
          2. Log out 
          3. Attempt to log in as admin using an incorrect password
          4. Log in as admin using the correct password
          5. Confirm you see the user menu on the top right
          6. Confirm you see the following text below the user name

            1 failed logins since your last login

      Test 2: Create a module-based navigation bar

      1. Go to any site administration page.
      2. Check that the breadcrumb navigation bar is not present.
      3. Go to a course that is using the topics course format.
      4. Add an assignment to the course.
      5. Click on the assignment
      6. Check that the last item in the breadcrumb is never a link.
      7. Check that all other items in the breadcrumb are always links.
      8. Navigate to other pages and check that testing steps 6, 7, and 8 are always true (unless in site administration pages).

      Test 3: Update the context_header in Boost to move the breadcrumb to the top.

      1. If there is a breadcrumb check that it is above the course name.
      2. Create an activity, or go into an existing one.
      3. Check that the breadcrumb is above the icon and activity title.
      4. Check that the activity type is above the activity title and is a grey colour.

      Test 4: No navigation tab as a student & Define the secondary navigation nodes that should be always displayed in the more menu in the module context

      1. Create a course with every activity type available
      2. Enrol a student
      3. Log in as a student
      4. Check every activity
      5. Confirm there are no activities with a single tab available
        1. A module can have the following (Activity, Subscribe to this forum) or (Activity, Print this chapter) - These items will be reviewed further in tertiary navigation followups.
      6. Log in as a teacher
      7. Browse each activity type.
      8. Confirm at most there is only 5 regular navigation nodes and a more node within an activity.
      9. Confirm that the following options only ever appear within the more menu
        • Filters
        • Permissions
        • Check permissions
        • Logs
        • Locally assigned roles
        • Backup
        • Restore
        • Competency breakdown

      Test 5 (Language selector is NOT available when there aren't multiple installed languages)

      1. Log in as Admin.
      2. Go to "Site administration > Language > Language Packs" and make sure that no additional language packs are installed (only English)
      3. Examine the main top navbar on the page
        • confirm there is no language selector menu in the top navbar
      4. Open the user dropdown menu in the top navbar
        • confirm there isn't a "Language" item in the user menu.
      5. Log out.
        • confirm there is no language selector menu anywhere in the top navbar

      Test 6 (Language selector is available when there are multiple installed languages)

      1. Log in as Admin.
      2. Go to "Site administration > Language > Language Packs" and install several additional language packs (make sure to install at least one RTL language pack ex. Hebrew).
      3. Examine the main top navbar on the page.
        • confirm there is no language selector menu in the top navbar
      4. Open the user dropdown menu in the top navbar
        • confirm there is a "Language" item in the user menu.
      5. Click on the Language item in the user menu.
        • confirm that a "Language selector" menu is now displayed within the user menu element.
        • confirm that all available (installed) languages are displayed in the selector.
        • confirm that there is an indicator (check) on the language that is currently active.
      6. Select one of the available languages.
        • confirm that the page is reloaded and the language change applied.
      7. Open again the Language selector from the user menu
        • confirm that the "active" indicator is now pointing to the previously selected language.
      8. Click on the "Back" link (arrow icon) in the Language selector menu
        • confirm that it navigates back to the user menu
      9. Go back to the Language selector again and select the installed RTL language
        • confirm that the language change has been applied.
      10. Open the the user menu and the language selector.
        • confirm that everything looks and works as expected in RTL mode.
      11. Log out.
      12. Examine the main top navbar on the page.
        • confirm that there is a language selector dropdown menu in the top navbar.
      13. Click on the language selector menu in the top navbar.
        • confirm that all available (installed) languages are displayed in the language dropdown menu.
        • confirm that there is an indicator (check) on the language that is currently active.
      14. Select one of the available languages.
        • confirm that the page is reloaded and the language change applied.

      Test 7 (Language selector is NOT available when a language is "forced" in a course context)

      1. Log in as Admin.
      2. Go to the Course.
      3. Go to Course settings.
      4. In the 'Appearance' section, select a certain language from the list in 'Force language' and save changes.
      5. While in the course, open the user menu in the top navbar.
        • confirm that the Language selector is NOT present in the user menu.
      6. Navigate through the course and its activities.
        • each time confirm that the Language selector is NOT present in the user menu.
      7. Navigate somewhere outside of the Course (ex. Dashboard or Site home)
      8. Open the user menu in the top navbar.
        • confirm that the Language selector is present in the user menu.
      9. Go back to the Course
      10. Go to Course settings.
      11. In the 'Appearance' section, set 'Force language' to 'Do not force' and save changes.
      12. While still in the course, open the user menu in the top navbar.
        • confirm that the Language selector is present in the user menu.

      Test 8: Create a landing page for the reports link in the secondary navigation

      Basic Setup

      Here in this setup, we focus to create what we get as default in the course administration report page.

      1. Log in as Admin.
      2. Create a course: course1 (Short name: course1)

      Basic Test

      1. Go to the course, course1.
      2. Confirm that the "Reports" tab is seen in the secondary navigation.
      3. Click on the "Reports" tab in the secondary navigation, it should take you to the reports page.
      4. The user should see a drop-down selector on the log page. (similar to the grades page, of course).
      5. From the drop-down select any of them, it should take you to that report page.
      6. By default, the drop-down would have "Competency breakdown", "Logs", "Live logs", "Activity report", and "Course participation". You can test the same navigating to all the pages by selecting the ones here.

      There are some report pages that get created by editing the settings. And below are the list of tests that help us verify those report pages which would be shown on the course report page.

      Setup for Activity completion report page

      1. Login as admin
      2. Go to the Course, course1.
      3. Enrol a student: s1 to the course.
      4. Go back to the Course, course1.
      5. Now click on the "Turn editing on" button.
      6. Add an activity: Quiz
      7. Make sure the "Activity completion": "Completion tracking" has "Students can manually mark the activity as completed"
      8. Now edit the quiz, by clicking the "Add" > "Choose a question type to add" > "True/False".
      9. Add a quiz of your choice and then select the True or False as the answer for them accordingly.
      10. Now login as a student: s1
      11. Go to the course, course1
      12. Mark the quiz as complete by ticking the button "Mark as done" button.

      Test for the activity completion report

      1. Login as admin
      2. Go to the Course, course1 and click on the "Reports" tab found in the secondary navigation.
      3. You should see "Activity completion" along with other pages listed in the "Reports".
      4. Now click on the "Activity completion", it should take you to the "Activity completion page" and the user should see a drop-down selector that allows them to navigate to the other report pages in the course.

      Setup for course completion report page

      1. Login as admin
      2. Go to the course1
      3. Click on "More" seen in the secondary navigation and then select "Course completion"
      4. In "Condition: Manual self-completion" tick the "Enable" checkbox.

      Test for the course completion report

      1. Login as admin
      2. Navigate to course, course1 and click on the "Reports" tab in the secondary navigation.
      3. Click on the drop-down menu available on the "Reports" page.
      4. You should see "Course completion" along with other pages listed in the "Reports".
      5. Navigate to the "Course completion" by clicking the link. The user should see the "Course completion" page. The user should also see a drop-down selector.
      6. The "Courses" > "course1" > "Reports" should now point to the "Course completion page".

      Setup statistics on the course report page

      1. Login as admin
      2. Navigate to "Site administration" > Advanced features
      3. Tick the "Enable statistics"

      Test for course statistics report

      1. Login as admin
      2. Navigate to Course, course1 and click on the "Reports" tab on the secondary navigation. This should take you to the reports page.
      3. You should see "Statistics" along with other options listed in the drop-down under the "Reports" tab (i.e, on the reports page)
      4. Select the "Statistics" from the drop-down. The user should see the "Statistics" page. The user should see a drop-down selector.
      5. The "Courses" > "course1" > "Reports" should now point to the "Statistics".

      Setup Event monitoring rules page

      1. Login as admin
      2. Navigate to Site administration > Reports > Event monitoring rules.
      3. Click the "Enable" link.
      4. The idea here is to just check the page, so I have not created any rules.

      Test for course event monitoring report

      1. Login as admin
      2. Navigate to Course, course and click on the "Reports" tab on the secondary navigation. This should take you to the reports page.
      3. You should see "Event monitoring rules" along with other options listed in the drop-down on the reports page.
      4. Select "Event monitoring rules" from the drop-down. The user should see the "Event monitoring rules" page. The user should also see a drop-down selector.
      5. The "Courses" > "course1" > "Reports" should now point to the "Event monitoring rules".

      Setup insight report page

      1. Login as admin
      2. Set "Debug messages" = "DEVELOPER ..." (Site administration > Development > Debugging)
      3. Create an M size test Course (Site administration > Development > Make test course)
      4. Go to Site administration > Analytics > Analytics settings
        1. Set the "Analytics process execution via command line only" = "No"
        2. Save changes
      5. Go to Site administration > Analytics > Analytics models
      6. Edit the "Students who have not accessed the course yet" model
        1. Set Analysis interval = 10% after the start
        2. Save changes go back to Analytics models page (do not close this browser tab)
      7. Open a new tab and go to the Course
      8. Edit the course
        1. Set the course start date to one minute ago
        2. Set the course end date to five minutes in the future
      9. Go back to the Analytics models page tab
      10. In the actions menu for "Students who have not accessed the course yet" click on "Execute scheduled analysis"

      Test for course insight report

      1. Login as admin
      2. Navigate to Course, cours1 and click on the "Reports" tab on the secondary navigation. This should take you to the reports page.
      3. You should see "Insights" along with other options listed in the drop-down on the reports page.
      4. Select "Insights" from the drop-down. The user should see the "Insights" page. The user should also see a drop-down selector. 
      5. The "Courses" > "course1" > "Reports" should now point to the "Insights".
      Show
      Behat & PHPUnit passes.  testing instructions Test 1: Convert user menu to use templates Check the user menu on the top right, making sure that all the links and images are rendered correctly. Additional scenarios, log in as admin: Switch roles Switch users ( Log in as ) User with incorrect login attempts before successful (require config update) Set ' displayloginfailures'   to true in Site admin OR in config.php Log out  Attempt to log in as admin using an incorrect password Log in as admin using the correct password Confirm you see the user menu on the top right Confirm you see the following text below the user name 1 failed logins since your last login Test 2: Create a module-based navigation bar Go to any site administration page. Check that the breadcrumb navigation bar is not present. Go to a course that is using the topics course format. Add an assignment to the course. Click on the assignment Check that the last item in the breadcrumb is never a link. Check that all other items in the breadcrumb are always links. Navigate to other pages and check that testing steps 6, 7, and 8 are always true (unless in site administration pages). Test 3: Update the context_header in Boost to move the breadcrumb to the top. If there is a breadcrumb check that it is above the course name. Create an activity, or go into an existing one. Check that the breadcrumb is above the icon and activity title. Check that the activity type is above the activity title and is a grey colour. Test 4: No navigation tab as a student & Define the secondary navigation nodes that should be always displayed in the more menu in the module context Create a course with every activity type available Enrol a student Log in as a student Check every activity Confirm there are no activities with a single tab available A module can have the following (Activity, Subscribe to this forum) or (Activity, Print this chapter) - These items will be reviewed further in tertiary navigation followups. Log in as a teacher Browse each activity type. Confirm at most there is only 5 regular navigation nodes and a more node within an activity. Confirm that the following options only ever appear within the more menu Filters Permissions Check permissions Logs Locally assigned roles Backup Restore Competency breakdown Test 5 (Language selector is NOT available when there aren't multiple installed languages) Log in as Admin. Go to "Site administration > Language > Language Packs" and make sure that no additional language packs are installed (only English) Examine the main top navbar on the page confirm there is no language selector menu in the top navbar Open the user dropdown menu in the top navbar confirm there isn't a "Language" item in the user menu. Log out. confirm there is no language selector menu anywhere in the top navbar Test 6 (Language selector is available when there are multiple installed languages) Log in as Admin. Go to "Site administration > Language > Language Packs" and install several additional language packs (make sure to install at least one RTL language pack ex. Hebrew). Examine the main top navbar on the page. confirm there is no language selector menu in the top navbar Open the user dropdown menu in the top navbar confirm there is a "Language" item in the user menu. Click on the Language item in the user menu. confirm that a "Language selector" menu is now displayed within the user menu element. confirm that all available (installed) languages are displayed in the selector. confirm that there is an indicator (check) on the language that is currently active. Select one of the available languages. confirm that the page is reloaded and the language change applied. Open again the Language selector from the user menu confirm that the "active" indicator is now pointing to the previously selected language. Click on the "Back" link (arrow icon) in the Language selector menu confirm that it navigates back to the user menu Go back to the Language selector again and select the installed RTL language confirm that the language change has been applied. Open the the user menu and the language selector. confirm that everything looks and works as expected in RTL mode. Log out. Examine the main top navbar on the page. confirm that there is a language selector dropdown menu in the top navbar. Click on the language selector menu in the top navbar. confirm that all available (installed) languages are displayed in the language dropdown menu. confirm that there is an indicator (check) on the language that is currently active. Select one of the available languages. confirm that the page is reloaded and the language change applied. Test 7 (Language selector is NOT available when a language is "forced" in a course context) Log in as Admin. Go to the Course. Go to Course settings. In the 'Appearance' section, select a certain language from the list in 'Force language' and save changes. While in the course, open the user menu in the top navbar. confirm that the Language selector is NOT present in the user menu. Navigate through the course and its activities. each time confirm that the Language selector is NOT present in the user menu. Navigate somewhere outside of the Course (ex. Dashboard or Site home) Open the user menu in the top navbar. confirm that the Language selector is present in the user menu. Go back to the Course Go to Course settings. In the 'Appearance' section, set 'Force language' to 'Do not force' and save changes. While still in the course, open the user menu in the top navbar. confirm that the Language selector is present in the user menu. Test 8: Create a landing page for the reports link in the secondary navigation Basic Setup Here in this setup, we focus to create what we get as default in the course administration report page. Log in as Admin. Create a course: course1 (Short name: course1) Basic Test Go to the course, course1. Confirm that the "Reports" tab is seen in the secondary navigation. Click on the "Reports" tab in the secondary navigation, it should take you to the reports page. The user should see a drop-down selector on the log page. (similar to the grades page, of course). From the drop-down select any of them, it should take you to that report page. By default, the drop-down would have "Competency breakdown", "Logs", "Live logs", "Activity report", and "Course participation". You can test the same navigating to all the pages by selecting the ones here. There are some report pages that get created by editing the settings. And below are the list of tests that help us verify those report pages which would be shown on the course report page. Setup for Activity completion report page Login as admin Go to the Course, course1. Enrol a student: s1 to the course. Go back to the Course, course1. Now click on the "Turn editing on" button. Add an activity: Quiz Make sure the "Activity completion": "Completion tracking" has "Students can manually mark the activity as completed" Now edit the quiz, by clicking the "Add" > "Choose a question type to add" > "True/False". Add a quiz of your choice and then select the True or False as the answer for them accordingly. Now login as a student: s1 Go to the course, course1 Mark the quiz as complete by ticking the button "Mark as done" button. Test for the activity completion report Login as admin Go to the Course, course1 and click on the "Reports" tab found in the secondary navigation. You should see "Activity completion" along with other pages listed in the "Reports". Now click on the "Activity completion", it should take you to the "Activity completion page" and the user should see a drop-down selector that allows them to navigate to the other report pages in the course. Setup for course completion report page Login as admin Go to the course1 Click on "More" seen in the secondary navigation and then select "Course completion" In "Condition: Manual self-completion" tick the "Enable" checkbox. Test for the course completion report Login as admin Navigate to course, course1 and click on the "Reports" tab in the secondary navigation. Click on the drop-down menu available on the "Reports" page. You should see "Course completion" along with other pages listed in the "Reports". Navigate to the "Course completion" by clicking the link. The user should see  the "Course completion" page. The user should also see a drop-down selector. The "Courses" > "course1" > "Reports" should now point to the "Course completion page". Setup statistics on the course report page Login as admin Navigate to "Site administration" > Advanced features Tick the "Enable statistics" Test for course statistics report Login as admin Navigate to Course, course1 and click on the "Reports" tab on the secondary navigation. This should take you to the reports page. You should see "Statistics" along with other options listed in the drop-down under the "Reports" tab (i.e, on the reports page) Select the "Statistics" from the drop-down. The user should see  the "Statistics" page. The user should see a drop-down selector. The "Courses" > "course1" > "Reports" should now point to the "Statistics". Setup Event monitoring rules page Login as admin Navigate to Site administration > Reports > Event monitoring rules. Click the "Enable" link. The idea here is to just check the page, so I have not created any rules. Test for course event monitoring report Login as admin Navigate to Course, course and click on the "Reports" tab on the secondary navigation. This should take you to the reports page. You should see "Event monitoring rules" along with other options listed in the drop-down on the reports page. Select "Event monitoring rules" from the drop-down. The user should see  the "Event monitoring rules" page. The user should also see a drop-down selector. The "Courses" > "course1" > "Reports" should now point to the "Event monitoring rules". Setup insight report page Login as admin Set "Debug messages" = "DEVELOPER ..." (Site administration > Development > Debugging) Create an M size test Course (Site administration > Development > Make test course) Go to Site administration > Analytics > Analytics settings 1. Set the "Analytics process execution via command line only" = "No" 2. Save changes Go to Site administration > Analytics > Analytics models Edit the "Students who have not accessed the course yet" model 1. Set Analysis interval = 10% after the start 2. Save changes go back to Analytics models page (do not close this browser tab) Open a new tab and go to the Course Edit the course 1. Set the course start date to one minute ago 2. Set the course end date to five minutes in the future Go back to the Analytics models page tab In the actions menu for "Students who have not accessed the course yet" click on "Execute scheduled analysis" Test for course insight report Login as admin Navigate to Course, cours1 and click on the "Reports" tab on the secondary navigation. This should take you to the reports page. You should see "Insights" along with other options listed in the drop-down on the reports page. Select "Insights" from the drop-down. The user should see  the "Insights" page. The user should also see a drop-down selector.  The "Courses" > "course1" > "Reports" should now point to the "Insights".

      We are aiming to overhaul the general navigation around Moodle for version 4.0.

      One of the main changes is to have a secondary navigation menu that is more context aware and allows quicker access to frequently used items.

      final wireframe

      Project spec

        1. image-2021-09-09-17-30-14-396.png
          image-2021-09-09-17-30-14-396.png
          14 kB
        2. MDL-69588_Test 1 Step 2-3-5.png
          MDL-69588_Test 1 Step 2-3-5.png
          57 kB
        3. MDL-69588_Test 1 Step 2-3-6.png
          MDL-69588_Test 1 Step 2-3-6.png
          50 kB
        4. MDL-69588_Test 2 Step 2.png
          MDL-69588_Test 2 Step 2.png
          45 kB
        5. MDL-69588_Test 2 Step 6-7.png
          MDL-69588_Test 2 Step 6-7.png
          54 kB
        6. MDL-69588_Test 3 Step 3.png
          MDL-69588_Test 3 Step 3.png
          50 kB
        7. MDL-69588_Test 3 Step 4.png
          MDL-69588_Test 3 Step 4.png
          56 kB
        8. MDL-69588_Test 4 Step 5-1.png
          MDL-69588_Test 4 Step 5-1.png
          33 kB
        9. MDL-69588_Test 4 Step 8.png
          MDL-69588_Test 4 Step 8.png
          57 kB
        10. MDL-69588_Test 4 Step 9.png
          MDL-69588_Test 4 Step 9.png
          48 kB
        11. MDL-69588_Test 5 Step 3.png
          MDL-69588_Test 5 Step 3.png
          74 kB
        12. MDL-69588_Test 5 Step 4.png
          MDL-69588_Test 5 Step 4.png
          83 kB
        13. MDL-69588_Test 5 Step 5.png
          MDL-69588_Test 5 Step 5.png
          52 kB
        14. MDL-69588_Test 6 Step 10.png
          MDL-69588_Test 6 Step 10.png
          79 kB
        15. MDL-69588_Test 6 Step 12.png
          MDL-69588_Test 6 Step 12.png
          54 kB
        16. MDL-69588_Test 6 Step 13.png
          MDL-69588_Test 6 Step 13.png
          67 kB
        17. MDL-69588_Test 6 Step 14.png
          MDL-69588_Test 6 Step 14.png
          55 kB
        18. MDL-69588_Test 6 Step 3.png
          MDL-69588_Test 6 Step 3.png
          69 kB
        19. MDL-69588_Test 6 Step 4.png
          MDL-69588_Test 6 Step 4.png
          82 kB
        20. MDL-69588_Test 6 Step 5.png
          MDL-69588_Test 6 Step 5.png
          83 kB
        21. MDL-69588_Test 6 Step 6.png
          MDL-69588_Test 6 Step 6.png
          82 kB
        22. MDL-69588_Test 6 Step 7.png
          MDL-69588_Test 6 Step 7.png
          92 kB
        23. MDL-69588_Test 6 Step 8.png
          MDL-69588_Test 6 Step 8.png
          92 kB
        24. MDL-69588_Test 6 Step 9.png
          MDL-69588_Test 6 Step 9.png
          66 kB
        25. MDL-69588_Test 7 Step 12.png
          MDL-69588_Test 7 Step 12.png
          67 kB
        26. MDL-69588_Test 7 Step 5.png
          MDL-69588_Test 7 Step 5.png
          68 kB
        27. MDL-69588_Test 7 Step 6.png
          MDL-69588_Test 7 Step 6.png
          67 kB
        28. MDL-69588_Test 7 Step 8.png
          MDL-69588_Test 7 Step 8.png
          76 kB
        29. MDL-69588_Test 8 Activity Completion Report.png
          MDL-69588_Test 8 Activity Completion Report.png
          62 kB
        30. MDL-69588_Test 8 Basic Test.png
          MDL-69588_Test 8 Basic Test.png
          53 kB
        31. MDL-69588_Test 8 Course Completion Report.png
          MDL-69588_Test 8 Course Completion Report.png
          51 kB
        32. MDL-69588_Test 8 Course Event Monitoring Report.png
          MDL-69588_Test 8 Course Event Monitoring Report.png
          51 kB
        33. MDL-69588_Test 8 Course Insight Report.png
          MDL-69588_Test 8 Course Insight Report.png
          66 kB
        34. MDL-69588_Test 8 Course Statistics Report.png
          MDL-69588_Test 8 Course Statistics Report.png
          54 kB
        35. searchtopnavbar.png
          searchtopnavbar.png
          7 kB
        36. studentcourseadmin.png
          studentcourseadmin.png
          26 kB
        37. tabinbook.png
          tabinbook.png
          23 kB
        38. tabinforum.png
          tabinforum.png
          24 kB
        39. tabinforum-1.png
          tabinforum-1.png
          24 kB

            abgreeve Adrian Greeve
            abgreeve Adrian Greeve
            Mathew May Mathew May
            Jun Pataleta Jun Pataleta
            Angelia Dela Cruz Angelia Dela Cruz
            Votes:
            4 Vote for this issue
            Watchers:
            36 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 4 weeks, 4 days, 1 hour, 12 minutes
                4w 4d 1h 12m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.