Skip to content

Commit

Permalink
Test: Complete the test set for the smart menus feature, solves #375
Browse files Browse the repository at this point in the history
  • Loading branch information
prasanna-lmsace authored and abias committed Jan 14, 2024
1 parent 7d31b76 commit 4883096
Show file tree
Hide file tree
Showing 4 changed files with 345 additions and 0 deletions.
54 changes: 54 additions & 0 deletions tests/behat/behat_theme_boost_union_base_backports.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
<?php
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.

/**
* Theme Boost Union - Behat rules which have been backported from future Moodle versions.
*
* @package theme_boost_union
* @copyright 2024 Alexander Bias <[email protected]>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/

require_once(__DIR__.'/../../../../lib/behat/behat_base.php');

/**
* Class behat_theme_boost_union_base_backports
*
* @package theme_boost_union
* @copyright 2024 Alexander Bias <[email protected]>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
class behat_theme_boost_union_base_backports extends behat_base {
/**
* Generic mouse over action. Mouse over a element of the specified type.
*
* This step is basically existent in Moodle core, but is not usable due to a bug as
* https://github.com/moodle/moodle/commit/905ccf34fc672168c06192ba801386e6e88cc83b / MDL-78199 was only
* integrated to Moodle 4.3.
*
* @When I hover over the :element :selectortype in the :containerelement :containerselectortype
* @param string $element Element we look for
* @param string $selectortype The type of what we look for
* @param string $containerelement Element we look for
* @param string $containerselectortype The type of what we look for
*/
public function i_hover_in_the(string $element, $selectortype, string $containerelement, $containerselectortype): void {
// Gets the node based on the requested selector type and locator.
$node = $this->get_node_in_container($selectortype, $element, $containerselectortype, $containerelement);
$this->execute_js_on_node($node, '{{ELEMENT}}.scrollIntoView();');
$node->mouseOver();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,213 @@ Feature: Configuring the theme_boost_union plugin on the "Smart menus" page, app
| Course full name | | Test course word count | C1 |
| Course full name | 2 | Test course.. | Test course word count |

@javascript
Scenario: Smartmenus: Menu items: Presentation - Display the menu item title in different type
Given I log in as "admin"
And I navigate to smart menu "Quick links" items
And I set "Quick links" smart menu items with the following fields to these values:
| Title | External links |
| Menu item type | Heading |
And I should see "External links" in the "smartmenus_items" "table"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Static |
| Menu item URL | https://moodle.org |
And I should see "Resources" in the "smartmenus_items" "table"
And I should see smart menu "Quick links" item "External links" in location "Main, Menu, User, Bottom"
# Main menu test.
And I click on "Quick links" "link" in the ".primary-navigation" "css_element"
And I should see "External links" in the ".primary-navigation .menu-item-heading" "css_element"
Then the "href" attribute of ".primary-navigation .menu-item-heading" "css_element" should contain "#"
And I should see "Resources" in the ".primary-navigation .menu-item-static" "css_element"
Then the "href" attribute of ".primary-navigation .menu-item-static" "css_element" should contain "https://moodle.org"
# Menu bar.
And I click on "Quick links" "link" in the ".boost-union-menubar" "css_element"
And I should see "External links" in the ".boost-union-menubar .menu-item-heading" "css_element"
Then the "href" attribute of ".boost-union-menubar .menu-item-heading" "css_element" should contain "#"
And I should see "Resources" in the ".boost-union-menubar .menu-item-static" "css_element"
Then the "href" attribute of ".boost-union-menubar .menu-item-static" "css_element" should contain "https://moodle.org"
# Menu items in user menu.
And I click on "#user-menu-toggle" "css_element"
And I click on "Quick links" "link" in the "#usermenu-carousel" "css_element"
And I should see "External links" in the "#usermenu-carousel .menu-item-heading" "css_element"
And I should see "Resources" in the "#usermenu-carousel .menu-item-static" "css_element"
And the "href" attribute of "//div[contains(@class, 'carousel-item')]//a[contains(@class, 'menu-item-heading')]" "xpath_element" should contain "#"
And the "href" attribute of "//div[contains(@class, 'carousel-item')]//a[contains(@class, 'menu-item-static')]" "xpath_element" should contain "https://moodle.org"
# Menu items in bottom menu.
Then I change the viewport size to "740x900"
And I click on "Quick links" "link" in the ".bottom-navigation" "css_element"
And I should see "External links" in the ".bottom-navigation" "css_element"
And the "href" attribute of "//div[@class='bottom-navigation']//a[contains(@class, 'menu-item-heading')]" "xpath_element" should contain "#"
And the "href" attribute of "//div[@class='bottom-navigation']//a[contains(@class, 'menu-item-static')]" "xpath_element" should contain "https://moodle.org"
Then I change the viewport size to "large"

@javascript
Scenario: Smartmenus: Menu items - Display the menu items in different order
Given I log in as "admin"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Demo item 01 |
| Menu item type | Static |
| Menu item URL | https://example.com |
| desktop | 1 |
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Demo item 02 |
| Menu item type | Static |
| Menu item URL | https://example.com |
| tablet | 1 |
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Demo item 03 |
| Menu item type | Static |
| Menu item URL | https://example.com |
| mobile | 1 |
And I click on "Quick links" "link" in the ".primary-navigation" "css_element"
And "Demo item 02" "text" should appear after "Demo item 01" "text"
And "Demo item 03" "text" should appear after "Demo item 02" "text"
And I click on ".action-edit" "css_element" in the "Demo item 01" "table_row"
And I set the field "Order" to "3"
And I click on "Save changes" "button"
And I click on ".action-edit" "css_element" in the "Demo item 03" "table_row"
And I set the field "Order" to "1"
And I click on "Save changes" "button"
And "Demo item 02" "text" should appear after "Demo item 03" "text"
And "Demo item 01" "text" should appear after "Demo item 02" "text"

@javascript
Scenario Outline: Smartmenus: Menu items - Display the menu items in different viewports
Given I log in as "admin"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Static |
| Menu item URL | https://moodle.org |
| desktop | <hidedesktop> |
| tablet | <hidetablet> |
| mobile | <hidemobile> |
And I <desktopshouldornot> see smart menu "Quick links" item "Resources" in location "Menu, Main, User"
Then I change window size to "800x980"
And I <tabletshouldornot> see smart menu "Quick links" item "Resources" in location "User, Menu"
And I click on "More" "link" in the ".primary-navigation" "css_element"
And I <tabletshouldornot> see smart menu "Quick links" item "Resources" in location "Main"
Then I change window size to "mobile"
And I <mobileshouldornot> see smart menu "Quick links" item "Resources" in location "Menu, User"
And I <mobileshouldornot> see smart menu "Quick links" item "Resources" in location "Bottom"

Examples:
| hidedesktop | hidetablet | hidemobile | desktopshouldornot | tabletshouldornot | mobileshouldornot |
| 0 | 0 | 1 | should | should | should not |
| 0 | 1 | 1 | should | should not | should not |
| 1 | 0 | 0 | should not | should | should |
| 1 | 0 | 1 | should not | should | should not |

@javascript
Scenario Outline: Smartmenus: Menu items: Presentation - Display the menu items title with icon
Given I log in as "admin"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Heading |
| Title presentation | <presentationtitle> |
And I should see "Resources" in the "smartmenus_items" "table"
And I click on ".action-edit" "css_element" in the "Resources" "table_row"
Then I click on "input[name='iconsearch']" "css_element"
Then I click on ".fa-info-circle" "css_element" in the ".fontawesome-picker .popover-body " "css_element"
And I click on "Save changes" "button"
And I <desktopshouldornot> see smart menu "Quick links" item "Resources" in location "Main, Menu, User"
And ".fa-info-circle" "css_element" should exist in the ".primary-navigation .dropdown-item.menu-item-heading" "css_element"
And ".fa-info-circle" "css_element" should exist in the ".boost-union-menubar .dropdown-item" "css_element"
And ".fa-info-circle" "css_element" should exist in the "#usermenu-carousel .carousel-item.submenu .dropdown-item" "css_element"
Then I change window size to "mobile"
And I <mobiletitleshould> see smart menu "Quick links" item "Resources" in location "Menu, User"
And I click on "More" "button" in the ".bottom-navigation" "css_element"
And I click on "Quick links" "link" in the "#theme_boost-drawers-primary" "css_element"
And I <mobiletitleshould> see "Resources" in the "#theme_boost-drawers-primary" "css_element"
And ".fa-info-circle" "css_element" should exist in the ".primary-navigation .dropdown-item.menu-item-heading" "css_element"
And ".fa-info-circle" "css_element" should exist in the ".boost-union-menubar .dropdown-item" "css_element"
And ".fa-info-circle" "css_element" should exist in the "#usermenu-carousel .carousel-item.submenu .dropdown-item" "css_element"
Then I change window size to "large"

Examples:
| presentationtitle | desktopshouldornot | mobiletitleshould |
| Show text and icon as title | should | should |
| Hide title text and show only icon (on all devices) | should not | should not |
| Hide title text and show only icon (on mobile devices) | should | should not |

@javascript
Scenario: Smartmenus: Menu items: Presentation - Display the tooltip on hover over the menu items
Given I log in as "admin"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Static |
| Menu item URL | https://moodle.org |
| Tooltip | External links |
And I should see "Resources" in the "smartmenus_items" "table"
And I click on "Quick links" "link" in the ".primary-navigation" "css_element"
And I hover over the "Resources" "text" in the ".primary-navigation" "css_element"
Then I should see "External links" in the "body>.tooltip" "css_element"
And I click on ".action-edit" "css_element" in the "Resources" "table_row"
And I set the field "Tooltip" to ""
And I click on "Save changes" "button"
And I click on "Quick links" "link" in the ".primary-navigation" "css_element"
And I hover over the "Resources" "link" in the ".primary-navigation" "css_element"
And "body>.tooltip" "css_element" should not exist

@javascript
Scenario: Smartmenus: Menu items: Presentation - Display the card type menu items title with different position and color
Given I log in as "admin"
And I navigate to smart menus
And I click on ".action-edit" "css_element" in the "Quick links" "table_row"
And I set the field "Presentation type" to "Card"
And I click on "Save and return" "button"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Static |
| Menu item URL | https://moodle.org |
| Card text position| Below image |
| Card text color | #FFFEFF |
And I should see smart menu "Quick links" item "Resources" in location "Main"
Then DOM element ".dropdown-menu.show .card-block .content-block a.dropdown-item" should have computed style "color" "rgb(255, 254, 255)"
Then ".dropdown-menu.show .card-block.card-text-below" "css_element" should exist in the ".primary-navigation" "css_element"
And ".dropdown-menu.show .card-block .content-block" "css_element" should appear after ".dropdown-menu.show .card-block .img-block" "css_element"
And I click on ".action-edit" "css_element" in the "Resources" "table_row"
And I expand all fieldsets
Then I set the field "Card text position" to "Top overlay"
Then I set the field "Card text color" to "#230017"
And I click on "Save changes" "button"
And I should see smart menu "Quick links" item "Resources" in location "Main"
Then DOM element ".dropdown-menu.show .card-block .content-block a.dropdown-item" should have computed style "color" "rgb(35, 0, 23)"
Then ".dropdown-menu.show .card-block.card-text-overlay-top" "css_element" should exist in the ".primary-navigation" "css_element"
Then DOM element ".dropdown-menu.show .card-block .content-block" should have computed style "position" "absolute"
And I click on ".action-edit" "css_element" in the "Resources" "table_row"
And I expand all fieldsets
Then I set the field "Card text position" to "Bottom overlay"
And I click on "Save changes" "button"
And I should see smart menu "Quick links" item "Resources" in location "Main"
Then ".dropdown-menu.show .card-block.card-text-overlay-bottom" "css_element" should exist in the ".primary-navigation" "css_element"
Then DOM element ".dropdown-menu.show .card-block .content-block" should have computed style "position" "absolute"
Then DOM element ".dropdown-menu.show .card-block .content-block" should have computed style "align-items" "flex-end"

@javascript @_file_upload
Scenario: Smartmenus: Menu items: Presentation - Display the card type menu item with background image and colors
Given I log in as "admin"
And I navigate to smart menus
And I click on ".action-edit" "css_element" in the "Quick links" "table_row"
And I set the field "Presentation type" to "Card"
And I click on "Save and return" "button"
And I set "Quick links" smart menu items with the following fields to these values:
| Title | Resources |
| Menu item type | Static |
| Menu item URL | https://example.com |
| Card background color | #031FC3 |
And I should see smart menu "Quick links" item "Resources" in location "Main"
And I click on "Quick links" "link" in the ".primary-navigation" "css_element"
Then DOM element ".dropdown-menu .menu-item-static .content-block" should have computed style "background-color" "rgb(3, 31, 195)"
And I click on "Quick links" "link" in the ".boost-union-menubar" "css_element"
Then DOM element ".boost-union-menubar .dropdown-menu.show .content-block" should have computed style "background-color" "rgb(3, 31, 195)"
And I click on ".action-edit" "css_element" in the "Resources" "table_row"
And I expand all fieldsets
And I upload "theme/boost_union/tests/fixtures/backimg.jpg" file to "Card image" filemanager
And I click on "Save changes" "button"
And I should see smart menu "Quick links" item "Resources" in location "Main, Menu"
Then the image at "//div[contains(@class, 'primary-navigation')]//img[contains(@src, 'pluginfile.php') and contains(@src, '/theme_boost_union/smartmenus_itemimage/')]" "xpath_element" should be identical to "theme/boost_union/tests/fixtures/backimg.jpg"

@javascript
Scenario: Smartmenu: Menu items: Presentation - Add a smart menu item with multilang tags
When I log in as "admin"
Expand Down
Loading

0 comments on commit 4883096

Please sign in to comment.