MDL-75762 core_courseformat: Fix accessibility issue

* Reverse the changes in MDL-74740 to fix left drawer issue (drawer
was scrolling with the page)

grade/tests/behat/behat_grade.php

@@ -40,6 +40,7 @@ class behat_grade extends behat_base {
      * @param string $itemname
      */
     public function i_give_the_grade($grade, $userfullname, $itemname) {
+        $this->execute('behat_navigation::i_close_block_drawer_if_open');
         $gradelabel = $userfullname . ' ' . $itemname;
         $fieldstr = get_string('useractivitygrade', 'gradereport_grader', $gradelabel);
 
@@ -58,6 +59,7 @@ class behat_grade extends behat_base {
      * @param TableNode $data
      */
     public function i_set_the_following_settings_for_grade_item(string $gradeitem, string $type, string $page, TableNode $data) {
+        $this->execute("behat_navigation::i_close_block_drawer_if_open");
 
         if ($this->running_javascript()) {
             $this->execute("behat_grades::i_click_on_grade_item_menu", [$gradeitem, $type, $page]);

grade/tests/behat/behat_grades.php

@@ -225,7 +225,7 @@ class behat_grades extends behat_base {
      * @throws Exception
      */
     public function i_click_on_grade_item_menu(string $itemname, string $itemtype, string $page) {
-
+        $this->execute("behat_navigation::i_close_block_drawer_if_open");
         if ($itemtype == 'gradeitem') {
             $itemid = $this->get_grade_item_id($itemname);
         } else if ($itemtype == 'category') {
@@ -253,6 +253,8 @@ class behat_grades extends behat_base {
         } else {
             throw new Exception('Unknown page: ' . $page);
         }
+        $node = $this->get_selected_node("xpath_element", $this->escape($xpath));
+        $this->execute_js_on_node($node, '{{ELEMENT}}.scrollIntoView({ block: "center", inline: "center" })');
         $this->execute("behat_general::i_click_on", [$this->escape($xpath), "xpath_element"]);
     }
 }

lib/tests/behat/behat_navigation.php

@@ -29,7 +29,6 @@ require_once(__DIR__ . '/../../behat/behat_base.php');
 
 use Behat\Mink\Element\NodeElement;
 use Behat\Mink\Exception\ExpectationException as ExpectationException;
-use Behat\Mink\Exception\DriverException as DriverException;
 use Behat\Mink\Exception\ElementNotFoundException as ElementNotFoundException;
 
 /**
@@ -1510,4 +1509,36 @@ class behat_navigation extends behat_base {
             );
         }
     }
+
+    /**
+     * Close the block drawer if it is open.
+     *
+     * This is necessary as in Behat the block drawer is open at each page load (disregarding user's settings)
+     * As the block drawer is positioned at the front of some contextual dialogs on the grade report for example.
+     * @Given I close block drawer if open
+     * @return void
+     */
+    public function i_close_block_drawer_if_open() {
+        if ($this->running_javascript()) {
+            $xpath = "//button[contains(@data-action,'closedrawer')][contains(@data-placement,'left')]";
+            $node = $this->getSession()->getPage()->find('xpath', $xpath);
+            if ($node && $node->isVisible()) {
+                $ishidden = $node->getAttribute('aria-hidden-tab-index');
+                if (!$ishidden) {
+                    $this->execute('behat_general::i_click_on', [$node, 'NodeElement']);
+                }
+            }
+        }
+    }
+
+    /**
+     * I close the block drawer and keep it closed.
+     *
+     * @Given I keep block drawer closed
+     * @return void
+     */
+    public function i_keep_block_drawer_closed() {
+        set_user_preference('behat_keep_drawer_closed', 1);
+        $this->i_close_block_drawer_if_open();
+    }
 }

lib/upgrade.txt

@@ -71,6 +71,9 @@ information provided here is intended especially for developers.
 * The moodle-core-notification-confirm module, found under the M.core.confirm namespace, has been deprecated.
   Any code using it should be rewritten as an ESM and use the core/notification module instead.
   See MDL-77174 for further information.
+* New behat behat_navigation::i_close_block_drawer_if_open() and behat_navigation::i_keep_block_drawer_closed()
+to ensure in some test that the block drawer is closed. This helps with random failures due to the block drawer
+being forced open in all behat tests.
 
 === 4.2 ===
 

theme/boost/layout/drawers.php

@@ -41,7 +41,7 @@ if (isloggedin()) {
     $blockdraweropen = false;
 }
 
-if (defined('BEHAT_SITE_RUNNING')) {
+if (defined('BEHAT_SITE_RUNNING') && get_user_preferences('behat_keep_drawer_closed') != 1) {
     $blockdraweropen = true;
 }
 

theme/boost/scss/moodle/drawer.scss

@@ -161,7 +161,7 @@ $right-drawer-width: 320px;
 @mixin drawer() {
     @include transition(left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease);
     background-color: $drawer-bg-color;
-    z-index: $zindex-modal;
+    z-index: $zindex-fixed;
     position: fixed;
     height: 100vh;
     top: 0;
@@ -221,15 +221,15 @@ $right-drawer-width: 320px;
 
 @include media-breakpoint-up(lg) {
     .drawer {
-        z-index: inherit;
+        // Make sure that in large screens the drawer goes under the drop down menus.
-
+        z-index: $zindex-dropdown - 1;
         // Workaround to display the skip link elements from the blocks drawer infront of the navbar.
+        // As the skip link is in a fixed position and z-index for this element is ignored
+        // then it is hidden behind the top navbar.
+        // The workaround is to actually give a z-index to the drawer so it appears in front of the
+        // navbar (https://developer.mozilla.org/en-US/docs/Web/CSS/z-index).
         &#theme_boost-drawers-blocks:focus-within {
-            position: absolute;
+            z-index: $zindex-fixed + 1;
-
-            .drawercontent {
-                z-index: auto;
-            }
         }
 
         &.not-initialized {

theme/boost/style/moodle.css

@@ -29726,7 +29726,7 @@ body.drawer-ease {
 .drawer {
   transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
   background-color: #f8f9fa;
-  z-index: 1050;
+  z-index: 1030;
   position: fixed;
   height: 100vh;
   top: 0;
@@ -29776,13 +29776,10 @@ body.drawer-ease {
 
 @media (min-width: 992px) {
   .drawer {
-    z-index: inherit;
+    z-index: 999;
   }
   .drawer#theme_boost-drawers-blocks:focus-within {
-    position: absolute;
+    z-index: 1031;
-  }
-  .drawer#theme_boost-drawers-blocks:focus-within .drawercontent {
-    z-index: auto;
   }
   .drawer.not-initialized {
     display: block;
@@ -29809,7 +29806,7 @@ body.drawer-ease {
     display: block;
     transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
     background-color: #f8f9fa;
-    z-index: 1050;
+    z-index: 1030;
     position: fixed;
     height: 100vh;
     top: 0;
@@ -29870,7 +29867,7 @@ body.drawer-ease {
     display: block;
     transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
     background-color: #f8f9fa;
-    z-index: 1050;
+    z-index: 1030;
     position: fixed;
     height: 100vh;
     top: 0;

theme/classic/style/moodle.css

@@ -29726,7 +29726,7 @@ body.drawer-ease {
 .drawer {
   transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
   background-color: #f8f9fa;
-  z-index: 1050;
+  z-index: 1030;
   position: fixed;
   height: 100vh;
   top: 0;
@@ -29776,13 +29776,10 @@ body.drawer-ease {
 
 @media (min-width: 992px) {
   .drawer {
-    z-index: inherit;
+    z-index: 999;
   }
   .drawer#theme_boost-drawers-blocks:focus-within {
-    position: absolute;
+    z-index: 1031;
-  }
-  .drawer#theme_boost-drawers-blocks:focus-within .drawercontent {
-    z-index: auto;
   }
   .drawer.not-initialized {
     display: block;
@@ -29809,7 +29806,7 @@ body.drawer-ease {
     display: block;
     transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
     background-color: #f8f9fa;
-    z-index: 1050;
+    z-index: 1030;
     position: fixed;
     height: 100vh;
     top: 0;
@@ -29870,7 +29867,7 @@ body.drawer-ease {
     display: block;
     transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease, visibility 0.2s ease;
     background-color: #f8f9fa;
-    z-index: 1050;
+    z-index: 1030;
     position: fixed;
     height: 100vh;
     top: 0;