aboutsummaryrefslogtreecommitdiffstats
path: root/tests
diff options
context:
space:
mode:
Diffstat (limited to 'tests')
-rw-r--r--tests/unit/slider/slider_events.js18
-rw-r--r--tests/visual/slider/range_slider.html47
2 files changed, 64 insertions, 1 deletions
diff --git a/tests/unit/slider/slider_events.js b/tests/unit/slider/slider_events.js
index d020d8ac6..cc5546a9f 100644
--- a/tests/unit/slider/slider_events.js
+++ b/tests/unit/slider/slider_events.js
@@ -99,7 +99,7 @@ test( "programmatic event triggers", function() {
});
test( "mouse based interaction part two: when handles overlap", function() {
- expect( 4 );
+ expect( 6 );
var element = $( "#slider1" )
.slider({
@@ -147,6 +147,22 @@ test( "mouse based interaction part two: when handles overlap", function() {
});
handles.eq( 0 ).simulate( "drag", { dx: 10 } );
+ element = $( "#slider1" )
+ .slider({
+ range: true,
+ min: 0,
+ max: 100,
+ values: [ 0, 50 ]
+ }),
+ handles = element.find( ".ui-slider-handle" );
+
+ element.slider( "option", { values: [ 100, 100 ] } );
+ handles.eq( 0 ).simulate( "drag", { dx: -10 } );
+ equal( element.slider( "values" )[ 0 ], 99, "setting both values of range slider to the maximum doesn't lock slider" );
+
+ element.slider( "option", { values: [ 0, 0 ] } );
+ handles.eq( 1 ).simulate( "drag", { dx: 10 } );
+ equal( element.slider( "values" )[ 1 ], 1, "setting both values of range slider to the minimum doesn't lock slider" );
});
test( "event data", function() {
diff --git a/tests/visual/slider/range_slider.html b/tests/visual/slider/range_slider.html
new file mode 100644
index 000000000..2b041f377
--- /dev/null
+++ b/tests/visual/slider/range_slider.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+ <meta charset="UTF-8">
+ <title>jQuery UI Slider - Range slider</title>
+ <link rel="stylesheet" href="../../../themes/base/all.css">
+ <style>
+ #wrapper {
+ font-family: Arial;
+ width: 500px;
+ margin: 20px auto;
+ }
+ </style>
+ <script src="../../../external/jquery/jquery.js"></script>
+ <script src="../../../ui/core.js"></script>
+ <script src="../../../ui/widget.js"></script>
+ <script src="../../../ui/mouse.js"></script>
+ <script src="../../../ui/slider.js"></script>
+</head>
+<body>
+<div id="wrapper">
+ <h1>Range Slider</h1>
+ <h3>When set both values of range slider to the maximum, slider should not lock</h3>
+ <div id="slider"></div>
+ <br>
+ <button id="set-max-values">set values to max</button>
+ <button id="set-min-values">set values to min</button>
+</div>
+
+<script>
+ var el = $( "#slider" ).slider({
+ range: true,
+ min: 0,
+ max: 100,
+ values: [ 0, 50 ]
+ });
+
+ $( "#set-max-values" ).on( "click", function() {
+ el.slider( "option", { values: [ 100, 100 ] } );
+ });
+
+ $( "#set-min-values" ).on( "click", function() {
+ el.slider( "option", { values: [ 0, 0 ] } );
+ });
+</script>
+</body>
+</html>