Skip to content
This repository has been archived by the owner on Nov 22, 2021. It is now read-only.

Commit

Permalink
refactor(autocomplete): Rename showOnEmpty as loadOnEmpty
Browse files Browse the repository at this point in the history 
Rename the showOnEmpty option as loadOnEmpty and perform other
improvements on the code.
  • Loading branch information
@mbenford
mbenford committed Jul 27, 2014
1 parent b673166 commit ccc70c8
Show file tree
Hide file tree
Showing 3 changed files with 48 additions and 81 deletions.
37 changes: 8 additions & 29 deletions src/auto-complete.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,8 @@
* @param {boolean=} [loadOnDownArrow=false] Flag indicating that the source option will be evaluated when the down arrow
* key is pressed and the suggestion list is closed. The current input value
* is available as $query.
* @param {boolean=} {showOnEmpty=false} Flag indicating whether the dropdown will show on input focus. When using this
* option the source expression should handle a null query to account for focus on
* an empty input.
* @param {boolean=} {loadOnEmpty=false} Flag indicating that the source option will be evaluated when the input content
* becomes empty. The $query variable will be passed to the expression as an empty string.
*/
tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInputConfig) {
function SuggestionList(loadFn, options) {
Expand Down Expand Up @@ -113,7 +112,7 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
highlightMatchedText: [Boolean, true],
maxResultsToShow: [Number, 10],
loadOnDownArrow: [Boolean, false],
showOnEmpty: [Boolean, false]
loadOnEmpty: [Boolean, false]
});

options = scope.options;
Expand Down Expand Up @@ -165,14 +164,15 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
};

tagsInput
.on('tag-added invalid-tag', function() {
.on('tag-added tag-removed invalid-tag input-blur', function() {
suggestionList.reset();
})
.on('input-change', function(value) {
if (value && value.length >= options.minLength) {
var shouldLoadSuggestions = value && value.length >= options.minLength ||
!value && options.loadOnEmpty;

if (shouldLoadSuggestions) {
suggestionList.load(value, tagsInput.getTags());
} else if (scope.options.showOnEmpty) {
suggestionList.load('', tagsInput.getTags());
}
else {
suggestionList.reset();
Expand Down Expand Up @@ -228,28 +228,7 @@ tagsInput.directive('autoComplete', function($document, $timeout, $sce, tagsInpu
e.stopImmediatePropagation();
scope.$apply();
}
})
.on('input-blur', function() {
suggestionList.reset();
})
.on('input-focus', function () {
if (scope.options.showOnEmpty) {
suggestionList.load('', tagsInput.getTags(), true);
}
});

documentClick = function() {
if (suggestionList.visible) {
suggestionList.reset();
scope.$apply();
}
};

$document.on('click', documentClick);

scope.$on('$destroy', function() {
$document.off('click', documentClick);
});
}
};
});
2 changes: 1 addition & 1 deletion src/tags-input.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -295,7 +295,7 @@ tagsInput.directive('tagsInput', function($timeout, $document, tagsInputConfig)
if (scope.hasFocus) {
return;
}
scope.events.trigger('input-focus');

scope.hasFocus = true;
events.trigger('input-focus');

Expand Down
90 changes: 39 additions & 51 deletions test/auto-complete.spec.js
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,17 @@
'use strict';

describe('autoComplete directive', function() {
var $compile, $scope, $q, $timeout, $document,
var $compile, $scope, $q, $timeout,
parentCtrl, element, isolateScope, suggestionList, deferred, tagsInput, eventHandlers;

beforeEach(function() {
module('ngTagsInput');

inject(function($rootScope, _$compile_, _$q_, _$timeout_, _$document_) {
inject(function($rootScope, _$compile_, _$q_, _$timeout_) {
$scope = $rootScope;
$compile = _$compile_;
$q = _$q_;
$timeout = _$timeout_;
$document = _$document_;
});

deferred = $q.defer();
Expand Down Expand Up @@ -212,13 +211,14 @@ describe('autoComplete directive', function() {
expect(isSuggestionsBoxVisible()).toBe(false);
});

it('hides the suggestion box when the user clicks elsewhere on the page', function() {
it('hides the suggestion box when a tag is removed', function() {
// Arrange
suggestionList.show();
$scope.$digest();

// Act
$document.trigger('click');
eventHandlers['tag-removed']();
$scope.$digest();

// Assert
expect(isSuggestionsBoxVisible()).toBe(false);
Expand Down Expand Up @@ -408,18 +408,6 @@ describe('autoComplete directive', function() {
{ text: 'Item3' }
]);
});

it('removes the event listeners on the document when the scope is destroyed', function() {
// Arrange
compile();
spyOn($document, 'off');

// Arrange
$scope.$destroy();

// Assert
expect($document.off).toHaveBeenCalled();
});
});

describe('navigation through suggestions', function() {
Expand Down Expand Up @@ -714,6 +702,40 @@ describe('autoComplete directive', function() {
});
});

describe('load-on-empty option', function(){
it('initialize the option to false', function(){
// Arrange/Act
compile();

// Assert
expect(isolateScope.options.loadOnEmpty).toBe(false);
});

it('calls the load function when the input field becomes empty and the option is true', function(){
// Arrange
compile('load-on-empty="true"');

// Act
changeInputValue('');
$timeout.flush();

// Assert
expect($scope.loadItems).toHaveBeenCalledWith('');
});

it('doesn\'t call the load function when the input field becomes empty and the option is false', function(){
// Arrange
compile('load-on-empty="false"');

// Act
changeInputValue('');
$timeout.flush();

// Assert
expect($scope.loadItems).not.toHaveBeenCalled();
});
});

describe('debounce-delay option', function() {
it('initializes the option to 100 milliseconds', function() {
// Arrange/Act
Expand Down Expand Up @@ -817,40 +839,6 @@ describe('autoComplete directive', function() {
});
});

describe('show-on-empty option', function(){
it('initialize the option to false', function(){
//Arrange
compile();

//Assert
expect(isolateScope.options.showOnEmpty).toBe(false);
});

it('shows the suggestion box when the input field becomes empty', function(){
//Arrange
compile('show-on-empty="true"');

//Act
changeInputValue('');
$timeout.flush();

expect($scope.loadItems).toHaveBeenCalledWith('');
});

it('shows the suggestion box when input is focused and input is empty', function(){
//Arrange
compile('show-on-empty="true"');

//Act
eventHandlers['input-focus']();
$timeout.flush();

//Assert
expect($scope.loadItems).toHaveBeenCalledWith('');
});

});

describe('highlight-matched-text option', function() {
it('initializes the option to true', function() {
// Arrange/Act
Expand Down

0 comments on commit ccc70c8

Please sign in to comment.