Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
fix(input): by default, do not trim input[type=password] values
Browse files Browse the repository at this point in the history
Do not trim input[type=password] values

BREAKING CHANGE:

Previously, input[type=password] would trim values by default, and would require an explicit ng-trim="false"
to disable the trimming behaviour. After this CL, ng-trim no longer effects input[type=password], and will
never trim the password value.

Closes #8250
Closes #8230
  • Loading branch information
caitp committed Aug 21, 2014
1 parent 09b2987 commit a7fb357
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 3 deletions.
16 changes: 13 additions & 3 deletions src/ng/directive/input.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,9 @@ var inputType = {
* @name input[text]
*
* @description
* Standard HTML text input with angular data binding.
* Standard HTML text input with angular data binding, inherited by most of the `input` elements.
*
* *NOTE* Not every feature offered is available for all input types.
*
* @param {string} ngModel Assignable angular expression to data-bind to.
* @param {string=} name Property name of the form under which the control is published.
Expand All @@ -43,6 +45,8 @@ var inputType = {
* @param {string=} ngChange Angular expression to be executed when input changes due to user
* interaction with the input element.
* @param {boolean=} [ngTrim=true] If set to false Angular will not automatically trim the input.
* This parameter is ignored for input[type=password] controls, which will never trim the
* input.
*
* @example
<example name="text-input-directive" module="textInputExample">
Expand Down Expand Up @@ -908,6 +912,7 @@ function addNativeHtml5Validators(ctrl, validatorName, badFlags, ignoreFlags, va
function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {
var validity = element.prop(VALIDITY_STATE_PROPERTY);
var placeholder = element[0].placeholder, noevent = {};
var type = element[0].type.toLowerCase();
ctrl.$$validityState = validity;

// In composition mode, users are still inputing intermediate text buffer,
Expand Down Expand Up @@ -942,8 +947,8 @@ function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {

// By default we will trim the value
// If the attribute ng-trim exists we will avoid trimming
// e.g. <input ng-model="foo" ng-trim="false">
if (!attr.ngTrim || attr.ngTrim !== 'false') {
// If input type is 'password', the value is never trimmed
if (type !== 'password' && (!attr.ngTrim || attr.ngTrim !== 'false')) {
value = trim(value);
}

Expand Down Expand Up @@ -1276,6 +1281,8 @@ function checkboxInputType(scope, element, attr, ctrl, $sniffer, $browser, $filt
* HTML input element control with angular data-binding. Input control follows HTML5 input types
* and polyfills the HTML5 validation behavior for older browsers.
*
* *NOTE* Not every feature offered is available for all input types.
*
* @param {string} ngModel Assignable angular expression to data-bind to.
* @param {string=} name Property name of the form under which the control is published.
* @param {string=} required Sets `required` validation error key if the value is not entered.
Expand All @@ -1289,6 +1296,9 @@ function checkboxInputType(scope, element, attr, ctrl, $sniffer, $browser, $filt
* patterns defined as scope expressions.
* @param {string=} ngChange Angular expression to be executed when input changes due to user
* interaction with the input element.
* @param {boolean=} [ngTrim=true] If set to false Angular will not automatically trim the input.
* This parameter is ignored for input[type=password] controls, which will never trim the
* input.
*
* @example
<example name="input-directive" module="inputExample">
Expand Down
24 changes: 24 additions & 0 deletions test/ng/directive/inputSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -2984,6 +2984,30 @@ describe('input', function() {
expect(scope.items[0].selected).toBe(false);
});
});


describe('password', function() {
// Under no circumstances should input[type=password] trim inputs
it('should not trim if ngTrim is unspecified', function() {
compileInput('<input type="password" ng-model="password">');
changeInputValueTo(' - - untrimmed - - ');
expect(scope.password.length).toBe(' - - untrimmed - - '.length);
});


it('should not trim if ngTrim !== false', function() {
compileInput('<input type="password" ng-model="password" ng-trim="true">');
changeInputValueTo(' - - untrimmed - - ');
expect(scope.password.length).toBe(' - - untrimmed - - '.length);
});


it('should not trim if ngTrim === false', function() {
compileInput('<input type="password" ng-model="password" ng-trim="false">');
changeInputValueTo(' - - untrimmed - - ');
expect(scope.password.length).toBe(' - - untrimmed - - '.length);
});
});
});

describe('NgModel animations', function() {
Expand Down

0 comments on commit a7fb357

Please sign in to comment.