Core: Unhighlighting field if already highlighted when using remote rule.

skjelbek · staabm · commit e9fd71d89b5b · 2016-02-19T15:52:34.000+01:00
Closes jquery-validation#1712. Refs jquery-validation#1669, jquery-validation#1375, jquery-validation#12.
diff --git a/src/core.js b/src/core.js
@@ -630,12 +630,16 @@ $.extend( $.validator, {
 			return $( this.settings.errorElement + "." + errorClass, this.errorContext );
 		},
 
-		reset: function() {
+		resetInternals: function() {
 			this.successList = [];
 			this.errorList = [];
 			this.errorMap = {};
 			this.toShow = $( [] );
 			this.toHide = $( [] );
+		},
+
+		reset: function() {
+			this.resetInternals();
 			this.currentElements = $( [] );
 		},
 
@@ -1445,7 +1449,8 @@ $.extend( $.validator, {
 					validator.settings.messages[ element.name ][ method ] = previous.originalMessage;
 					if ( valid ) {
 						submitted = validator.formSubmitted;
-						validator.prepareElement( element );
+						validator.resetInternals();
+						validator.toHide = validator.errorsFor( element );
 						validator.formSubmitted = submitted;
 						validator.successList.push( element );
 						validator.invalid[ element.name ] = false;
diff --git a/test/index.html b/test/index.html
@@ -410,6 +410,9 @@ <h3></h3>
 	<form id="add-method-remote">
 		<input id="add-method-username" type="text" name="username" value="" data-rule-workemail="somevalue" required />
 	</form>
+	<form id="testForm25">
+		<input type="text" data-rule-required="true" title="something25" name="something25" id="something25" value="">
+	</form>
 </div>
 </body>
 </html>
diff --git a/test/methods.js b/test/methods.js
@@ -618,6 +618,57 @@ test( "remote, highlight all invalid fields", function( assert ) {
 		done();
 	}, 500 );
 } );
+test( "remote, unhighlighted should be invoked after being highlighted/invalid", function( assert ) {
+	expect( 6 );
+
+	var done1 = assert.async(),
+		done2 = assert.async(),
+		$form = $( "#testForm25" ),
+		$somethingField = $form.find( "input[name='something25']" ),
+		responseText = "false",
+		response = function() { return responseText; },
+		validateOptions = {
+			highlight: function( e ) {
+				$( e ).addClass( "error" );
+				ok( true, "highlight should be called" );
+			},
+			unhighlight: function( e ) {
+				$( e ).removeClass( "error" );
+				ok( true, "unhighlight should be called" );
+			},
+	        rules: {
+				something25: {
+	                required: true,
+	                remote: {
+	                    url: "response.php",
+	                    type: "post",
+						data: {
+							responseText: response
+						},
+						async: false
+					}
+				}
+			}
+		};
+
+	$somethingField.val( "something value" );
+	var v = $form.validate( validateOptions );
+	v.element( $somethingField );
+
+	setTimeout( function() {
+		equal( $somethingField.hasClass( "error" ), true, "Field 'something' should have the error class" );
+		done1();
+		$somethingField.val( "something value 2" );
+		responseText = "true";
+
+		v.element( $somethingField );
+
+		setTimeout( function() {
+			equal( $somethingField.hasClass( "error" ), false, "Field 'something' should not have the error class" );
+			done2();
+		}, 500 );
+	}, 500 );
+} );
 
 test( "Fix #697: remote validation uses wrong error messages", function( assert ) {
 	var e = $( "#username" ),
diff --git a/test/test.js b/test/test.js
@@ -42,7 +42,16 @@ $.mockjax( {
 $.mockjax( {
 	url: "response.php",
 	response: function( settings ) {
-		this.responseText = settings.data.responseText || "";
+		var responseText = settings.data.responseText;
+		if ( responseText ) {
+			if ( typeof responseText === "function" ) {
+				this.responseText = responseText();
+			} else {
+				this.responseText = responseText;
+			}
+		} else {
+			this.responseText = "";
+		}
 		this.responseStatus = settings.data.responseStatus || 200;
 		this.responseTime = settings.data.responseTime || 100;
 	}
