AMBARI-22692 JS error when switching focus of filters in combo search. (atkach)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/e04b57b7 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/e04b57b7 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/e04b57b7 Branch: refs/heads/branch-feature-AMBARI-22008-isilon Commit: e04b57b7e04e542764c38d54da1ef80a7eb1679d Parents: 9c7f1b7 Author: Andrii Tkach <atk...@apache.org> Authored: Fri Dec 22 16:40:33 2017 +0200 Committer: Andrii Tkach <atk...@apache.org> Committed: Tue Dec 26 12:45:24 2017 +0200 ---------------------------------------------------------------------- .../app/scripts/directives/comboSearch.js | 27 ++- .../test/unit/directives/comboSearch_test.js | 187 ++++++++++++++++--- 2 files changed, 184 insertions(+), 30 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/e04b57b7/ambari-admin/src/main/resources/ui/admin-web/app/scripts/directives/comboSearch.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/directives/comboSearch.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/directives/comboSearch.js index fc58eae..f1cd515 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/directives/comboSearch.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/directives/comboSearch.js @@ -17,6 +17,27 @@ */ 'use strict'; + +/** + * Example: + * <combo-search suggestions="filters" + * filter-change="filterItems" + * placeholder="Search" + * supportCategories="true"> + * </combo-search> + * + * filters = [ + * { + * key: 'property1', + * label: $t('propertyLabel'), + * category: 'category1' + * options: [] + * } + * ] + * Note: "category" field is optional, should be used only when supportCategories="true" + * + */ + angular.module('ambariAdminConsole') .directive('comboSearch', function() { return { @@ -41,7 +62,7 @@ angular.module('ambariAdminConsole') var suggestions = $ctrl.suggestions; var supportCategories = $ctrl.supportCategories; var mainInputElement = $elem.find('.main-input.combo-search-input'); - $scope.paceholder = $ctrl.placeholder; + $scope.placeholder = $ctrl.placeholder; $scope.searchFilterInput = ''; $scope.filterSuggestions = []; $scope.showAutoComplete = false; @@ -261,7 +282,7 @@ angular.module('ambariAdminConsole') } function initKeyHandlers() { - $(document).keydown(function(event) { + $($elem).keydown(function(event) { if (event.which === 13) { // "Enter" key enterKeyHandler(); $scope.$apply(); @@ -295,7 +316,7 @@ angular.module('ambariAdminConsole') function leftArrowKeyHandler() { var activeElement = $(document.activeElement); - if (activeElement.is('input') && activeElement[0].selectionStart === 0) { + if (activeElement.is('input') && activeElement[0].selectionStart === 0 && $scope.appliedFilters.length > 0) { if (activeElement.hasClass('main-input')) { focusInput($scope.appliedFilters[$scope.appliedFilters.length - 1]); } else { http://git-wip-us.apache.org/repos/asf/ambari/blob/e04b57b7/ambari-admin/src/main/resources/ui/admin-web/test/unit/directives/comboSearch_test.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/test/unit/directives/comboSearch_test.js b/ambari-admin/src/main/resources/ui/admin-web/test/unit/directives/comboSearch_test.js index 0f4e3b3..59b74be 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/test/unit/directives/comboSearch_test.js +++ b/ambari-admin/src/main/resources/ui/admin-web/test/unit/directives/comboSearch_test.js @@ -133,33 +133,6 @@ describe('#comboSearch', function () { }); }); - describe('#hideAutocomplete', function() { - - it('showAutoComplete should be false when isEditing = false', function () { - var isoScope = element.isolateScope(); - jasmine.Clock.useMock(); - - isoScope.isEditing = false; - isoScope.showAutoComplete = true; - isoScope.hideAutocomplete(); - - jasmine.Clock.tick(101); - expect(isoScope.showAutoComplete).toBeFalsy(); - }); - - it('showAutoComplete should be false when isEditing = true', function () { - var isoScope = element.isolateScope(); - jasmine.Clock.useMock(); - - isoScope.isEditing = true; - isoScope.showAutoComplete = true; - isoScope.hideAutocomplete(); - - jasmine.Clock.tick(101); - expect(isoScope.showAutoComplete).toBeTruthy(); - }); - }); - describe('#makeActive', function() { it('category option can not be active', function () { var isoScope = element.isolateScope(); @@ -226,4 +199,164 @@ describe('#comboSearch', function () { }); }); + describe('#observeSearchFilterInput', function() { + it('should show all filters when search filter empty', function () { + var isoScope = element.isolateScope(); + isoScope.searchFilterInput = ''; + + isoScope.observeSearchFilterInput(); + + expect(isoScope.showAutoComplete).toBeTruthy(); + expect(isoScope.filterSuggestions).toEqual([ + { + key: 'f1', + label: 'filter1', + options: [ ], + active: true + }, + { + key: 'f2', + label: 'filter2', + options: [ ], + active: false + } + ]); + }); + + it('should show only searched filter when search filter not empty', function () { + var isoScope = element.isolateScope(); + isoScope.searchFilterInput = 'filter1'; + + isoScope.observeSearchFilterInput(); + + expect(isoScope.showAutoComplete).toBeTruthy(); + expect(isoScope.filterSuggestions).toEqual([ + { + key: 'f1', + label: 'filter1', + options: [ ], + active: true + } + ]); + }); + + it('should show no filter when search filter not found', function () { + var isoScope = element.isolateScope(); + isoScope.searchFilterInput = 'unknown-filter'; + + isoScope.observeSearchFilterInput(); + + expect(isoScope.showAutoComplete).toBeFalsy(); + expect(isoScope.filterSuggestions).toEqual([]); + }); + }); + + describe('#observeSearchOptionInput', function() { + it('should show all options when options search empty', function () { + var isoScope = element.isolateScope(); + var filter = { + key: 'p1', + searchOptionInput: '', + currentOption: null, + options: [ + { + key: 'op1', + label: 'op1' + }, + { + key: 'op2', + label: 'op2' + } + ] + }; + isoScope.appliedFilters = [ + { + key: 'p5', + currentOption: { + key: 'op5' + } + } + ]; + + isoScope.observeSearchOptionInput(filter); + + expect(filter.showAutoComplete).toBeTruthy(); + expect(filter.filteredOptions).toEqual([ + { + key: 'op1', + label: 'op1', + active: false + }, + { + key: 'op2', + label: 'op2', + active: false + } + ]); + }); + + it('should show only filtered options when options search not empty', function () { + var isoScope = element.isolateScope(); + var filter = { + key: 'p1', + currentOption: null, + searchOptionInput: 'op1', + options: [ + { + key: 'op1', + label: 'op1' + }, + { + key: 'op2', + label: 'op2' + } + ] + }; + isoScope.appliedFilters = [ + { + key: 'p5', + currentOption: { + key: 'op5' + } + } + ]; + + isoScope.observeSearchOptionInput(filter); + + expect(filter.showAutoComplete).toBeTruthy(); + expect(filter.filteredOptions).toEqual([ + { + key: 'op1', + label: 'op1', + active: false + } + ]); + }); + + it('should show no options when options search not found', function () { + var isoScope = element.isolateScope(); + var filter = { + key: 'p1', + currentOption: null, + searchOptionInput: 'op3', + options: [ + { + key: 'op1', + label: 'op1' + }, + { + key: 'op2', + label: 'op2' + } + ] + }; + isoScope.appliedFilters = []; + + isoScope.observeSearchOptionInput(filter); + + expect(filter.showAutoComplete).toBeFalsy(); + expect(filter.filteredOptions).toEqual([]); + }); + }); + });