fix(input): by default, do not trim input[type=password] values

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
This commit is contained in:
Caitlin Potter
2014-07-17 21:44:48 -04:00
parent 09b298705f
commit a7fb357fa1
2 changed files with 37 additions and 3 deletions

View File

@@ -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.
@@ -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">
@@ -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,
@@ -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);
}
@@ -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.
@@ -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">

View File

@@ -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() {