Rangeslider: trigger slidestart on first handle

Fixes gh-7597
Closes gh-7637

(cherry picked from commit 588cf5b)

Author: cgack

js/widgets/forms/rangeslider.js

@@ -91,6 +91,7 @@ define( [ "jquery",
 			//if the first handle is dragged send the event to the first slider
 			$.data( this._inputFirst.get(0), "mobile-slider" ).dragging = true;
 			$.data( this._inputFirst.get(0), "mobile-slider" ).refresh( event );
+			$.data( this._inputFirst.get(0), "mobile-slider" )._trigger( "start" );
 			return false;
 		},
 

tests/unit/rangeslider/index.html

@@ -52,6 +52,12 @@
 					<input type="range" name="rangeslider-last" id="rangeslider-extreams-last" value="55" min="0" max="100" data-nstest-theme="b" data-nstest-track-theme="a" />
 				</div>
 			</div>
+			<div data-nstest-role="fieldcontain">
+				<div data-nstest-role="rangeslider" id="rangeslider-startstop">
+					<input type="range" name="rangeslider-first" id="rangeslider-startstop-first" value="0" min="0" max="100" data-nstest-theme="b" data-nstest-track-theme="a" />
+					<input type="range" name="rangeslider-last" id="rangeslider-startstop-last" value="100" min="0" max="100" data-nstest-theme="b" data-nstest-track-theme="a" />
+				</div>
+			</div>
 		</form>
 	</div>
 

tests/unit/rangeslider/rangeslider_core.js

@@ -95,4 +95,39 @@
 		);
 	});
 
+	asyncTest( "fire slidestart and slidestop on both handles", function() {
+		var rangeslider = $( "#rangeslider-startstop" ),
+			widget = rangeslider.data( "mobile-rangeslider" ),
+			sliders = widget._sliders,
+			handleFirst = sliders.find( ".ui-slider-handle" ).first(),
+			handleLast = sliders.find( ".ui-slider-handle" ).last();
+
+		$.testHelper.eventCascade([
+			function() {
+				handleFirst.mousedown();
+			},
+
+			"slidestart", function(timeout) {
+				ok( !timeout, "slidestart on first handle fired" );
+				handleFirst.mouseup();
+			},
+
+			"slidestop", function(timeout) {
+				ok( !timeout, "slidestop on first handle fired" );
+				handleLast.mousedown();
+			},
+
+			"slidestart", function(timeout) {
+				ok( !timeout, "slidestart on last handle fired" );
+				handleLast.mouseup();
+			},
+
+			"slidestop", function(timeout) {
+				ok( !timeout, "slidestop on last handle fired" );
+				start();
+			}
+
+		], 50)
+	});
+
 })( jQuery );