diff options
author | David Petersen <public@petersendidit.com> | 2013-02-07 08:33:26 -0600 |
---|---|---|
committer | David Petersen <public@petersendidit.com> | 2013-02-07 09:19:15 -0600 |
commit | ab408c9b82430e7a65a9269441cc0c0e2af95770 (patch) | |
tree | a37dd35a270394ee3eb3c4b2ecac7543b37a66b2 | |
parent | faea3d73116db3e397de1c552e06b5c64b88b6ca (diff) | |
download | jquery-ui-ab408c9b82430e7a65a9269441cc0c0e2af95770.tar.gz jquery-ui-ab408c9b82430e7a65a9269441cc0c0e2af95770.zip |
Slider: Coding standards for tests
-rw-r--r-- | tests/unit/slider/slider_core.js | 238 | ||||
-rw-r--r-- | tests/unit/slider/slider_events.js | 78 | ||||
-rw-r--r-- | tests/unit/slider/slider_methods.js | 118 | ||||
-rw-r--r-- | tests/unit/slider/slider_options.js | 190 |
4 files changed, 310 insertions, 314 deletions
diff --git a/tests/unit/slider/slider_core.js b/tests/unit/slider/slider_core.js index 7195147cc..19c9abb8e 100644 --- a/tests/unit/slider/slider_core.js +++ b/tests/unit/slider/slider_core.js @@ -1,300 +1,300 @@ /* * slider unit tests */ -(function($) { +(function( $ ) { // // Slider Test Helper Functions // -var el, options; +var element, options; function handle() { - return el.find(".ui-slider-handle"); + return element.find( ".ui-slider-handle" ); } // Slider Tests -module("slider: core"); +module( "slider: core" ); -test("keydown HOME on handle sets value to min", function() { +test( "keydown HOME on handle sets value to min", function() { expect( 2 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 0); + element.slider( "value", 0 ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.HOME }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equal(element.slider( "value" ), options.min ); - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 0); + element.slider( "value", 0 ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.HOME }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equal(element.slider( "value" ), options.min) ; - el.slider("destroy"); + element.slider( "destroy" ); }); -test("keydown END on handle sets value to max", function() { +test( "keydown END on handle sets value to max", function() { expect( 2 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 0); + element.slider( "value", 0 ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.END }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equal(element.slider( "value" ), options.max) ; - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 0); + element.slider( "value", 0 ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.END }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equal(element.slider( "value" ), options.max ); - el.slider("destroy"); + element.slider( "destroy" ); }); -test("keydown PAGE_UP on handle increases value by 1/5 range, not greater than max", function() { +test( "keydown PAGE_UP on handle increases value by 1/5 range, not greater than max", function() { expect( 4 ); - $.each(["horizontal", "vertical"], function(i, orientation) { - el = $("<div></div>"); + $.each( [ "horizontal", "vertical" ], function( i, orientation ) { + element = $( "<div></div>" ); options = { max: 100, min: 0, orientation: orientation, step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 70); + element.slider( "value", 70); - handle().simulate("keydown", { keyCode: $.ui.keyCode.PAGE_UP }); - equal(el.slider("value"), 90); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal(element.slider( "value" ), 90); - handle().simulate("keydown", { keyCode: $.ui.keyCode.PAGE_UP }); - equal(el.slider("value"), 100); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal(element.slider( "value" ), 100); - el.slider("destroy"); + element.slider( "destroy" ); }); }); -test("keydown PAGE_DOWN on handle decreases value by 1/5 range, not less than min", function() { +test( "keydown PAGE_DOWN on handle decreases value by 1/5 range, not less than min", function() { expect( 4 ); - $.each(["horizontal", "vertical"], function(i, orientation) { - el = $("<div></div>"); + $.each( [ "horizontal", "vertical" ], function( i, orientation ) { + element = $( "<div></div>" ); options = { max: 100, min: 0, orientation: orientation, step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", 30); + element.slider( "value", 30); - handle().simulate("keydown", { keyCode: $.ui.keyCode.PAGE_DOWN }); - equal(el.slider("value"), 10); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal(element.slider( "value" ), 10); - handle().simulate("keydown", { keyCode: $.ui.keyCode.PAGE_DOWN }); - equal(el.slider("value"), 0); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal(element.slider( "value" ), 0 ); - el.slider("destroy"); + element.slider( "destroy" ); }); }); -test("keydown UP on handle increases value by step, not greater than max", function() { +test( "keydown UP on handle increases value by step, not greater than max", function() { expect( 4 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider(options); - el.slider("value", options.max - options.step); + element.slider( "value", options.max - options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.UP }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal(element.slider( "value" ), options.max ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.UP }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal(element.slider( "value" ), options.max ); - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", options.max - options.step); + element.slider( "value", options.max - options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.UP }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal(element.slider( "value" ), options.max ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.UP }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal(element.slider( "value" ), options.max ); - el.slider("destroy"); + element.slider( "destroy" ); }); -test("keydown RIGHT on handle increases value by step, not greater than max", function() { +test( "keydown RIGHT on handle increases value by step, not greater than max", function() { expect( 4 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider(options); - el.slider("value", options.max - options.step); + element.slider( "value", options.max - options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal(element.slider( "value" ), options.max); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal(element.slider( "value" ), options.max ); - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", options.max - options.step); + element.slider( "value", options.max - options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal(element.slider( "value" ), options.max ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal(el.slider("value"), options.max); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal(element.slider( "value" ), options.max ); - el.slider("destroy"); + element.slider( "destroy" ); }); -test("keydown DOWN on handle decreases value by step, not less than min", function() { +test( "keydown DOWN on handle decreases value by step, not less than min", function() { expect( 4 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", options.min + options.step); + element.slider( "value", options.min + options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.DOWN }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal(element.slider( "value" ), options.min); - handle().simulate("keydown", { keyCode: $.ui.keyCode.DOWN }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal(element.slider( "value" ), options.min ); - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", options.min + options.step); + element.slider( "value", options.min + options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.DOWN }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal(element.slider( "value" ), options.min); - handle().simulate("keydown", { keyCode: $.ui.keyCode.DOWN }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal(element.slider( "value" ), options.min ); - el.slider("destroy"); + element.slider( "destroy" ); }); -test("keydown LEFT on handle decreases value by step, not less than min", function() { +test( "keydown LEFT on handle decreases value by step, not less than min", function() { expect( 4 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "horizontal", step: 1 }; - el.slider(options); + element.slider(options); - el.slider("value", options.min + options.step); + element.slider( "value", options.min + options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.LEFT }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal(element.slider( "value" ), options.min ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.LEFT }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal(element.slider( "value" ), options.min ); - el.slider("destroy"); + element.slider( "destroy" ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 5, min: -5, orientation: "vertical", step: 1 }; - el.slider(options); + element.slider( options ); - el.slider("value", options.min + options.step); + element.slider( "value", options.min + options.step ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.LEFT }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal(element.slider( "value" ), options.min ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.LEFT }); - equal(el.slider("value"), options.min); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal(element.slider( "value" ), options.min ); - el.slider("destroy"); + element.slider( "destroy" ); }); -})(jQuery); +})( jQuery ); diff --git a/tests/unit/slider/slider_events.js b/tests/unit/slider/slider_events.js index d5e7dff45..92b0bdedd 100644 --- a/tests/unit/slider/slider_events.js +++ b/tests/unit/slider/slider_events.js @@ -1,7 +1,7 @@ /* * slider_events.js */ -(function($) { +(function( $ ) { module( "slider: events" ); @@ -10,9 +10,9 @@ module( "slider: events" ); // value (even if same as previous value), via mouse(mouseup) or keyboard(keyup) // or value method/option" test( "mouse based interaction", function() { - expect(4); + expect( 4 ); - var el = $( "#slider1" ) + var element = $( "#slider1" ) .slider({ start: function( event ) { equal( event.originalEvent.type, "mousedown", "start triggered by mousedown" ); @@ -28,15 +28,15 @@ test( "mouse based interaction", function() { } }); - el.find( ".ui-slider-handle" ).eq( 0 ) + element.find( ".ui-slider-handle" ).eq( 0 ) .simulate( "drag", { dx: 10, dy: 10 } ); }); test( "keyboard based interaction", function() { - expect(3); + expect( 3 ); // Test keyup at end of handle slide (keyboard) - var el = $( "#slider1" ) + var element = $( "#slider1" ) .slider({ start: function( event ) { equal( event.originalEvent.type, "keydown", "start triggered by keydown" ); @@ -52,17 +52,17 @@ test( "keyboard based interaction", function() { } }); - el.find( ".ui-slider-handle" ).eq( 0 ) + element.find( ".ui-slider-handle" ).eq( 0 ) .simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ) .simulate( "keypress", { keyCode: $.ui.keyCode.LEFT } ) .simulate( "keyup", { keyCode: $.ui.keyCode.LEFT } ); }); test( "programmatic event triggers", function() { - expect(6); + expect( 6 ); // Test value method - var el = $( "<div></div>" ) + var element = $( "<div></div>" ) .slider({ change: function() { ok( true, "change triggered by value method" ); @@ -71,17 +71,17 @@ test( "programmatic event triggers", function() { .slider( "value", 0 ); // Test values method - el = $( "<div></div>" ) + element = $( "<div></div>" ) .slider({ values: [ 10, 20 ], change: function() { ok( true, "change triggered by values method" ); } }) - .slider( "values", [80, 90] ); + .slider( "values", [ 80, 90 ] ); // Test value option - el = $( "<div></div>" ) + element = $( "<div></div>" ) .slider({ change: function() { ok( true, "change triggered by value option" ); @@ -90,66 +90,66 @@ test( "programmatic event triggers", function() { .slider( "option", "value", 0 ); // Test values option - el = $( "<div></div>" ) + element = $( "<div></div>" ) .slider({ values: [ 10, 20 ], change: function() { ok( true, "change triggered by values option" ); } }) - .slider( "option", "values", [80, 90] ); + .slider( "option", "values", [ 80, 90 ] ); }); test( "mouse based interaction part two: when handles overlap", function() { - expect(4); + expect( 4 ); - var el = $( "#slider1" ) + var element = $( "#slider1" ) .slider({ values: [ 0, 0, 0 ], start: function( event, ui ) { - equal(handles.index(ui.handle), 2, "rightmost handle activated when overlapping at minimum (#3736)"); + equal( handles.index( ui.handle ), 2, "rightmost handle activated when overlapping at minimum (#3736)" ); } }), - handles = el.find( ".ui-slider-handle" ); - handles.eq(0).simulate( "drag", { dx: 10 } ); - el.slider( "destroy" ); + handles = element.find( ".ui-slider-handle" ); + handles.eq( 0 ).simulate( "drag", { dx: 10 } ); + element.slider( "destroy" ); - el = $( "#slider1" ) + element = $( "#slider1" ) .slider({ values: [ 10, 10, 10 ], max: 10, start: function( event, ui ) { - equal(handles.index(ui.handle), 0, "leftmost handle activated when overlapping at maximum"); + equal( handles.index( ui.handle ), 0, "leftmost handle activated when overlapping at maximum" ); } }), - handles = el.find( ".ui-slider-handle" ); - handles.eq(0).simulate( "drag", { dx: -10 } ); - el.slider( "destroy" ); + handles = element.find( ".ui-slider-handle" ); + handles.eq( 0 ).simulate( "drag", { dx: -10 } ); + element.slider( "destroy" ); - el = $( "#slider1" ) + element = $( "#slider1" ) .slider({ values: [ 19, 20 ] }), - handles = el.find( ".ui-slider-handle" ); - handles.eq(0).simulate( "drag", { dx: 10 } ); - el.one("slidestart", function(event, ui) { - equal(handles.index(ui.handle), 0, "left handle activated if left was moved last"); + handles = element.find( ".ui-slider-handle" ); + handles.eq( 0 ).simulate( "drag", { dx: 10 } ); + element.one( "slidestart", function( event, ui ) { + equal( handles.index( ui.handle ), 0, "left handle activated if left was moved last" ); }); - handles.eq(0).simulate( "drag", { dx: 10 } ); - el.slider( "destroy" ); + handles.eq( 0 ).simulate( "drag", { dx: 10 } ); + element.slider( "destroy" ); - el = $( "#slider1" ) + element = $( "#slider1" ) .slider({ values: [ 19, 20 ] }), - handles = el.find( ".ui-slider-handle" ); - handles.eq(1).simulate( "drag", { dx: -10 } ); - el.one("slidestart", function(event, ui) { - equal(handles.index(ui.handle), 1, "right handle activated if right was moved last (#3467)"); + handles = element.find( ".ui-slider-handle" ); + handles.eq( 1 ).simulate( "drag", { dx: -10 } ); + element.one( "slidestart", function( event, ui ) { + equal( handles.index( ui.handle ), 1, "right handle activated if right was moved last (#3467)" ); }); - handles.eq(0).simulate( "drag", { dx: 10 } ); + handles.eq( 0 ).simulate( "drag", { dx: 10 } ); }); -}( jQuery ) ); +})( jQuery ); diff --git a/tests/unit/slider/slider_methods.js b/tests/unit/slider/slider_methods.js index 73b8eb739..75df230a6 100644 --- a/tests/unit/slider/slider_methods.js +++ b/tests/unit/slider/slider_methods.js @@ -1,99 +1,99 @@ /* * slider_methods.js */ -(function($) { +(function( $ ) { -module("slider: methods"); +module( "slider: methods" ); -test("init", function() { +test( "init", function() { expect(5); - $("<div></div>").appendTo("body").slider().remove(); - ok(true, ".slider() called on element"); + $( "<div></div>" ).appendTo( "body" ).slider().remove(); + ok( true, ".slider() called on element" ); - $([]).slider().remove(); - ok(true, ".slider() called on empty collection"); + $( [] ).slider().remove(); + ok( true, ".slider() called on empty collection" ); - $("<div></div>").slider().remove(); - ok(true, ".slider() called on disconnected DOMElement"); + $( "<div></div>" ).slider().remove(); + ok( true, ".slider() called on disconnected DOMElement" ); - var el = $("<div></div>").slider(); - el.slider("option", "foo"); - el.remove(); - ok(true, "arbitrary option getter after init"); + var element = $( "<div></div>" ).slider(); + element.slider( "option", "foo" ); + element.remove(); + ok( true, "arbitrary option getter after init" ); - $("<div></div>").slider().slider("option", "foo", "bar").remove(); - ok(true, "arbitrary option setter after init"); + $( "<div></div>" ).slider().slider( "option", "foo", "bar" ).remove(); + ok( true, "arbitrary option setter after init" ); }); -test("destroy", function() { +test( "destroy", function() { expect( 1 ); domEqual( "#slider1", function() { $( "#slider1" ).slider().slider( "destroy" ); }); }); -test("enable", function() { +test( "enable", function() { expect( 5 ); - var el, - expected = $("<div></div>").slider(), - actual = expected.slider("enable"); - equal(actual, expected, "enable is chainable"); + var element, + expected = $( "<div></div>" ).slider(), + actual = expected.slider( "enable" ); + equal(actual, expected, "enable is chainable" ); - el = $("<div></div>").slider({ disabled: true }); - ok(el.hasClass("ui-state-disabled"), "slider has ui-state-disabled class before enable method call"); - ok(el.hasClass("ui-slider-disabled"), "slider has ui-slider-disabled class before enable method call"); - el.slider("enable"); - ok(!el.hasClass("ui-state-disabled"), "slider does not have ui-state-disabled class after enable method call"); - ok(!el.hasClass("ui-slider-disabled"), "slider does not have ui-slider-disabled class after enable method call"); + element = $( "<div></div>" ).slider({ disabled: true }); + ok( element.hasClass( "ui-state-disabled" ), "slider has ui-state-disabled class before enable method call" ); + ok( element.hasClass( "ui-slider-disabled" ), "slider has ui-slider-disabled class before enable method call" ); + element.slider( "enable" ); + ok( !element.hasClass( "ui-state-disabled" ), "slider does not have ui-state-disabled class after enable method call" ); + ok( !element.hasClass( "ui-slider-disabled" ), "slider does not have ui-slider-disabled class after enable method call" ); }); -test("disable", function() { +test( "disable", function() { expect( 5 ); - var el, - expected = $("<div></div>").slider(), - actual = expected.slider("disable"); - equal(actual, expected, "disable is chainable"); + var element, + expected = $( "<div></div>" ).slider(), + actual = expected.slider( "disable" ); + equal(actual, expected, "disable is chainable" ); - el = $("<div></div>").slider({ disabled: false }); - ok(!el.hasClass("ui-state-disabled"), "slider does not have ui-state-disabled class before disabled method call"); - ok(!el.hasClass("ui-slider-disabled"), "slider does not have ui-slider-disabled class before disable method call"); - el.slider("disable"); - ok(el.hasClass("ui-state-disabled"), "slider has ui-state-disabled class after disable method call"); - ok(el.hasClass("ui-slider-disabled"), "slider has ui-slider-disabled class after disable method call"); + element = $( "<div></div>" ).slider({ disabled: false }); + ok( !element.hasClass( "ui-state-disabled" ), "slider does not have ui-state-disabled class before disabled method call" ); + ok( !element.hasClass( "ui-slider-disabled" ), "slider does not have ui-slider-disabled class before disable method call" ); + element.slider( "disable" ); + ok( element.hasClass( "ui-state-disabled" ), "slider has ui-state-disabled class after disable method call" ); + ok( element.hasClass( "ui-slider-disabled" ), "slider has ui-slider-disabled class after disable method call" ); }); -test("value", function() { +test( "value", function() { expect( 17 ); - $([false, "min", "max"]).each(function() { - var el = $("<div></div>").slider({ + $( [ false, "min", "max" ] ).each(function() { + var element = $( "<div></div>" ).slider({ range: this, value: 5 }); - equal(el.slider("value"), 5, "range: " + this + " slider method get"); - equal(el.slider("value", 10), el, "value method is chainable"); - equal(el.slider("value"), 10, "range: " + this + " slider method set"); - el.remove(); + equal( element.slider( "value" ), 5, "range: " + this + " slider method get" ); + equal( element.slider( "value", 10), element, "value method is chainable" ); + equal( element.slider( "value" ), 10, "range: " + this + " slider method set" ); + element.remove(); }); - var el = $("<div></div>").slider({ + var element = $( "<div></div>" ).slider({ min: -1, value: 0, max: 1 }); // min with value option vs value method - el.slider("option", "value", -2); - equal(el.slider("option", "value"), -2, "value option does not respect min"); - equal(el.slider("value"), -1, "value method get respects min"); - equal(el.slider("value", -2), el, "value method is chainable"); - equal(el.slider("option", "value"), -1, "value method set respects min"); + element.slider( "option", "value", -2 ); + equal( element.slider( "option", "value" ), -2, "value option does not respect min" ); + equal( element.slider( "value" ), -1, "value method get respects min" ); + equal( element.slider( "value", -2 ), element, "value method is chainable" ); + equal( element.slider( "option", "value" ), -1, "value method set respects min" ); // max with value option vs value method - el.slider("option", "value", 2); - equal(el.slider("option", "value"), 2, "value option does not respect max"); - equal(el.slider("value"), 1, "value method get respects max"); - equal(el.slider("value", 2), el, "value method is chainable"); - equal(el.slider("option", "value"), 1, "value method set respects max"); + element.slider( "option", "value", 2); + equal( element.slider( "option", "value" ), 2, "value option does not respect max" ); + equal( element.slider( "value" ), 1, "value method get respects max" ); + equal( element.slider( "value", 2 ), element, "value method is chainable" ); + equal( element.slider( "option", "value" ), 1, "value method set respects max" ); }); -//test("values", function() { -// ok(false, "missing test - untested code is broken code."); +//test( "values", function() { +// ok(false, "missing test - untested code is broken code." ); //}); -})(jQuery); +})( jQuery ); diff --git a/tests/unit/slider/slider_options.js b/tests/unit/slider/slider_options.js index dd213d03b..dfa94696a 100644 --- a/tests/unit/slider/slider_options.js +++ b/tests/unit/slider/slider_options.js @@ -1,50 +1,50 @@ /* * slider_options.js */ -(function($) { +(function( $ ) { -var el, options; +var element, options; function handle() { - return el.find(".ui-slider-handle"); + return element.find( ".ui-slider-handle" ); } -module("slider: options"); +module( "slider: options" ); test( "disabled", function(){ expect( 8 ); var count = 0; - el = $( "#slider1" ).slider(); - el.on( "slidestart", function() { + element = $( "#slider1" ).slider(); + element.on( "slidestart", function() { count++; }); // enabled - ok( !el.hasClass( "ui-slider-disabled" ), "no disabled class" ); - equal( el.slider( "option", "disabled" ), false , "is not disabled" ); + ok( !element.hasClass( "ui-slider-disabled" ), "no disabled class" ); + equal( element.slider( "option", "disabled" ), false , "is not disabled" ); handle().simulate( "drag", { dx: 10 } ); - equal( count, 1, "slider moved"); + equal( count, 1, "slider moved" ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal( count, 2, "slider moved"); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal( count, 2, "slider moved" ); // disabled - el.slider( "option", "disabled", true ); - ok( el.hasClass( "ui-slider-disabled" ), "has disabled class" ); - equal( el.slider( "option", "disabled" ), true, "is disabled" ); + element.slider( "option", "disabled", true ); + ok( element.hasClass( "ui-slider-disabled" ), "has disabled class" ); + equal( element.slider( "option", "disabled" ), true, "is disabled" ); handle().simulate( "drag", { dx: 10 } ); - equal( count, 2, "slider did not move"); + equal( count, 2, "slider did not move" ); - handle().simulate("keydown", { keyCode: $.ui.keyCode.RIGHT }); - equal( count, 2, "slider did not move"); + handle().simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal( count, 2, "slider did not move" ); }); -test("max", function() { +test( "max", function() { expect( 2 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 37, @@ -54,16 +54,16 @@ test("max", function() { value: 50 }; - el.slider(options); - ok(el.slider("option", "value") === options.value, "value option is not contained by max"); - ok(el.slider("value") === options.max, "value method is contained by max"); - el.slider("destroy"); + element.slider( options ); + ok(element.slider( "option", "value" ) === options.value, "value option is not contained by max" ); + ok(element.slider( "value" ) === options.max, "value method is contained by max" ); + element.slider( "destroy" ); }); -test("min", function() { +test( "min", function() { expect( 2 ); - el = $("<div></div>"); + element = $( "<div></div>" ); options = { max: 37, @@ -73,16 +73,16 @@ test("min", function() { value: 2 }; - el.slider(options); - ok(el.slider("option", "value") === options.value, "value option is not contained by min"); - ok(el.slider("value") === options.min, "value method is contained by min"); - el.slider("destroy"); + element.slider( options ); + ok( element.slider( "option", "value" ) === options.value, "value option is not contained by min" ); + ok( element.slider( "value" ) === options.min, "value method is contained by min" ); + element.slider( "destroy" ); }); -test("orientation", function() { +test( "orientation", function() { expect( 6 ); - el = $("#slider1"); + element = $( "#slider1" ); options = { max: 2, @@ -91,14 +91,14 @@ test("orientation", function() { value: 1 }; - var percentVal = (options.value - options.min) / (options.max - options.min) * 100; + var percentVal = ( options.value - options.min ) / ( options.max - options.min ) * 100; - el.slider(options).slider("option", "orientation", "horizontal"); - ok(el.is(".ui-slider-horizontal"), "horizontal slider has class .ui-slider-horizontal"); - ok(!el.is(".ui-slider-vertical"), "horizontal slider does not have class .ui-slider-vertical"); - equal(handle()[0].style.left, percentVal + "%", "horizontal slider handle is positioned with left: %"); + element.slider( options ).slider( "option", "orientation", "horizontal" ); + ok( element.is( ".ui-slider-horizontal" ), "horizontal slider has class .ui-slider-horizontal" ); + ok( !element.is( ".ui-slider-vertical" ), "horizontal slider does not have class .ui-slider-vertical" ); + equal( handle()[0].style.left, percentVal + "%", "horizontal slider handle is positioned with left: %" ); - el.slider("destroy"); + element.slider( "destroy" ) ; options = { max: 2, @@ -107,132 +107,128 @@ test("orientation", function() { value: -1 }; - percentVal = (options.value - options.min) / (options.max - options.min) * 100; + percentVal = ( options.value - options.min ) / ( options.max - options.min ) * 100; - el.slider(options).slider("option", "orientation", "vertical"); - ok(el.is(".ui-slider-vertical"), "vertical slider has class .ui-slider-vertical"); - ok(!el.is(".ui-slider-horizontal"), "vertical slider does not have class .ui-slider-horizontal"); - equal(handle()[0].style.bottom, percentVal + "%", "vertical slider handle is positioned with bottom: %"); + element.slider( options ).slider( "option", "orientation", "vertical" ); + ok( element.is( ".ui-slider-vertical" ), "vertical slider has class .ui-slider-vertical" ); + ok( !element.is( ".ui-slider-horizontal" ), "vertical slider does not have class .ui-slider-horizontal" ); + equal( handle()[0].style.bottom, percentVal + "%", "vertical slider handle is positioned with bottom: %" ); - el.slider("destroy"); + element.slider( "destroy" ); }); -//test("range", function() { -// ok(false, "missing test - untested code is broken code."); -//}); - //spec: http://wiki.jqueryui.com/Slider#specs // value option/method: the value option is not restricted by min/max/step. // What is returned by the value method is restricted by min (>=), max (<=), and step (even multiple) -test("step", function() { +test( "step", function() { expect( 9 ); - var el = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ min: 0, value: 0, step: 10, max: 100 }); - equal( el.slider("value"), 0 ); + equal( element.slider( "value" ), 0 ); - el.slider("value", 1); - equal( el.slider("value"), 0 ); + element.slider( "value", 1 ); + equal( element.slider( "value" ), 0 ); - el.slider("value", 9); - equal( el.slider("value"), 10 ); + element.slider( "value", 9 ); + equal( element.slider( "value" ), 10 ); - el.slider("value", 11); - equal( el.slider("value"), 10 ); + element.slider( "value", 11 ); + equal( element.slider( "value" ), 10 ); - el.slider("value", 19); - equal( el.slider("value"), 20 ); + element.slider( "value", 19 ); + equal( element.slider( "value" ), 20 ); - el = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ min: 0, value: 0, step: 20, max: 100 }); - el.slider("value", 0); + element.slider( "value", 0 ); - el.slider("option", "value", 1); - equal( el.slider("value"), 0 ); + element.slider( "option", "value", 1 ); + equal( element.slider( "value" ), 0 ); - el.slider("option", "value", 9); - equal( el.slider("value"), 0 ); + element.slider( "option", "value", 9 ); + equal( element.slider( "value" ), 0 ); - el.slider("option", "value", 11); - equal( el.slider("value"), 20 ); + element.slider( "option", "value", 11 ); + equal( element.slider( "value" ), 20 ); - el.slider("option", "value", 19); - equal( el.slider("value"), 20 ); + element.slider( "option", "value", 19 ); + equal( element.slider( "value" ), 20 ); - el.slider("destroy"); + element.slider( "destroy" ); }); -//test("value", function() { -// ok(false, "missing test - untested code is broken code."); +//test( "value", function() { +// ok(false, "missing test - untested code is broken code." ); //}); -test("values", function() { +test( "values", function() { expect( 2 ); // testing multiple ranges on the same page, the object reference to the values // property is preserved via multiple range elements, so updating options.values // of 1 slider updates options.values of all the others var ranges = $([ - document.createElement("div"), - document.createElement("div") + document.createElement( "div" ), + document.createElement( "div" ) ]).slider({ range: true, values: [ 25, 75 ] }); notStrictEqual( - ranges.eq(0).data("uiSlider").options.values, - ranges.eq(1).data("uiSlider").options.values, + ranges.eq( 0 ).data( "uiSlider" ).options.values, + ranges.eq( 1 ).data( "uiSlider" ).options.values, "multiple range sliders should not have a reference to the same options.values array" ); - ranges.eq(0).slider("values", 0, 10); + ranges.eq( 0 ).slider( "values", 0, 10 ); notEqual( - ranges.eq(0).slider("values", 0), - ranges.eq(1).slider("values", 0), + ranges.eq( 0 ).slider( "values", 0 ), + ranges.eq( 1 ).slider( "values", 0 ), "the values for multiple sliders should be different" ); }); test( "range", function() { expect( 27 ); - var element, range; + var range; // min - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: "min", min: 1, max: 10, step: 1 }); - equal( element.find( ".ui-slider-handle" ).length, 1, "range min, one handle"); + equal( element.find( ".ui-slider-handle" ).length, 1, "range min, one handle" ); equal( element.find( ".ui-slider-range-min" ).length, 1, "range min" ); element.slider( "destroy" ); // max - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: "max", min: 1, max: 10, step: 1 }); - equal( element.find( ".ui-slider-handle" ).length, 1, "range max, one handle"); + equal( element.find( ".ui-slider-handle" ).length, 1, "range max, one handle" ); equal( element.find( ".ui-slider-range-max" ).length, 1, "range max" ); element.slider( "destroy" ); // true - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: true, min: 1, max: 10, @@ -240,46 +236,46 @@ test( "range", function() { }); range = element.find( ".ui-slider-range" ); - equal( element.find( ".ui-slider-handle" ).length, 2, "range true, two handles"); - ok( !range.is( ".ui-slider-range-min"), "range true" ); - ok( !range.is( ".ui-slider-range-max"), "range true" ); + equal( element.find( ".ui-slider-handle" ).length, 2, "range true, two handles" ); + ok( !range.is( ".ui-slider-range-min" ), "range true" ); + ok( !range.is( ".ui-slider-range-max" ), "range true" ); element.slider( "destroy" ); // Change range from min to max - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: "min", min: 1, max: 10, step: 1 }).slider( "option", "range", "max" ); - equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from min to max, one handle"); + equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from min to max, one handle" ); equal( element.find( ".ui-slider-range-min" ).length, 0, "range switch from min to max" ); equal( element.find( ".ui-slider-range-max" ).length, 1, "range switch from min to max" ); element.slider( "destroy" ); // Change range from max to min - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: "max", min: 1, max: 10, step: 1 }).slider( "option", "range", "min" ); - equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from max to min, one handle"); + equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from max to min, one handle" ); equal( element.find( ".ui-slider-range-max" ).length, 0, "range switch from max to min" ); equal( element.find( ".ui-slider-range-min" ).length, 1, "range switch from max to min" ); element.slider( "destroy" ); // Change range from max to true - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: "max", min: 1, max: 10, step: 1 }).slider( "option", "range", true ); - equal( element.find( ".ui-slider-handle" ).length, 2, "range switch from max to true, two handles"); + equal( element.find( ".ui-slider-handle" ).length, 2, "range switch from max to true, two handles" ); equal( element.find( ".ui-slider-range-max" ).length, 0, "range switch from max to true" ); equal( element.find( ".ui-slider-range-min" ).length, 0, "range switch from max to true" ); equal( element.slider( "option", "value" ), 0 , "option value" ); @@ -289,14 +285,14 @@ test( "range", function() { element.slider( "destroy" ); // Change range from true to min - element = $("<div></div>").slider({ + element = $( "<div></div>" ).slider({ range: true, min: 1, max: 10, step: 1 }).slider( "option", "range", "min" ); - equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from true to min, one handle"); + equal( element.find( ".ui-slider-handle" ).length, 1, "range switch from true to min, one handle" ); equal( element.find( ".ui-slider-range-max" ).length, 0, "range switch from true to min" ); equal( element.find( ".ui-slider-range-min" ).length, 1, "range switch from true to min" ); equal( element.slider( "option", "value" ), 1, "value" ); @@ -306,4 +302,4 @@ test( "range", function() { element.slider( "destroy" ); }); -})(jQuery); +})( jQuery ); |