Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Commit

Permalink
feat(dropdown): focus toggle on close from click
Browse files Browse the repository at this point in the history
- Focus the toggle element when the click causes the dropdown menu to close

BREAKING CHANGE: This changes the focus behavior of the dropdown slightly, and potentially may break code built around current usage

Closes #5934
Fixes #5782
  • Loading branch information
wesleycho committed May 29, 2016
1 parent 23b91d9 commit cce0097
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 0 deletions.
1 change: 1 addition & 0 deletions src/dropdown/dropdown.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
}

openScope.isOpen = false;
openScope.focusToggleElement();

if (!$rootScope.$$phase) {
openScope.$apply();
Expand Down
27 changes: 27 additions & 0 deletions src/dropdown/test/dropdown.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -220,12 +220,28 @@ describe('uib-dropdown', function() {

beforeEach(function() {
element = dropdown();
$document.find('body').append(element);
});

afterEach(function() {
element.remove();
});

it('adds the menu to the body', function() {
expect($document.find('#dropdown-menu').parent()[0]).toBe($document.find('body')[0]);
});

it('focuses the dropdown element on close', function() {
var toggle = element.find('[uib-dropdown-toggle]');
var menu = $document.find('#dropdown-menu a');
toggle.trigger('click');
menu.focus();

menu.trigger('click');

expect(document.activeElement).toBe(toggle[0]);
});

it('removes the menu when the dropdown is removed', function() {
element.remove();
$rootScope.$digest();
Expand Down Expand Up @@ -268,6 +284,17 @@ describe('uib-dropdown', function() {
expect(container).not.toHaveClass('uib-dropdown-open');
});

it('focuses the dropdown element on close', function() {
var toggle = element.find('[uib-dropdown-toggle]');
var menu = $document.find('#dropdown-menu a');
toggle.trigger('click');
menu.focus();

menu.trigger('click');

expect(document.activeElement).toBe(toggle[0]);
});

it('removes the menu when the dropdown is removed', function() {
element.remove();
$rootScope.$digest();
Expand Down

0 comments on commit cce0097

Please sign in to comment.