Permalink
Browse files

Slider and Rangeslider: Express module dependency

Both modules have a hard dependency on the "vmouse" module that should
be expressed in AMD.

Re gh-5987
Closes gh-7383
Closes gh-7274
  • Loading branch information...
1 parent 5b23d31 commit 44e2d989c4bcaa272563d447d12a3fdbc0699591 @jugglinmike jugglinmike committed with arschmitz May 8, 2014
@@ -9,6 +9,7 @@ define( [ "jquery",
"../../core",
"../../widget",
"./textinput",
+ "../../vmouse",
"./reset",
"./slider" ], function( jQuery ) {
//>>excludeEnd("jqmBuildExclude");
@@ -9,6 +9,7 @@ define( [ "jquery",
"../../core",
"../../widget",
"./textinput",
+ "../../vmouse",
"./reset" ], function( jQuery ) {
//>>excludeEnd("jqmBuildExclude");
(function( $, undefined ) {
@@ -0,0 +1,38 @@
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>jQuery Mobile RangeSlider Test Suite</title>
+
+ <script src="../../../external/requirejs/require.js"></script>
+ <script src="../../../js/requirejs.config.js"></script>
+ <script src="../../../js/jquery.tag.inserter.js"></script>
+ <script src="../../../tests/jquery.testHelper.js"></script>
+
+ <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"/>
+ <link rel="stylesheet" href="../../../external/qunit/qunit.css"/>
+ <link rel="stylesheet" href="../../jqm-tests.css"/>
+ <script src="../../../external/qunit/qunit.js"></script>
+ <script>
+ $.testHelper.asyncLoad([
+ [
+ "widgets/forms/rangeslider"
+ ],
+ [
+ "rangeslider_core.js"
+ ]
+ ]);
+ </script>
+
+ <script src="../../swarminject.js"></script>
+</head>
+<body>
+ <div id="qunit"></div>
+
+ <form class="ui-body-a" id="plain">
+ <input type="range"></input>
+ <input type="range"></input>
+ </form>
+</body>
+</html>
@@ -0,0 +1,40 @@
+test( "Rangeslider widget works correctly", function() {
+ var rangeslider = $( "#plain" ).rangeslider(),
+ handles = rangeslider.parent().find( ".ui-slider-handle" ),
+ track = handles.closest( ".ui-slider-track" ),
+ offset = handles.offset();
+
+ deepEqual( rangeslider.rangeslider( "widget" ).hasClass( "ui-rangeslider" ), true,
+ "Has class ui-rangeslider" );
+ equal( handles.length, 2, "Contains two handle elements" );
+ equal( track.length, 1, "Contains one track element" );
+
+ function moveHandle( handle, xPos ) {
+ var trackWidth, trackX,
+ down = $.Event( "mousedown" ),
+ move = $.Event( "mousemove" ),
+ up = $.Event( "mouseup" ),
+ offset = handle.offset();
+
+ down.target = move.target = up.target = handle[ 0 ];
+ down.pageY = move.pageY = up.pageY = offset.top;
+ down.pageX = offset.left;
+ up.pageX = move.pageX = xPos;
+ handle.trigger( down );
+ handle.trigger( move );
+ handle.trigger( up );
+ }
+
+ // GH-7274: Events dependency
+ // These tests cannot be expressed in the integration tests because the
+ // "events/touch" module is artificially loaded in that environment.
+ trackWidth = track.width();
+ trackX = track.offset().left;
+ ok( trackWidth > 0, "Track has a non-zero width" );
+
+ moveHandle( handles.eq( 0 ), trackX + trackWidth * 0.2 );
+ moveHandle( handles.eq( 1 ), trackX + trackWidth * 0.8 );
+ ok( handles.eq( 0 ).offset().left > 0, "Lower handle responds to user interaction" );
+ ok( handles.eq( 1 ).offset().left > handles.eq( 0 ).offset().left,
+ "Upper handle responds to user interaction" );
+});
@@ -0,0 +1,37 @@
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>jQuery Mobile Slider Test Suite</title>
+
+ <script src="../../../external/requirejs/require.js"></script>
+ <script src="../../../js/requirejs.config.js"></script>
+ <script src="../../../js/jquery.tag.inserter.js"></script>
+ <script src="../../../tests/jquery.testHelper.js"></script>
+
+ <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"/>
+ <link rel="stylesheet" href="../../../external/qunit/qunit.css"/>
+ <link rel="stylesheet" href="../../jqm-tests.css"/>
+ <script src="../../../external/qunit/qunit.js"></script>
+ <script>
+ $.testHelper.asyncLoad([
+ [
+ "widgets/forms/slider"
+ ],
+ [
+ "slider_core.js"
+ ]
+ ]);
+ </script>
+
+ <script src="../../swarminject.js"></script>
+</head>
+<body>
+ <div id="qunit"></div>
+
+ <form class="ui-body-a">
+ <input type="range" id="plain"></input>
+ </form>
+</body>
+</html>
@@ -0,0 +1,36 @@
+test( "Slider widget works correctly", function() {
+ var trackWidth, trackX,
+ slider = $( "#plain" ).slider(),
+ handle = slider.parent().find( ".ui-slider-handle" ),
+ track = handle.closest( ".ui-slider-track" ),
+ offset = handle.offset();
+
+ deepEqual( slider.slider( "widget" ).hasClass( "ui-slider-input" ), true,
+ "Has class ui-slider-input" );
+ equal( handle.length, 1, "Slider contains a handle element" );
+
+ function moveHandle( handle, xPos ) {
+ var down = $.Event( "mousedown" ),
+ move = $.Event( "mousemove" ),
+ up = $.Event( "mouseup" ),
+ offset = handle.offset();
+
+ down.target = move.target = up.target = handle[ 0 ];
+ down.pageY = move.pageY = up.pageY = offset.top;
+ down.pageX = offset.left;
+ up.pageX = move.pageX = xPos;
+ handle.trigger( down );
+ handle.trigger( move );
+ handle.trigger( up );
+ }
+
+ // GH-7274: Events dependency
+ // This test cannot be expressed in the integration tests because the
+ // "events/touch" module is artificially loaded in that environment.
+ trackWidth = track.width();
+ trackX = track.offset().left;
+ ok( trackWidth > 0, "Track has a non-zero width" );
+
+ moveHandle( handle, trackX + trackWidth * 0.5 );
+ ok( handle.offset().left > 0, "Handle responds to user interaction" );
+});

0 comments on commit 44e2d98

Please sign in to comment.