82 lines
3.4 KiB
JavaScript
82 lines
3.4 KiB
JavaScript
define(['js/dashboard/dropdown', 'jquery.simulate'],
|
|
function() {
|
|
'use strict';
|
|
var keys = $.simulate.keyCode,
|
|
toggleButtonSelector = '#actions-dropdown-link-2',
|
|
dropdownSelector = '#actions-dropdown-2',
|
|
dropdownItemSelector = '#actions-dropdown-2 li a',
|
|
clickToggleButton = function() {
|
|
$(toggleButtonSelector).click();
|
|
},
|
|
verifyDropdownVisible = function() {
|
|
expect($(dropdownSelector)).toBeVisible();
|
|
},
|
|
verifyDropdownNotVisible = function() {
|
|
expect($(dropdownSelector)).not.toBeVisible();
|
|
},
|
|
waitForElementToBeFocused = function(element, done) {
|
|
jasmine.waitUntil(function() {
|
|
return element === document.activeElement;
|
|
}).always(done);
|
|
},
|
|
openDropDownMenu = function() {
|
|
verifyDropdownNotVisible();
|
|
clickToggleButton();
|
|
verifyDropdownVisible();
|
|
},
|
|
keydown = function(keyInfo) {
|
|
$(document.activeElement).simulate('keydown', keyInfo);
|
|
};
|
|
|
|
describe('edx.dashboard.dropdown.toggleCourseActionsDropdownMenu', function() {
|
|
beforeEach(function() {
|
|
loadFixtures('js/fixtures/dashboard/dashboard.html');
|
|
window.edx.dashboard.dropdown.bindToggleButtons('.action-more');
|
|
});
|
|
|
|
it('Clicking the .action-more button toggles the menu', function() {
|
|
verifyDropdownNotVisible();
|
|
clickToggleButton();
|
|
verifyDropdownVisible();
|
|
clickToggleButton();
|
|
verifyDropdownNotVisible();
|
|
});
|
|
it('ESCAPE will close dropdown and return focus to the button', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.ESCAPE});
|
|
verifyDropdownNotVisible();
|
|
waitForElementToBeFocused($(toggleButtonSelector)[0], done);
|
|
});
|
|
it('SPACE will close dropdown and return focus to the button', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.SPACE});
|
|
verifyDropdownNotVisible();
|
|
waitForElementToBeFocused($(toggleButtonSelector)[0], done);
|
|
});
|
|
|
|
describe('Focus is trapped when navigating with', function() {
|
|
it('TAB key', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.TAB});
|
|
waitForElementToBeFocused($(dropdownItemSelector)[0], done);
|
|
});
|
|
it('DOWN key', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.DOWN});
|
|
waitForElementToBeFocused($(dropdownItemSelector)[0], done);
|
|
});
|
|
it('TAB key + SHIFT key', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.TAB, shiftKey: true});
|
|
waitForElementToBeFocused($(dropdownItemSelector)[1], done);
|
|
});
|
|
it('UP key', function(done) {
|
|
openDropDownMenu();
|
|
keydown({keyCode: keys.UP});
|
|
waitForElementToBeFocused($(dropdownItemSelector)[1], done);
|
|
});
|
|
});
|
|
});
|
|
}
|
|
);
|