L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-60078 tool_usertours: Adjust accessibility checks for all themes

Browse Source
This commit is contained in:
Andrew Nicols
2018-01-25 12:45:56 +08:00
parent 0b048da8c0
commit dd4ac3d2ce
2 changed files with 47 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/tool/usertours/tests/behat/tour_accessibility.feature
+34 -67
View File
@@ -1,18 +1,31 @@
@tool @tool_usertours
Feature: Apply accessibility to a tour
Background:
Given I log in as "admin"
And I add a new user tour with:
| Name | First tour |
| Description | My first tour |
| Apply to URL match | FRONTPAGE |
| Tour is enabled | 1 |
| Show with backdrop | 1 |
And I add steps to the "First tour" tour:
| targettype | Title | Content |
| Display in middle of page | Welcome | Welcome tour. |
And I add steps to the tour:
| targettype | targetvalue_selector | Title | Content |
| Selector | .usermenu | User menu | Next page |
| Selector | input,button | Page 2 | Next page |
And I add steps to the tour:
| targettype | Title | Content |
| Display in middle of page | Page 3 | Final page. |
@javascript
Scenario: Check tabbing working correctly.
Given the following "courses" exist:
| fullname | shortname |
| Course 1 | C1 |
And I log in as "admin"
And I open the User tour settings page
And I click on "Enable" "link" in the "Boost - course view" "table_row"
And I am on "Course 1" course homepage
Given I am on site homepage
And I wait "1" seconds
And I should see "Welcome"
# First dialogue of the tour, "Welcome". It has Close, Next and End buttons.
# Nothing highlighted on the page. Initially whole dialogue focused.
And I wait "1" seconds
When I press tab
Then the focused element is ".close" "css_element" in the "Welcome" "dialogue"
When I press tab
@@ -29,82 +42,36 @@ Feature: Apply accessibility to a tour
Then the focused element is "End tour" "button" in the "Welcome" "dialogue"
When I press "Next"
# Now we are on the "Customisation" step, so Previous is also enabled.
# Also, the "Course Header" section in the page is highlighted, and this
# section contain breadcrumb Dashboard / Course 1 / C1 and setting drop down,
# so the focus have to go though them and back to the dialogue.
# Now we are on the "User menu" step, so Previous is also enabled.
# Also, the user menu section in the page is highlighted, and this
# section contain a hyperlink so the focus have to go though and back to the dialogue.
And I wait "1" seconds
And I press tab
Then the focused element is ".close" "css_element" in the "Customisation" "dialogue"
Then the focused element is ".close" "css_element" in the "User menu" "dialogue"
When I press tab
Then the focused element is "Previous" "button" in the "Customisation" "dialogue"
Then the focused element is "Previous" "button" in the "User menu" "dialogue"
When I press tab
Then the focused element is "Next" "button" in the "Customisation" "dialogue"
Then the focused element is "Next" "button" in the "User menu" "dialogue"
When I press tab
Then the focused element is "End tour" "button" in the "Customisation" "dialogue"
Then the focused element is "End tour" "button" in the "User menu" "dialogue"
# We tab 3 times from "End Tour" button to header container, drop down then go to "Dashboard" link.
When I press tab
And I press tab
And I press tab
Then the focused element is "Dashboard" "link" in the ".breadcrumb" "css_element"
Then the focused element is ".usermenu" "css_element"
When I press tab
Then the focused element is "Courses" "link"
When I press tab
Then the focused element is "C1" "link"
# Standing at final element of "Course Header" section, tab twice will lead our focus back to
# whole dialog then to close button on dialog header.
Then the focused element is "Admin User" "link" in the ".usermenu" "css_element"
When I press tab
And I press tab
Then the focused element is ".close" "css_element" in the "Customisation" "dialogue"
# Press shift-tab twice should lead us back to "C1" link.
Then the focused element is ".close" "css_element" in the "User menu" "dialogue"
# Press shift-tab twice should lead us back to "Admin user" link.
When I press shift tab
And I press shift tab
Then the focused element is "C1" "link"
When I press "Next"
# Now we are on the "Navigation" step, so Previous is also enabled.
# Also, the "Side panel" button in the page is highlighted, and this comes
# in the tab order after End buttons, and before focus loops back to the popup.
And I wait "1" seconds
And I press tab
Then the focused element is ".close" "css_element" in the "Navigation" "dialogue"
When I press tab
Then the focused element is "Previous" "button" in the "Navigation" "dialogue"
When I press tab
Then the focused element is "Next" "button" in the "Navigation" "dialogue"
When I press tab
Then the focused element is "End tour" "button" in the "Navigation" "dialogue"
When I press tab
Then the focused element is "Side panel" "button"
When I press tab
# Here the focus loops round to the whole dialogue again.
And I press tab
Then the focused element is ".close" "css_element" in the "Navigation" "dialogue"
When I press shift tab
And I press shift tab
Then the focused element is "Side panel" "button"
When I press shift tab
And the focused element is "End tour" "button" in the "Navigation" "dialogue"
Then the focused element is "Admin User" "link" in the ".usermenu" "css_element"
@javascript
Scenario: Aria tags should not exist
Given I log in as "admin"
And I add a new user tour with:
| Name | First tour |
| Description | My first tour |
| Apply to URL match | FRONTPAGE |
| Tour is enabled | 1 |
And I add steps to the "First tour" tour:
| targettype | Title | Content |
| Display in middle of page | Welcome | Welcome to your course tour. |
And I add steps to the tour:
| targettype | targetvalue_selector | Title | Content |
| Selector | input,button | Page 2 | Next page |
And I add steps to the tour:
| targettype | Title | Content |
| Display in middle of page | Page 3 | Final page. |
And I am on site homepage
When I click on "Next" "button"
And I click on "Next" "button"
Then "input[aria-describedby^='tour-step-tool_usertours'],button[aria-describedby^='tour-step-tool_usertours']" "css_element" should exist
And "input[tabindex],button[tabindex]" "css_element" should exist
When I click on "Next" "button"
lib/behat/classes/partial_named_selector.php
+13 -5
View File
@@ -137,11 +137,19 @@ XPATH
.//div[contains(concat(' ', normalize-space(@class), ' '), ' yui-dialog ') and
normalize-space(descendant::div[@class='hd']) = %locator%]
|
.//div[@data-region='modal' and descendant::*[@data-region='title'] = %locator%] |
.//div[contains(concat(' ', normalize-space(@class), ' '), ' modal-content ') and
normalize-space(descendant::h4[
contains(concat(' ', normalize-space(@class), ' '), ' modal-title ')
]) = %locator%]
.//div[@data-region='modal' and descendant::*[@data-region='title'] = %locator%]
|
.//div[
contains(concat(' ', normalize-space(@class), ' '), ' modal-content ')
and
normalize-space(descendant::h4[contains(concat(' ', normalize-space(@class), ' '), ' modal-title ')]) = %locator%
]
|
.//div[
contains(concat(' ', normalize-space(@class), ' '), ' modal ')
and
normalize-space(descendant::*[contains(concat(' ', normalize-space(@class), ' '), ' modal-header ')] = %locator%)
]
XPATH
, 'icon' => <<<XPATH
.//*[contains(concat(' ', normalize-space(@class), ' '), ' icon ') and ( contains(normalize-space(@title), %locator%))]