From 2d020e12417d9103724a060389bf5bb5711947f4 Mon Sep 17 00:00:00 2001 From: DevVersion Date: Fri, 25 Mar 2016 20:40:56 +0100 Subject: [PATCH] fix(chips): do not trim the input model. * The chips input should not trim the text, because otherwise the buffer will be always falsey, even when there are spaces in the input, and this would cause the backspace not to work. Fixes #7243 Closes #7748 --- src/components/chips/chips.spec.js | 51 ++++++++++++++++++++++ src/components/chips/js/chipsController.js | 2 +- src/components/chips/js/chipsDirective.js | 1 + 3 files changed, 53 insertions(+), 1 deletion(-) diff --git a/src/components/chips/chips.spec.js b/src/components/chips/chips.spec.js index 8efd637f486..c85e24485e2 100755 --- a/src/components/chips/chips.spec.js +++ b/src/components/chips/chips.spec.js @@ -388,8 +388,59 @@ describe('', function() { expect(enterEvent.preventDefault).toHaveBeenCalled(); })); + it('should trim the buffer when a chip will be added', inject(function($mdConstant) { + var element = buildChips(BASIC_CHIP_TEMPLATE); + var ctrl = element.controller('mdChips'); + var input = element.find('input'); + + // This string contains a lot of spaces, which should be trimmed. + input.val(' Test '); + input.triggerHandler('input'); + + expect(ctrl.chipBuffer).toBeTruthy(); + + var enterEvent = { + type: 'keydown', + keyCode: $mdConstant.KEY_CODE.ENTER, + which: $mdConstant.KEY_CODE.ENTER + }; + + input.triggerHandler(enterEvent); + + expect(scope.items).toEqual(['Apple', 'Banana', 'Orange', 'Test']); + })); + + it('should not trim the input text of the input', inject(function($mdConstant) { + var element = buildChips(BASIC_CHIP_TEMPLATE); + var ctrl = element.controller('mdChips'); + var input = element.find('input'); + + input.val(' '); + input.triggerHandler('input'); + + expect(ctrl.chipBuffer).toBeTruthy(); + + var enterEvent = { + type: 'keydown', + keyCode: $mdConstant.KEY_CODE.BACKSPACE, + which: $mdConstant.KEY_CODE.BACKSPACE, + preventDefault: jasmine.createSpy('preventDefault') + }; + + input.triggerHandler(enterEvent); + + expect(enterEvent.preventDefault).not.toHaveBeenCalled(); + + input.val(''); + input.triggerHandler('input'); + + input.triggerHandler(enterEvent); + + expect(enterEvent.preventDefault).toHaveBeenCalledTimes(1); + })); }); + it('focuses/blurs the component when focusing/blurring the input', inject(function() { var element = buildChips(BASIC_CHIP_TEMPLATE); var ctrl = element.controller('mdChips'); diff --git a/src/components/chips/js/chipsController.js b/src/components/chips/js/chipsController.js index bf055a1e9d2..0d78579bf54 100644 --- a/src/components/chips/js/chipsController.js +++ b/src/components/chips/js/chipsController.js @@ -144,7 +144,7 @@ MdChipsCtrl.prototype.inputKeydown = function(event) { // Only append the chip and reset the chip buffer if the max chips limit isn't reached. if (this.hasMaxChipsReached()) return; - this.appendChip(chipBuffer); + this.appendChip(chipBuffer.trim()); this.resetChipBuffer(); } }; diff --git a/src/components/chips/js/chipsDirective.js b/src/components/chips/js/chipsDirective.js index 62c0c402145..b4c86cd81a1 100644 --- a/src/components/chips/js/chipsDirective.js +++ b/src/components/chips/js/chipsDirective.js @@ -154,6 +154,7 @@ ng-model="$mdChipsCtrl.chipBuffer"\ ng-focus="$mdChipsCtrl.onInputFocus()"\ ng-blur="$mdChipsCtrl.onInputBlur()"\ + ng-trim="false"\ ng-keydown="$mdChipsCtrl.inputKeydown($event)">'; var CHIP_DEFAULT_TEMPLATE = '\