refactor(tagsInput): Small refactoring

mbenford · Mar 11, 2015 · 02e7825 · 02e7825
1 parent 9e38e59
commit 02e7825
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 18 deletions.
diff --git a/src/tags-input.js b/src/tags-input.js
@@ -10,7 +10,7 @@
  *
  * @param {string} ngModel Assignable angular expression to data-bind to.
  * @param {string=} [displayProperty=text] Property to be rendered as the tag label.
- * @param {string=} [keyProperty=text] Property to be used for tracking items in the ng-repeat.
+ * @param {string=} [keyProperty=text] Property to be used as a unique identifier for the tag.
  * @param {string=} [type=text] Type of the input element. Only 'text', 'email' and 'url' are supported values.
  * @param {number=} tabindex Tab order of the control.
  * @param {string=} [placeholder=Add a tag] Placeholder text for the control.
@@ -44,11 +44,7 @@
  */
 tagsInput.directive('tagsInput', function($timeout, $document, tagsInputConfig, tiUtil) {
     function TagList(options, events, onTagAdding, onTagRemoving) {
-        var self = {}, getTagText, setTagText, tagIsValid, getIdProperty;
-
-        getIdProperty = function() {
-            return options.keyProperty || options.displayProperty;
-        };
+        var self = {}, getTagText, setTagText, tagIsValid;
 
         getTagText = function(tag) {
             return tiUtil.safeToString(tag[options.displayProperty]);
@@ -65,7 +61,7 @@ tagsInput.directive('tagsInput', function($timeout, $document, tagsInputConfig,
                    tagText.length >= options.minLength &&
                    tagText.length <= options.maxLength &&
                    options.allowedTagsPattern.test(tagText) &&
-                   !tiUtil.findInObjectArray(self.items, tag, getIdProperty()) &&
+                   !tiUtil.findInObjectArray(self.items, tag, options.keyProperty || options.displayProperty) &&
                    onTagAdding({ $tag: tag });
         };
 

diff --git a/test/auto-complete.spec.js b/test/auto-complete.spec.js
@@ -1090,7 +1090,7 @@ describe('autoComplete directive', function() {
     });
 
     describe('display-property option', function() {
-        it('initializes the option to ""', function() {
+        it('initializes the option to an empty string', function() {
             // Arrange/Act
             compile();
 

diff --git a/test/tags-input.spec.js b/test/tags-input.spec.js
@@ -1244,15 +1244,15 @@ describe('tags-input directive', function() {
     });
 
     describe('key-property option', function () {
-        it('initializes the option to ""', function () {
+        it('initializes the option to an empty string', function () {
             // Arrange/Act
             compile();
 
             // Assert
             expect(isolateScope.options.keyProperty).toBe('');
         });
 
-        it('allows settings tags with duplicate labels', function () {
+        it('renders tags with duplicate labels but different keys', function () {
             // Arrange
             $scope.tags= [
                 { id: 1, text: 'Tag' },
@@ -1263,10 +1263,22 @@ describe('tags-input directive', function() {
             compile('key-property="id"');
 
             // Assert
-            // no exception
+            expect(getTagText(0)).toBe('Tag');
+            expect(getTagText(1)).toBe('Tag');
         });
 
-        it('allows tracking tags by a custom property', function () {
+        it('fails to render tags with duplicate keys', function () {
+            // Arrange
+            $scope.tags= [
+                { id: 1, text: 'Tag' },
+                { id: 1, text: 'Tag' }
+            ];
+
+            // Act/Assert
+            expect(function() { compile('key-property="id"'); }).toThrowError();
+        });
+
+        it('adds tags with duplicate labels but different keys', function () {
             // Arrange
             $scope.tags = [
                 { id: 1, text: 'Tag' }
@@ -1277,14 +1289,13 @@ describe('tags-input directive', function() {
             isolateScope.tagList.add({ id: 2, text: 'Tag' });
 
             // Assert
-            expect(isolateScope.newTag.invalid).toBeFalsy();
             expect($scope.tags).toEqual([
                 { id: 1, text: 'Tag' },
                 { id: 2, text: 'Tag' }
             ]);
         });
 
-        it('fails with duplicate track properties', function () {
+        it('doesn\'t allow tags with duplicate keys', function () {
             // Arrange
             $scope.tags = [
                 { id: 1, text: 'Tag' }
@@ -1295,10 +1306,7 @@ describe('tags-input directive', function() {
             isolateScope.tagList.add({ id: 1, text: 'Other' });
 
             // Assert
-            expect(isolateScope.newTag.invalid).toBeTruthy();
-            expect($scope.tags).toEqual([
-                { id: 1, text: 'Tag' }
-            ]);
+            expect($scope.tags).toEqual([{ id: 1, text: 'Tag' }]);
         });
     });