diff options
author | Felix Nagel <info@felixnagel.com> | 2012-12-12 16:44:19 +0100 |
---|---|---|
committer | Felix Nagel <info@felixnagel.com> | 2012-12-12 16:44:19 +0100 |
commit | f6372bd7eac41ae2c022ef510ec414d016e820ed (patch) | |
tree | b764593154e334e03701dbc896dbac0154c5d136 /tests | |
parent | d1350f9f1113ef5590ec010f16da7068646aec01 (diff) | |
parent | 747d8534520fc3abad81b3c171fa931149398d99 (diff) | |
download | jquery-ui-f6372bd7eac41ae2c022ef510ec414d016e820ed.tar.gz jquery-ui-f6372bd7eac41ae2c022ef510ec414d016e820ed.zip |
Merge branch 'master' into selectmenu
Diffstat (limited to 'tests')
44 files changed, 1399 insertions, 909 deletions
diff --git a/tests/jquery.simulate.js b/tests/jquery.simulate.js index 08cbaafda..0ae88c20f 100644 --- a/tests/jquery.simulate.js +++ b/tests/jquery.simulate.js @@ -1,13 +1,15 @@ -/* - * jquery.simulate - simulate browser mouse and keyboard events - * http://jqueryui.com + /*! + * jQuery Simulate v0.0.1 - simulate browser mouse and keyboard events + * https://github.com/jquery/jquery-simulate * * Copyright 2012 jQuery Foundation and other contributors * Released under the MIT license. * http://jquery.org/license + * + * Date: Sun Dec 9 12:15:33 2012 -0500 */ -;(function( $ ) { +;(function( $, undefined ) { var rkeyEvent = /^key/, rmouseEvent = /^(?:mouse|contextmenu)|click/; @@ -31,7 +33,42 @@ $.simulate = function( elem, type, options ) { } }; +$.extend( $.simulate, { + + keyCode: { + BACKSPACE: 8, + COMMA: 188, + DELETE: 46, + DOWN: 40, + END: 35, + ENTER: 13, + ESCAPE: 27, + HOME: 36, + LEFT: 37, + NUMPAD_ADD: 107, + NUMPAD_DECIMAL: 110, + NUMPAD_DIVIDE: 111, + NUMPAD_ENTER: 108, + NUMPAD_MULTIPLY: 106, + NUMPAD_SUBTRACT: 109, + PAGE_DOWN: 34, + PAGE_UP: 33, + PERIOD: 190, + RIGHT: 39, + SPACE: 32, + TAB: 9, + UP: 38 + }, + + buttonCode: { + LEFT: 0, + MIDDLE: 1, + RIGHT: 2 + } +}); + $.extend( $.simulate.prototype, { + simulateEvent: function( elem, type, options ) { var event = this.createEvent( type, options ); this.dispatchEvent( elem, type, event, options ); @@ -56,7 +93,6 @@ $.extend( $.simulate.prototype, { detail: 0, screenX: 0, screenY: 0, - // TODO: default clientX/Y to a position within the target element clientX: 1, clientY: 1, ctrlKey: false, @@ -101,8 +137,14 @@ $.extend( $.simulate.prototype, { } else if ( document.createEventObject ) { event = document.createEventObject(); $.extend( event, options ); - // TODO: what is this mapping for? - event.button = { 0:1, 1:4, 2:2 }[ event.button ] || event.button; + // standards event.button uses constants defined here: http://msdn.microsoft.com/en-us/library/ie/ff974877(v=vs.85).aspx + // old IE event.button uses constants defined here: http://msdn.microsoft.com/en-us/library/ie/ms533544(v=vs.85).aspx + // so we actually need to map the standard back to oldIE + event.button = { + 0: 1, + 1: 4, + 2: 2 + }[ event.button ] || event.button; } return event; @@ -128,7 +170,10 @@ $.extend( $.simulate.prototype, { event.initKeyEvent( type, options.bubbles, options.cancelable, options.view, options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.keyCode, options.charCode ); - // TODO: what is this supporting? + // initKeyEvent throws an exception in WebKit + // see: http://stackoverflow.com/questions/6406784/initkeyevent-keypress-only-works-in-firefox-need-a-cross-browser-solution + // and also https://bugs.webkit.org/show_bug.cgi?id=13368 + // fall back to a generic event until we decide to implement initKeyboardEvent } catch( err ) { event = document.createEvent( "Events" ); event.initEvent( type, options.bubbles, options.cancelable ); @@ -147,9 +192,7 @@ $.extend( $.simulate.prototype, { $.extend( event, options ); } - // TODO: can we hook into core's logic? - if ( $.ui.ie || (({}).toString.call( window.opera ) === "[object Opera]") ) { - // TODO: is charCode ever <0 ? Can we just use charCode || keyCode? + if ( !!/msie [\w.]+/.exec( navigator.userAgent.toLowerCase() ) || (({}).toString.call( window.opera ) === "[object Opera]") ) { event.keyCode = (options.charCode > 0) ? options.charCode : options.keyCode; event.charCode = undefined; } @@ -157,7 +200,6 @@ $.extend( $.simulate.prototype, { return event; }, - // TODO: does this need type? Can't we just check event.type? dispatchEvent: function( elem, type, event ) { if ( elem.dispatchEvent ) { elem.dispatchEvent( event ); @@ -237,20 +279,31 @@ function findCenter( elem ) { $.extend( $.simulate.prototype, { simulateDrag: function() { - var target = this.target, + var i = 0, + target = this.target, options = this.options, center = findCenter( target ), x = Math.floor( center.x ), y = Math.floor( center.y ), dx = options.dx || 0, dy = options.dy || 0, + moves = options.moves || 3, coord = { clientX: x, clientY: y }; + this.simulateEvent( target, "mousedown", coord ); - coord = { clientX: x + 1, clientY: y + 1 }; - this.simulateEvent( document, "mousemove", coord ); - coord = { clientX: x + dx, clientY: y + dy }; - this.simulateEvent( document, "mousemove", coord ); - this.simulateEvent( document, "mousemove", coord ); + + for ( ; i < moves ; i++ ) { + x += dx / moves; + y += dy / moves; + + coord = { + clientX: Math.round( x ), + clientY: Math.round( y ) + }; + + this.simulateEvent( document, "mousemove", coord ); + } + this.simulateEvent( target, "mouseup", coord ); this.simulateEvent( target, "click", coord ); } diff --git a/tests/unit/autocomplete/autocomplete_options.js b/tests/unit/autocomplete/autocomplete_options.js index d3a25d2fc..913f5bc28 100644 --- a/tests/unit/autocomplete/autocomplete_options.js +++ b/tests/unit/autocomplete/autocomplete_options.js @@ -5,7 +5,7 @@ module( "autocomplete: options" ); var data = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl" ]; test( "appendTo", function() { - expect( 7 ); + expect( 8 ); var detached = $( "<div>" ), element = $( "#autocomplete" ).autocomplete(); equal( element.autocomplete( "widget" ).parent()[0], document.body, "defaults to body" ); @@ -39,6 +39,10 @@ test( "appendTo", function() { }); equal( element.autocomplete( "widget" ).parent()[0], detached[0], "detached DOM element" ); element.autocomplete( "destroy" ); + + element.autocomplete().autocomplete( "option", "appendTo", detached ); + equal( element.autocomplete( "widget" ).parent()[0], detached[0], "detached DOM element via option()" ); + element.autocomplete( "destroy" ); }); function autoFocusTest( afValue, focusedLength ) { diff --git a/tests/unit/button/button_core.js b/tests/unit/button/button_core.js index d53dedf90..6d0bbbe88 100644 --- a/tests/unit/button/button_core.js +++ b/tests/unit/button/button_core.js @@ -92,7 +92,7 @@ test("buttonset (rtl)", function() { // remove this when simulate properly simulates this // see http://yuilibrary.com/projects/yui2/ticket/2528826 fore more info if ( !$.ui.ie || ( document.documentMode && document.documentMode > 8 ) ) { - test( "ensure checked and aria after single click on checkbox label button, see #5518", function() { + asyncTest( "ensure checked and aria after single click on checkbox label button, see #5518", function() { expect( 3 ); $("#check2").button().change( function() { @@ -100,8 +100,76 @@ if ( !$.ui.ie || ( document.documentMode && document.documentMode > 8 ) ) { ok( this.checked, "checked ok" ); ok( lbl.attr("aria-pressed") === "true", "aria ok" ); ok( lbl.hasClass("ui-state-active"), "ui-state-active ok" ); - }).button("widget").simulate("mousedown").simulate("click").simulate("mouseup"); + }); + + // support: Opera + // Opera doesn't trigger a change event when this is done synchronously. + // This seems to be a side effect of another test, but until that can be + // tracked down, this delay will have to do. + setTimeout(function() { + $("#check2").button("widget").simulate("click"); + start(); + }, 1 ); }); } +test( "#7092 - button creation that requires a matching label does not find label in all cases", function() { + expect( 5 ); + var group = $( "<span><label for='t7092a'></label><input type='checkbox' id='t7092a'></span>" ); + group.find( "input[type=checkbox]" ).button(); + ok( group.find( "label" ).is( ".ui-button" ) ); + + group = $( "<input type='checkbox' id='t7092b'><label for='t7092b'></label>" ); + group.filter( "input[type=checkbox]" ).button(); + ok( group.filter( "label" ).is( ".ui-button" ) ); + + group = $( "<span><input type='checkbox' id='t7092c'></span><label for='t7092c'></label>" ); + group.find( "input[type=checkbox]" ).button(); + ok( group.filter( "label" ).is( ".ui-button" ) ); + + group = $( "<span><input type='checkbox' id='t7092d'></span><span><label for='t7092d'></label></span>" ); + group.find( "input[type=checkbox]" ).button(); + ok( group.find( "label" ).is( ".ui-button" ) ); + + group = $( "<input type='checkbox' id='t7092e'><span><label for='t7092e'></label></span>" ); + group.filter( "input[type=checkbox]" ).button(); + ok( group.find( "label" ).is( ".ui-button" ) ); +}); + +test( "#5946 - buttonset should ignore buttons that are not :visible", function() { + expect( 2 ); + $( "#radio01" ).next().andSelf().hide(); + var set = $( "#radio0" ).buttonset({ items: "input[type=radio]:visible" }); + ok( set.find( "label:eq(0)" ).is( ":not(.ui-button):not(.ui-corner-left)" ) ); + ok( set.find( "label:eq(1)" ).is( ".ui-button.ui-corner-left" ) ); +}); + +test( "#6262 - buttonset not applying ui-corner to invisible elements", function() { + expect( 3 ); + $( "#radio0" ).hide(); + var set = $( "#radio0" ).buttonset(); + ok( set.find( "label:eq(0)" ).is( ".ui-button.ui-corner-left" ) ); + ok( set.find( "label:eq(1)" ).is( ".ui-button" ) ); + ok( set.find( "label:eq(2)" ).is( ".ui-button.ui-corner-right" ) ); +}); + +asyncTest( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyboard Navigation", function() { + expect( 2 ); + var check = $( "#check" ).button(), + label = $( "label[for='check']" ); + ok( !label.is( ".ui-state-focus" ) ); + check.focus(); + setTimeout(function() { + ok( label.is( ".ui-state-focus" ) ); + start(); + }); +}); + +test( "#7534 - Button label selector works for ids with \":\"", function() { + expect( 1 ); + var group = $( "<span><input type='checkbox' id='check:7534'><label for='check:7534'>Label</label></span>" ); + group.find( "input" ).button(); + ok( group.find( "label" ).is( ".ui-button" ), "Found an id with a :" ); +}); + })(jQuery); diff --git a/tests/unit/button/button_events.js b/tests/unit/button/button_events.js index 7b79c41ea..2fd038325 100644 --- a/tests/unit/button/button_events.js +++ b/tests/unit/button/button_events.js @@ -13,14 +13,24 @@ test("buttonset works with single-quote named elements (#7505)", function() { }).click(); }); -test( "when button loses focus, ensure active state is removed (#8559)", function() { +asyncTest( "when button loses focus, ensure active state is removed (#8559)", function() { expect( 1 ); - $("#button").button().keypress( function() { - $("#button").one( "blur", function() { - ok( !$("#button").is(".ui-state-active"), "button loses active state appropriately" ); + var element = $( "#button" ).button(); + + element.one( "keypress", function() { + element.one( "blur", function() { + ok( !element.is(".ui-state-active"), "button loses active state appropriately" ); + start(); }).blur(); - }).focus().simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ).simulate( "keypress", { keyCode: $.ui.keyCode.ENTER } ); + }); + + element.focus(); + setTimeout(function() { + element + .simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ) + .simulate( "keypress", { keyCode: $.ui.keyCode.ENTER } ); + }); }); })(jQuery); diff --git a/tests/unit/button/button_options.js b/tests/unit/button/button_options.js index eeb6e5527..e1931a54e 100644 --- a/tests/unit/button/button_options.js +++ b/tests/unit/button/button_options.js @@ -103,4 +103,15 @@ test("icons", function() { $("#button").button("destroy"); }); +test( "#5295 - button does not remove hoverstate if disabled" , function() { + expect( 1 ); + var btn = $("#button").button(); + btn.hover( function() { + btn.button( "disable" ); + }); + btn.trigger( "mouseenter" ); + btn.trigger( "mouseleave" ); + ok( !btn.is( ".ui-state-hover") ); +}); + })(jQuery); diff --git a/tests/unit/button/button_tickets.js b/tests/unit/button/button_tickets.js deleted file mode 100644 index 1272d368f..000000000 --- a/tests/unit/button/button_tickets.js +++ /dev/null @@ -1,75 +0,0 @@ -/* - * button_tickets.js - */ -(function( $ ) { - -module( "button: tickets" ); - -test( "#5295 - button does not remove hoverstate if disabled" , function() { - expect( 1 ); - var btn = $("#button").button(); - btn.hover( function() { - btn.button( "disable" ); - }); - btn.trigger( "mouseenter" ); - btn.trigger( "mouseleave" ); - ok( !btn.is( ".ui-state-hover") ); -}); - -test( "#5946 - buttonset should ignore buttons that are not :visible", function() { - expect( 2 ); - $( "#radio01" ).next().andSelf().hide(); - var set = $( "#radio0" ).buttonset({ items: "input[type=radio]:visible" }); - ok( set.find( "label:eq(0)" ).is( ":not(.ui-button):not(.ui-corner-left)" ) ); - ok( set.find( "label:eq(1)" ).is( ".ui-button.ui-corner-left" ) ); -}); - -test( "#6262 - buttonset not applying ui-corner to invisible elements", function() { - expect( 3 ); - $( "#radio0" ).hide(); - var set = $( "#radio0" ).buttonset(); - ok( set.find( "label:eq(0)" ).is( ".ui-button.ui-corner-left" ) ); - ok( set.find( "label:eq(1)" ).is( ".ui-button" ) ); - ok( set.find( "label:eq(2)" ).is( ".ui-button.ui-corner-right" ) ); -}); - -test( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyboard Navigation", function() { - expect( 2 ); - var check = $( "#check" ).button(), - label = $( "label[for='check']" ); - ok( !label.is( ".ui-state-focus" ) ); - check.focus(); - ok( label.is( ".ui-state-focus" ) ); -}); - -test( "#7092 - button creation that requires a matching label does not find label in all cases", function() { - expect( 5 ); - var group = $( "<span><label for='t7092a'></label><input type='checkbox' id='t7092a'></span>" ); - group.find( "input[type=checkbox]" ).button(); - ok( group.find( "label" ).is( ".ui-button" ) ); - - group = $( "<input type='checkbox' id='t7092b'><label for='t7092b'></label>" ); - group.filter( "input[type=checkbox]" ).button(); - ok( group.filter( "label" ).is( ".ui-button" ) ); - - group = $( "<span><input type='checkbox' id='t7092c'></span><label for='t7092c'></label>" ); - group.find( "input[type=checkbox]" ).button(); - ok( group.filter( "label" ).is( ".ui-button" ) ); - - group = $( "<span><input type='checkbox' id='t7092d'></span><span><label for='t7092d'></label></span>" ); - group.find( "input[type=checkbox]" ).button(); - ok( group.find( "label" ).is( ".ui-button" ) ); - - group = $( "<input type='checkbox' id='t7092e'><span><label for='t7092e'></label></span>" ); - group.filter( "input[type=checkbox]" ).button(); - ok( group.find( "label" ).is( ".ui-button" ) ); -}); - -test( "#7534 - Button label selector works for ids with \":\"", function() { - expect( 1 ); - var group = $( "<span><input type='checkbox' id='check:7534'><label for='check:7534'>Label</label></span>" ); - group.find( "input" ).button(); - ok( group.find( "label" ).is( ".ui-button" ), "Found an id with a :" ); -}); - -})( jQuery ); diff --git a/tests/unit/core/core.js b/tests/unit/core/core.js index 5ebb9e9f4..86b95e157 100644 --- a/tests/unit/core/core.js +++ b/tests/unit/core/core.js @@ -4,11 +4,12 @@ module( "core - jQuery extensions" ); TestHelpers.testJshint( "core" ); -test( "focus - original functionality", function() { +asyncTest( "focus - original functionality", function() { expect( 1 ); $( "#inputTabindex0" ) - .focus(function() { + .one( "focus", function() { ok( true, "event triggered" ); + start(); }) .focus(); }); @@ -16,12 +17,10 @@ test( "focus - original functionality", function() { asyncTest( "focus", function() { expect( 2 ); $( "#inputTabindex0" ) - .focus(function() { + .one( "focus", function() { ok( true, "event triggered" ); }) .focus( 500, function() { - // prevent double focus event in IE - $( this ).unbind( "focus" ); ok( true, "callback triggered" ); start(); }); diff --git a/tests/unit/datepicker/datepicker_core.js b/tests/unit/datepicker/datepicker_core.js index 3c88059d1..1388f9222 100644 --- a/tests/unit/datepicker/datepicker_core.js +++ b/tests/unit/datepicker/datepicker_core.js @@ -6,6 +6,8 @@ module("datepicker: core"); +TestHelpers.testJshint( "datepicker" ); + test("initialization - Reinitialization after body had been emptied.", function() { expect( 1 ); var bodyContent = $('body').children(), inp = $("#inp"); @@ -28,126 +30,159 @@ test("widget method", function() { deepEqual($("body > #ui-datepicker-div:last-child")[0], actual); }); -test('baseStructure', function() { +asyncTest('baseStructure', function() { expect( 58 ); var header, title, table, thead, week, panel, inl, child, - inp = TestHelpers.datepicker.init('#inp').focus(), + inp = TestHelpers.datepicker.init('#inp'), dp = $('#ui-datepicker-div'); - ok(dp.is(':visible'), 'Structure - datepicker visible'); - ok(!dp.is('.ui-datepicker-rtl'), 'Structure - not right-to-left'); - ok(!dp.is('.ui-datepicker-multi'), 'Structure - not multi-month'); - equal(dp.children().length, 2, 'Structure - child count'); - header = dp.children(':first'); - ok(header.is('div.ui-datepicker-header'), 'Structure - header division'); - equal(header.children().length, 3, 'Structure - header child count'); - ok(header.children(':first').is('a.ui-datepicker-prev') && header.children(':first').html() !== '', 'Structure - prev link'); - ok(header.children(':eq(1)').is('a.ui-datepicker-next') && header.children(':eq(1)').html() !== '', 'Structure - next link'); - - title = header.children(':last'); - ok(title.is('div.ui-datepicker-title') && title.html() !== '','Structure - title division'); - equal(title.children().length, 2, 'Structure - title child count'); - ok(title.children(':first').is('span.ui-datepicker-month') && title.children(':first').text() !== '', 'Structure - month text'); - ok(title.children(':last').is('span.ui-datepicker-year') && title.children(':last').text() !== '', 'Structure - year text'); - - table = dp.children(':eq(1)'); - ok(table.is('table.ui-datepicker-calendar'), 'Structure - month table'); - ok(table.children(':first').is('thead'), 'Structure - month table thead'); - thead = table.children(':first').children(':first'); - ok(thead.is('tr'), 'Structure - month table title row'); - equal(thead.find('th').length, 7, 'Structure - month table title cells'); - ok(table.children(':eq(1)').is('tbody'), 'Structure - month table body'); - ok(table.children(':eq(1)').children('tr').length >= 4, 'Structure - month table week count'); - week = table.children(':eq(1)').children(':first'); - ok(week.is('tr'), 'Structure - month table week row'); - equal(week.children().length, 7, 'Structure - week child count'); - ok(week.children(':first').is('td.ui-datepicker-week-end'), 'Structure - month table first day cell'); - ok(week.children(':last').is('td.ui-datepicker-week-end'), 'Structure - month table second day cell'); - inp.datepicker('hide').datepicker('destroy'); + function step1() { + inp[0].focus(); + setTimeout(function() { + ok(dp.is(':visible'), 'Structure - datepicker visible'); + ok(!dp.is('.ui-datepicker-rtl'), 'Structure - not right-to-left'); + ok(!dp.is('.ui-datepicker-multi'), 'Structure - not multi-month'); + equal(dp.children().length, 2, 'Structure - child count'); - // Editable month/year and button panel - inp = TestHelpers.datepicker.init('#inp', {changeMonth: true, changeYear: true, showButtonPanel: true}); - inp.focus(); + header = dp.children(':first'); + ok(header.is('div.ui-datepicker-header'), 'Structure - header division'); + equal(header.children().length, 3, 'Structure - header child count'); + ok(header.children(':first').is('a.ui-datepicker-prev') && header.children(':first').html() !== '', 'Structure - prev link'); + ok(header.children(':eq(1)').is('a.ui-datepicker-next') && header.children(':eq(1)').html() !== '', 'Structure - next link'); - title = dp.find('div.ui-datepicker-title'); - ok(title.children(':first').is('select.ui-datepicker-month'), 'Structure - month selector'); - ok(title.children(':last').is('select.ui-datepicker-year'), 'Structure - year selector'); + title = header.children(':last'); + ok(title.is('div.ui-datepicker-title') && title.html() !== '','Structure - title division'); + equal(title.children().length, 2, 'Structure - title child count'); + ok(title.children(':first').is('span.ui-datepicker-month') && title.children(':first').text() !== '', 'Structure - month text'); + ok(title.children(':last').is('span.ui-datepicker-year') && title.children(':last').text() !== '', 'Structure - year text'); - panel = dp.children(':last'); - ok(panel.is('div.ui-datepicker-buttonpane'), 'Structure - button panel division'); - equal(panel.children().length, 2, 'Structure - button panel child count'); - ok(panel.children(':first').is('button.ui-datepicker-current'), 'Structure - today button'); - ok(panel.children(':last').is('button.ui-datepicker-close'), 'Structure - close button'); - inp.datepicker('hide').datepicker('destroy'); + table = dp.children(':eq(1)'); + ok(table.is('table.ui-datepicker-calendar'), 'Structure - month table'); + ok(table.children(':first').is('thead'), 'Structure - month table thead'); + thead = table.children(':first').children(':first'); + ok(thead.is('tr'), 'Structure - month table title row'); + equal(thead.find('th').length, 7, 'Structure - month table title cells'); + ok(table.children(':eq(1)').is('tbody'), 'Structure - month table body'); + ok(table.children(':eq(1)').children('tr').length >= 4, 'Structure - month table week count'); + week = table.children(':eq(1)').children(':first'); + ok(week.is('tr'), 'Structure - month table week row'); + equal(week.children().length, 7, 'Structure - week child count'); + ok(week.children(':first').is('td.ui-datepicker-week-end'), 'Structure - month table first day cell'); + ok(week.children(':last').is('td.ui-datepicker-week-end'), 'Structure - month table second day cell'); + inp.datepicker('hide').datepicker('destroy'); - // Multi-month 2 - inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: 2}); - inp.focus(); - ok(dp.is('.ui-datepicker-multi'), 'Structure multi [2] - multi-month'); - equal(dp.children().length, 3, 'Structure multi [2] - child count'); - child = dp.children(':first'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2] - first month division'); - child = dp.children(':eq(1)'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2] - second month division'); - child = dp.children(':eq(2)'); - ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2] - row break'); - ok(dp.is('.ui-datepicker-multi-2'), 'Structure multi [2] - multi-2'); - inp.datepicker('hide').datepicker('destroy'); + step2(); + }); + } - // Multi-month 3 - inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: 3}); - inp.focus(); - ok(dp.is('.ui-datepicker-multi-3'), 'Structure multi [3] - multi-3'); - ok(! dp.is('.ui-datepicker-multi-2'), 'Structure multi [3] - Trac #6704'); - inp.datepicker('hide').datepicker('destroy'); + function step2() { + // Editable month/year and button panel + inp = TestHelpers.datepicker.init('#inp', {changeMonth: true, changeYear: true, showButtonPanel: true}); + inp.focus(); + setTimeout(function() { + title = dp.find('div.ui-datepicker-title'); + ok(title.children(':first').is('select.ui-datepicker-month'), 'Structure - month selector'); + ok(title.children(':last').is('select.ui-datepicker-year'), 'Structure - year selector'); - // Multi-month [2, 2] - inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: [2, 2]}); - inp.focus(); - ok(dp.is('.ui-datepicker-multi'), 'Structure multi - multi-month'); - equal(dp.children().length, 6, 'Structure multi [2,2] - child count'); - child = dp.children(':first'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2,2] - first month division'); - child = dp.children(':eq(1)'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2,2] - second month division'); - child = dp.children(':eq(2)'); - ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2,2] - row break'); - child = dp.children(':eq(3)'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2,2] - third month division'); - child = dp.children(':eq(4)'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2,2] - fourth month division'); - child = dp.children(':eq(5)'); - ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2,2] - row break'); - inp.datepicker('hide').datepicker('destroy'); + panel = dp.children(':last'); + ok(panel.is('div.ui-datepicker-buttonpane'), 'Structure - button panel division'); + equal(panel.children().length, 2, 'Structure - button panel child count'); + ok(panel.children(':first').is('button.ui-datepicker-current'), 'Structure - today button'); + ok(panel.children(':last').is('button.ui-datepicker-close'), 'Structure - close button'); + inp.datepicker('hide').datepicker('destroy'); - // Inline - inl = TestHelpers.datepicker.init('#inl'); - dp = inl.children(); - ok(dp.is('.ui-datepicker-inline'), 'Structure inline - main div'); - ok(!dp.is('.ui-datepicker-rtl'), 'Structure inline - not right-to-left'); - ok(!dp.is('.ui-datepicker-multi'), 'Structure inline - not multi-month'); - equal(dp.children().length, 2, 'Structure inline - child count'); - header = dp.children(':first'); - ok(header.is('div.ui-datepicker-header'), 'Structure inline - header division'); - equal(header.children().length, 3, 'Structure inline - header child count'); - table = dp.children(':eq(1)'); - ok(table.is('table.ui-datepicker-calendar'), 'Structure inline - month table'); - ok(table.children(':first').is('thead'), 'Structure inline - month table thead'); - ok(table.children(':eq(1)').is('tbody'), 'Structure inline - month table body'); - inl.datepicker('destroy'); - - // Inline multi-month - inl = TestHelpers.datepicker.init('#inl', {numberOfMonths: 2}); - dp = inl.children(); - ok(dp.is('.ui-datepicker-inline') && dp.is('.ui-datepicker-multi'), 'Structure inline multi - main div'); - equal(dp.children().length, 3, 'Structure inline multi - child count'); - child = dp.children(':first'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure inline multi - first month division'); - child = dp.children(':eq(1)'); - ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure inline multi - second month division'); - child = dp.children(':eq(2)'); - ok(child.is('div.ui-datepicker-row-break'), 'Structure inline multi - row break'); - inl.datepicker('destroy'); + step3(); + }); + } + + function step3() { + // Multi-month 2 + inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: 2}); + inp.focus(); + setTimeout(function() { + ok(dp.is('.ui-datepicker-multi'), 'Structure multi [2] - multi-month'); + equal(dp.children().length, 3, 'Structure multi [2] - child count'); + child = dp.children(':first'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2] - first month division'); + child = dp.children(':eq(1)'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2] - second month division'); + child = dp.children(':eq(2)'); + ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2] - row break'); + ok(dp.is('.ui-datepicker-multi-2'), 'Structure multi [2] - multi-2'); + inp.datepicker('hide').datepicker('destroy'); + + step4(); + }); + } + + function step4() { + // Multi-month 3 + inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: 3}); + inp.focus(); + setTimeout(function() { + ok(dp.is('.ui-datepicker-multi-3'), 'Structure multi [3] - multi-3'); + ok(! dp.is('.ui-datepicker-multi-2'), 'Structure multi [3] - Trac #6704'); + inp.datepicker('hide').datepicker('destroy'); + + step5(); + }); + } + + function step5() { + // Multi-month [2, 2] + inp = TestHelpers.datepicker.init('#inp', {numberOfMonths: [2, 2]}); + inp.focus(); + setTimeout(function() { + ok(dp.is('.ui-datepicker-multi'), 'Structure multi - multi-month'); + equal(dp.children().length, 6, 'Structure multi [2,2] - child count'); + child = dp.children(':first'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2,2] - first month division'); + child = dp.children(':eq(1)'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2,2] - second month division'); + child = dp.children(':eq(2)'); + ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2,2] - row break'); + child = dp.children(':eq(3)'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure multi [2,2] - third month division'); + child = dp.children(':eq(4)'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure multi [2,2] - fourth month division'); + child = dp.children(':eq(5)'); + ok(child.is('div.ui-datepicker-row-break'), 'Structure multi [2,2] - row break'); + inp.datepicker('hide').datepicker('destroy'); + + // Inline + inl = TestHelpers.datepicker.init('#inl'); + dp = inl.children(); + ok(dp.is('.ui-datepicker-inline'), 'Structure inline - main div'); + ok(!dp.is('.ui-datepicker-rtl'), 'Structure inline - not right-to-left'); + ok(!dp.is('.ui-datepicker-multi'), 'Structure inline - not multi-month'); + equal(dp.children().length, 2, 'Structure inline - child count'); + header = dp.children(':first'); + ok(header.is('div.ui-datepicker-header'), 'Structure inline - header division'); + equal(header.children().length, 3, 'Structure inline - header child count'); + table = dp.children(':eq(1)'); + ok(table.is('table.ui-datepicker-calendar'), 'Structure inline - month table'); + ok(table.children(':first').is('thead'), 'Structure inline - month table thead'); + ok(table.children(':eq(1)').is('tbody'), 'Structure inline - month table body'); + inl.datepicker('destroy'); + + // Inline multi-month + inl = TestHelpers.datepicker.init('#inl', {numberOfMonths: 2}); + dp = inl.children(); + ok(dp.is('.ui-datepicker-inline') && dp.is('.ui-datepicker-multi'), 'Structure inline multi - main div'); + equal(dp.children().length, 3, 'Structure inline multi - child count'); + child = dp.children(':first'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-first'), 'Structure inline multi - first month division'); + child = dp.children(':eq(1)'); + ok(child.is('div.ui-datepicker-group') && child.is('div.ui-datepicker-group-last'), 'Structure inline multi - second month division'); + child = dp.children(':eq(2)'); + ok(child.is('div.ui-datepicker-row-break'), 'Structure inline multi - row break'); + inl.datepicker('destroy'); + + start(); + }); + } + + step1(); }); test('customStructure', function() { diff --git a/tests/unit/datepicker/datepicker_options.js b/tests/unit/datepicker/datepicker_options.js index 8b8888780..c5e53b85e 100644 --- a/tests/unit/datepicker/datepicker_options.js +++ b/tests/unit/datepicker/datepicker_options.js @@ -48,6 +48,24 @@ test('option', function() { 'Get default settings'); }); +test( "disabled", function() { + expect(8); + var inp = TestHelpers.datepicker.init('#inp'); + ok(!inp.datepicker('isDisabled'), 'Initially marked as enabled'); + ok(!inp[0].disabled, 'Field initially enabled'); + inp.datepicker('option', 'disabled', true); + ok(inp.datepicker('isDisabled'), 'Marked as disabled'); + ok(inp[0].disabled, 'Field now disabled'); + inp.datepicker('option', 'disabled', false); + ok(!inp.datepicker('isDisabled'), 'Marked as enabled'); + ok(!inp[0].disabled, 'Field now enabled'); + inp.datepicker('destroy'); + + inp = TestHelpers.datepicker.init('#inp', { disabled: true }); + ok(inp.datepicker('isDisabled'), 'Initially marked as disabled'); + ok(inp[0].disabled, 'Field initially disabled'); +}); + test('change', function() { expect( 12 ); var inp = TestHelpers.datepicker.init('#inp'), @@ -69,76 +87,114 @@ test('change', function() { equal($.datepicker._defaults.showOn, 'focus', 'Retain default showOn'); }); -test('invocation', function() { +asyncTest('invocation', function() { expect( 29 ); var button, image, inp = TestHelpers.datepicker.init('#inp'), dp = $('#ui-datepicker-div'), body = $('body'); - // On focus - button = inp.siblings('button'); - ok(button.length === 0, 'Focus - button absent'); - image = inp.siblings('img'); - ok(image.length === 0, 'Focus - image absent'); - inp.focus(); - ok(dp.is(':visible'), 'Focus - rendered on focus'); - inp.simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE}); - ok(!dp.is(':visible'), 'Focus - hidden on exit'); - inp.focus(); - ok(dp.is(':visible'), 'Focus - rendered on focus'); - body.simulate('mousedown', {}); - ok(!dp.is(':visible'), 'Focus - hidden on external click'); - inp.datepicker('hide').datepicker('destroy'); - // On button - inp = TestHelpers.datepicker.init('#inp', {showOn: 'button', buttonText: 'Popup'}); - ok(!dp.is(':visible'), 'Button - initially hidden'); - button = inp.siblings('button'); - image = inp.siblings('img'); - ok(button.length === 1, 'Button - button present'); - ok(image.length === 0, 'Button - image absent'); - equal(button.text(), 'Popup', 'Button - button text'); - inp.focus(); - ok(!dp.is(':visible'), 'Button - not rendered on focus'); - button.click(); - ok(dp.is(':visible'), 'Button - rendered on button click'); - button.click(); - ok(!dp.is(':visible'), 'Button - hidden on second button click'); - inp.datepicker('hide').datepicker('destroy'); - // On image button - inp = TestHelpers.datepicker.init('#inp', {showOn: 'button', buttonImageOnly: true, - buttonImage: 'img/calendar.gif', buttonText: 'Cal'}); - ok(!dp.is(':visible'), 'Image button - initially hidden'); - button = inp.siblings('button'); - ok(button.length === 0, 'Image button - button absent'); - image = inp.siblings('img'); - ok(image.length === 1, 'Image button - image present'); - equal(image.attr('src'), 'img/calendar.gif', 'Image button - image source'); - equal(image.attr('title'), 'Cal', 'Image button - image text'); - inp.focus(); - ok(!dp.is(':visible'), 'Image button - not rendered on focus'); - image.click(); - ok(dp.is(':visible'), 'Image button - rendered on image click'); - image.click(); - ok(!dp.is(':visible'), 'Image button - hidden on second image click'); - inp.datepicker('hide').datepicker('destroy'); - // On both - inp = TestHelpers.datepicker.init('#inp', {showOn: 'both', buttonImage: 'img/calendar.gif'}); - ok(!dp.is(':visible'), 'Both - initially hidden'); - button = inp.siblings('button'); - ok(button.length === 1, 'Both - button present'); - image = inp.siblings('img'); - ok(image.length === 0, 'Both - image absent'); - image = button.children('img'); - ok(image.length === 1, 'Both - button image present'); - inp.focus(); - ok(dp.is(':visible'), 'Both - rendered on focus'); - body.simulate('mousedown', {}); - ok(!dp.is(':visible'), 'Both - hidden on external click'); - button.click(); - ok(dp.is(':visible'), 'Both - rendered on button click'); - button.click(); - ok(!dp.is(':visible'), 'Both - hidden on second button click'); - inp.datepicker('hide').datepicker('destroy'); + + function step1() { + // On focus + button = inp.siblings('button'); + ok(button.length === 0, 'Focus - button absent'); + image = inp.siblings('img'); + ok(image.length === 0, 'Focus - image absent'); + inp[0].focus(); + setTimeout(function() { + ok(dp.is(':visible'), 'Focus - rendered on focus'); + inp.simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE}); + ok(!dp.is(':visible'), 'Focus - hidden on exit'); + inp[0].blur(); + setTimeout(function() { + inp[0].focus(); + setTimeout(function() { + ok(dp.is(':visible'), 'Focus - rendered on focus'); + body.simulate('mousedown', {}); + ok(!dp.is(':visible'), 'Focus - hidden on external click'); + inp.datepicker('hide').datepicker('destroy'); + + step2(); + }); + }); + }); + } + + function step2() { + // On button + inp = TestHelpers.datepicker.init('#inp', {showOn: 'button', buttonText: 'Popup'}); + ok(!dp.is(':visible'), 'Button - initially hidden'); + button = inp.siblings('button'); + image = inp.siblings('img'); + ok(button.length === 1, 'Button - button present'); + ok(image.length === 0, 'Button - image absent'); + equal(button.text(), 'Popup', 'Button - button text'); + inp[0].focus(); + setTimeout(function() { + ok(!dp.is(':visible'), 'Button - not rendered on focus'); + button.click(); + ok(dp.is(':visible'), 'Button - rendered on button click'); + button.click(); + ok(!dp.is(':visible'), 'Button - hidden on second button click'); + inp.datepicker('hide').datepicker('destroy'); + + step3(); + }); + } + + function step3() { + // On image button + inp = TestHelpers.datepicker.init('#inp', {showOn: 'button', buttonImageOnly: true, + buttonImage: 'img/calendar.gif', buttonText: 'Cal'}); + ok(!dp.is(':visible'), 'Image button - initially hidden'); + button = inp.siblings('button'); + ok(button.length === 0, 'Image button - button absent'); + image = inp.siblings('img'); + ok(image.length === 1, 'Image button - image present'); + equal(image.attr('src'), 'img/calendar.gif', 'Image button - image source'); + equal(image.attr('title'), 'Cal', 'Image button - image text'); + inp[0].focus(); + setTimeout(function() { + ok(!dp.is(':visible'), 'Image button - not rendered on focus'); + image.click(); + ok(dp.is(':visible'), 'Image button - rendered on image click'); + image.click(); + ok(!dp.is(':visible'), 'Image button - hidden on second image click'); + inp.datepicker('hide').datepicker('destroy'); + + step4(); + }); + } + + function step4() { + // On both + inp = TestHelpers.datepicker.init('#inp', {showOn: 'both', buttonImage: 'img/calendar.gif'}); + ok(!dp.is(':visible'), 'Both - initially hidden'); + button = inp.siblings('button'); + ok(button.length === 1, 'Both - button present'); + image = inp.siblings('img'); + ok(image.length === 0, 'Both - image absent'); + image = button.children('img'); + ok(image.length === 1, 'Both - button image present'); + inp[0].blur(); + setTimeout(function() { + inp[0].focus(); + setTimeout(function() { + ok(dp.is(':visible'), 'Both - rendered on focus'); + body.simulate('mousedown', {}); + ok(!dp.is(':visible'), 'Both - hidden on external click'); + button.click(); + ok(dp.is(':visible'), 'Both - rendered on button click'); + button.click(); + ok(!dp.is(':visible'), 'Both - hidden on second button click'); + inp.datepicker('hide').datepicker('destroy'); + + start(); + }); + }); + } + + step1(); }); test('otherMonths', function() { @@ -538,10 +594,9 @@ test('altField', function() { }); test('autoSize', function() { - expect( 14 ); + expect( 15 ); var inp = TestHelpers.datepicker.init('#inp'); - // todo: figure out why this test fails in Opera 11.6 - //equal(inp.prop('size'), 20, 'Auto size - default'); + equal(inp.prop('size'), 20, 'Auto size - default'); inp.datepicker('option', 'autoSize', true); equal(inp.prop('size'), 10, 'Auto size - mm/dd/yy'); inp.datepicker('option', 'dateFormat', 'm/d/yy'); diff --git a/tests/unit/dialog/dialog.html b/tests/unit/dialog/dialog.html index 5413e7cc1..8f2583ce1 100644 --- a/tests/unit/dialog/dialog.html +++ b/tests/unit/dialog/dialog.html @@ -23,6 +23,8 @@ "ui/jquery.ui.draggable.js", "ui/jquery.ui.resizable.js", "ui/jquery.ui.button.js", + "ui/jquery.ui.effect.js", + "ui/jquery.ui.effect-clip.js", "ui/jquery.ui.dialog.js" ] }); @@ -59,6 +61,8 @@ <label for="favorite-food">Favorite food</label><input id="favorite-food"> </div> </div> + <div class="wrap" id="wrap1"></div> + <div class="wrap" id="wrap2"></div> </div> </body> </html> diff --git a/tests/unit/dialog/dialog_common.js b/tests/unit/dialog/dialog_common.js index 47fff1013..57d7aa0aa 100644 --- a/tests/unit/dialog/dialog_common.js +++ b/tests/unit/dialog/dialog_common.js @@ -1,7 +1,8 @@ TestHelpers.commonWidgetTests( "dialog", { defaults: { + appendTo: "body", autoOpen: true, - buttons: {}, + buttons: [], closeOnEscape: true, closeText: 'close', disabled: false, @@ -9,8 +10,8 @@ TestHelpers.commonWidgetTests( "dialog", { draggable: true, height: 'auto', hide: null, - maxHeight: false, - maxWidth: false, + maxHeight: null, + maxWidth: null, minHeight: 150, minWidth: 150, modal: false, diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js index 9c0e80825..817f76ea9 100644 --- a/tests/unit/dialog/dialog_core.js +++ b/tests/unit/dialog/dialog_core.js @@ -34,11 +34,12 @@ test( "ARIA", function() { test("widget method", function() { expect( 1 ); - var dialog = $("<div>").appendTo("#main").dialog(); + var dialog = $("<div>").appendTo("#qunit-fixture").dialog(); deepEqual(dialog.parent()[0], dialog.dialog("widget")[0]); + dialog.remove(); }); -test( "focus tabbable", function() { +asyncTest( "focus tabbable", function() { expect( 5 ); var el, options = { @@ -48,40 +49,62 @@ test( "focus tabbable", function() { }] }; - el = $( "<div><input><input autofocus></div>" ).dialog( options ); - equal( document.activeElement, el.find( "input" )[ 1 ], "1. first element inside the dialog matching [autofocus]" ); - el.remove(); - - // IE8 fails to focus the input, <body> ends up being the activeElement - // so wait for that stupid browser - stop(); - setTimeout(function() { - el = $( "<div><input><input></div>" ).dialog( options ); - equal( document.activeElement, el.find( "input" )[ 0 ], "2. tabbable element inside the content element" ); - el.remove(); - - el = $( "<div>text</div>" ).dialog( options ); - equal( document.activeElement, el.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], "3. tabbable element inside the buttonpane" ); - el.remove(); - - el = $( "<div>text</div>" ).dialog(); - equal( document.activeElement, el.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], "4. the close button" ); - el.remove(); - + function checkFocus( markup, options, testFn, next ) { + el = $( markup ).dialog( options ); + setTimeout(function() { + testFn(); + el.remove(); + setTimeout( next ); + }); + } + + function step1() { + checkFocus( "<div><input><input autofocus></div>", options, function() { + equal( document.activeElement, el.find( "input" )[ 1 ], + "1. first element inside the dialog matching [autofocus]" ); + }, step2 ); + } + + function step2() { + checkFocus( "<div><input><input></div>", options, function() { + equal( document.activeElement, el.find( "input" )[ 0 ], + "2. tabbable element inside the content element" ); + }, step3 ); + } + + function step3() { + checkFocus( "<div>text</div>", options, function() { + equal( document.activeElement, + el.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], + "3. tabbable element inside the buttonpane" ); + }, step4 ); + } + + function step4() { + checkFocus( "<div>text</div>", {}, function() { + equal( document.activeElement, + el.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], + "4. the close button" ); + }, step5 ); + } + + function step5() { el = $( "<div>text</div>" ).dialog({ autoOpen: false }); el.dialog( "widget" ).find( ".ui-dialog-titlebar-close" ).hide(); el.dialog( "open" ); - equal( document.activeElement, el.parent()[ 0 ], "5. the dialog itself" ); - el.remove(); + setTimeout(function() { + equal( document.activeElement, el.parent()[ 0 ], "5. the dialog itself" ); + el.remove(); + start(); + }); + } - start(); - }, 13); + step1(); }); -// #7960 -test( "resizable handles below modal overlays", function() { +test( "#7960: resizable handles below modal overlays", function() { expect( 1 ); var resizable = $( "<div>" ).resizable(), @@ -93,4 +116,35 @@ test( "resizable handles below modal overlays", function() { dialog.dialog( "destroy" ); }); +asyncTest( "Prevent tabbing out of dialogs", function() { + expect( 3 ); + + var el = $( "<div><input><input></div>" ).dialog(), + inputs = el.find( "input" ), + widget = el.dialog( "widget" )[ 0 ]; + + function checkTab() { + ok( $.contains( widget, document.activeElement ), "Tab key event moved focus within the modal" ); + + // check shift tab + $( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB, shiftKey: true }); + setTimeout( checkShiftTab ); + } + + function checkShiftTab() { + ok( $.contains( widget, document.activeElement ), "Shift-Tab key event moved focus within the modal" ); + + el.remove(); + setTimeout( start ); + } + + inputs[1].focus(); + setTimeout(function() { + equal( document.activeElement, inputs[1], "Focus set on second input" ); + inputs.eq( 1 ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB }); + + setTimeout( checkTab ); + }); +}); + })(jQuery); diff --git a/tests/unit/dialog/dialog_deprecated.html b/tests/unit/dialog/dialog_deprecated.html index 2a876ac73..3360e6ef7 100644 --- a/tests/unit/dialog/dialog_deprecated.html +++ b/tests/unit/dialog/dialog_deprecated.html @@ -57,6 +57,8 @@ <label for="favorite-food">Favorite food</label><input id="favorite-food"> </div> </div> + <div class="wrap" id="wrap1"></div> + <div class="wrap" id="wrap2"></div> </div> </body> </html> diff --git a/tests/unit/dialog/dialog_events.js b/tests/unit/dialog/dialog_events.js index cbeced0f8..19337ad5d 100644 --- a/tests/unit/dialog/dialog_events.js +++ b/tests/unit/dialog/dialog_events.js @@ -341,4 +341,18 @@ asyncTest("ensure dialog's container doesn't scroll on resize and focus", functi }, 500); }); +test("#5184: isOpen in dialogclose event is true", function() { + expect( 3 ); + + var el = $( "<div></div>" ).dialog({ + close: function() { + ok( !el.dialog("isOpen"), "dialog is not open during close" ); + } + }); + ok( el.dialog("isOpen"), "dialog is open after init" ); + el.dialog( "close" ); + ok( !el.dialog("isOpen"), "dialog is not open after close" ); + el.remove(); +}); + })(jQuery); diff --git a/tests/unit/dialog/dialog_methods.js b/tests/unit/dialog/dialog_methods.js index e5275c7a4..85d13d157 100644 --- a/tests/unit/dialog/dialog_methods.js +++ b/tests/unit/dialog/dialog_methods.js @@ -34,7 +34,9 @@ test("init", function() { }); test("destroy", function() { - expect( 6 ); + expect( 7 ); + + $( "#dialog1, #form-dialog" ).hide(); domEqual( "#dialog1", function() { var dialog = $( "#dialog1" ).dialog().dialog( "destroy" ); equal( dialog.parent()[ 0 ], $( "#qunit-fixture" )[ 0 ] ); @@ -45,6 +47,26 @@ test("destroy", function() { equal( dialog.parent()[ 0 ], $( "#qunit-fixture" )[ 0 ] ); equal( dialog.index(), 2 ); }); + + // Ensure dimensions are restored (#8119) + $( "#dialog1" ).show().css({ + width: "400px", + minHeight: "100px", + height: "200px" + }); + domEqual( "#dialog1", function() { + $( "#dialog1" ).dialog().dialog( "destroy" ); + }); +}); + +test("#4980: Destroy should place element back in original DOM position", function(){ + expect( 2 ); + var container = $('<div id="container"><div id="modal">Content</div></div>'), + modal = container.find('#modal'); + modal.dialog(); + ok(!$.contains(container[0], modal[0]), 'dialog should move modal element to outside container element'); + modal.dialog('destroy'); + ok($.contains(container[0], modal[0]), 'dialog(destroy) should place element back in original DOM position'); }); test( "enable/disable disabled", function() { @@ -125,4 +147,41 @@ test("open", function() { ok(el.dialog('widget').is(':visible') && !el.dialog('widget').is(':hidden'), 'dialog visible after open method called'); }); +test("#6137: dialog('open') causes form elements to reset on IE7", function() { + expect(2); + + var d1 = $('<form><input type="radio" name="radio" id="a" value="a" checked="checked"></input>' + + '<input type="radio" name="radio" id="b" value="b">b</input></form>').appendTo( "body" ).dialog({autoOpen: false}); + + d1.find('#b').prop( "checked", true ); + equal(d1.find('input:checked').val(), 'b', "checkbox b is checked"); + + d1.dialog('open'); + equal(d1.find('input:checked').val(), 'b', "checkbox b is checked"); + + d1.remove(); +}); + +test("#5531: dialog width should be at least minWidth on creation", function () { + expect( 4 ); + var el = $('<div></div>').dialog({ + width: 200, + minWidth: 300 + }); + + equal(el.dialog('option', 'width'), 300, "width is minWidth"); + el.dialog('option', 'width', 200); + equal(el.dialog('option', 'width'), 300, "width unchanged when set to < minWidth"); + el.dialog('option', 'width', 320); + equal(el.dialog('option', 'width'), 320, "width changed if set to > minWidth"); + el.remove(); + + el = $('<div></div>').dialog({ + minWidth: 300 + }); + ok(el.dialog('option', 'width') >= 300, "width is at least 300"); + el.remove(); + +}); + })(jQuery); diff --git a/tests/unit/dialog/dialog_options.js b/tests/unit/dialog/dialog_options.js index f01a1a2a8..2ccbed573 100644 --- a/tests/unit/dialog/dialog_options.js +++ b/tests/unit/dialog/dialog_options.js @@ -5,6 +5,47 @@ module("dialog: options"); +test( "appendTo", function() { + expect( 8 ); + var detached = $( "<div>" ), + element = $( "#dialog1" ).dialog(); + equal( element.dialog( "widget" ).parent()[0], document.body, "defaults to body" ); + element.dialog( "destroy" ); + + element.dialog({ + appendTo: ".wrap" + }); + equal( element.dialog( "widget" ).parent()[0], $( "#wrap1" )[0], "first found element" ); + equal( $( "#wrap2 .ui-dialog" ).length, 0, "only appends to one element" ); + element.dialog( "destroy" ); + + element.dialog({ + appendTo: null + }); + equal( element.dialog( "widget" ).parent()[0], document.body, "null" ); + element.dialog( "destroy" ); + + element.dialog({ autoOpen: false }).dialog( "option", "appendTo", "#wrap1" ).dialog( "open" ); + equal( element.dialog( "widget" ).parent()[0], $( "#wrap1" )[0], "modified after init" ); + element.dialog( "destroy" ); + + element.dialog({ + appendTo: detached + }); + equal( element.dialog( "widget" ).parent()[0], detached[0], "detached jQuery object" ); + element.dialog( "destroy" ); + + element.dialog({ + appendTo: detached[0] + }); + equal( element.dialog( "widget" ).parent()[0], detached[0], "detached DOM element" ); + element.dialog( "destroy" ); + + element.dialog({ autoOpen: false }).dialog( "option", "appendTo", detached ); + equal( element.dialog( "widget" ).parent()[0], detached[0], "detached DOM element via option()" ); + element.dialog( "destroy" ); +}); + test("autoOpen", function() { expect(2); @@ -212,6 +253,15 @@ test("height", function() { el.remove(); }); +asyncTest( "hide, #5860 - don't leave effects wrapper behind", function() { + expect( 1 ); + $( "#dialog1" ).dialog({ hide: "clip" }).dialog( "close" ).dialog( "destroy" ); + setTimeout(function() { + equal( $( ".ui-effects-wrapper" ).length, 0 ); + start(); + }, 500); +}); + test("maxHeight", function() { expect(3); @@ -428,4 +478,26 @@ test("width", function() { el.remove(); }); +test("#4826: setting resizable false toggles resizable on dialog", function() { + expect(6); + var i, + el = $('<div></div>').dialog({ resizable: false }); + + TestHelpers.dialog.shouldResize(el, 0, 0, "[default]"); + for (i=0; i<2; i++) { + el.dialog('close').dialog('open'); + TestHelpers.dialog.shouldResize(el, 0, 0, 'initialized with resizable false toggle ('+ (i+1) +')'); + } + el.remove(); + + el = $('<div></div>').dialog({ resizable: true }); + TestHelpers.dialog.shouldResize(el, 50, 50, "[default]"); + for (i=0; i<2; i++) { + el.dialog('close').dialog('option', 'resizable', false).dialog('open'); + TestHelpers.dialog.shouldResize(el, 0, 0, 'set option resizable false toggle ('+ (i+1) +')'); + } + el.remove(); + +}); + })(jQuery); diff --git a/tests/unit/dialog/dialog_test_helpers.js b/tests/unit/dialog/dialog_test_helpers.js index bbf43f48f..ef0b9b6fa 100644 --- a/tests/unit/dialog/dialog_test_helpers.js +++ b/tests/unit/dialog/dialog_test_helpers.js @@ -3,10 +3,9 @@ TestHelpers.dialog = { var d = el.dialog('widget'); //this mouseover is to work around a limitation in resizable //TODO: fix resizable so handle doesn't require mouseover in order to be used - $(handle, d).simulate("mouseover"); - $(handle, d).simulate("drag", { - dx: dx || 0, - dy: dy || 0 + $( handle, d ).simulate("mouseover").simulate( "drag", { + dx: dx, + dy: dy }); }, testDrag: function(el, dx, dy, expectedDX, expectedDY, msg) { diff --git a/tests/unit/dialog/dialog_tickets.js b/tests/unit/dialog/dialog_tickets.js deleted file mode 100644 index 655f1e445..000000000 --- a/tests/unit/dialog/dialog_tickets.js +++ /dev/null @@ -1,132 +0,0 @@ -/* - * dialog_tickets.js - */ -(function($) { - -module( "dialog: tickets" ); - -asyncTest( "#3123: Prevent tabbing out of modal dialogs", function() { - expect( 3 ); - - var el = $( "<div><input id='t3123-first'><input id='t3123-last'></div>" ).dialog({ modal: true }), - inputs = el.find( "input" ), - widget = el.dialog( "widget" )[ 0 ]; - - function checkTab() { - ok( $.contains( widget, document.activeElement ), "Tab key event moved focus within the modal" ); - - // check shift tab - $( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB, shiftKey: true }); - setTimeout( checkShiftTab, 2 ); - } - - function checkShiftTab() { - ok( $.contains( widget, document.activeElement ), "Shift-Tab key event moved focus within the modal" ); - - el.remove(); - start(); - } - - inputs.eq( 1 ).focus(); - equal( document.activeElement, inputs[1], "Focus set on second input" ); - inputs.eq( 1 ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB }); - - setTimeout( checkTab, 2 ); -}); - -test("#4826: setting resizable false toggles resizable on dialog", function() { - expect(6); - var i, - el = $('<div></div>').dialog({ resizable: false }); - - TestHelpers.dialog.shouldResize(el, 0, 0, "[default]"); - for (i=0; i<2; i++) { - el.dialog('close').dialog('open'); - TestHelpers.dialog.shouldResize(el, 0, 0, 'initialized with resizable false toggle ('+ (i+1) +')'); - } - el.remove(); - - el = $('<div></div>').dialog({ resizable: true }); - TestHelpers.dialog.shouldResize(el, 50, 50, "[default]"); - for (i=0; i<2; i++) { - el.dialog('close').dialog('option', 'resizable', false).dialog('open'); - TestHelpers.dialog.shouldResize(el, 0, 0, 'set option resizable false toggle ('+ (i+1) +')'); - } - el.remove(); - -}); - -test("#5184: isOpen in dialogclose event is true", function() { - expect( 3 ); - - var el = $( "<div></div>" ).dialog({ - close: function() { - ok( !el.dialog("isOpen"), "dialog is not open during close" ); - } - }); - ok( el.dialog("isOpen"), "dialog is open after init" ); - el.dialog( "close" ); - ok( !el.dialog("isOpen"), "dialog is not open after close" ); - el.remove(); -}); - -test("#5531: dialog width should be at least minWidth on creation", function () { - expect( 4 ); - var el = $('<div></div>').dialog({ - width: 200, - minWidth: 300 - }); - - equal(el.dialog('option', 'width'), 300, "width is minWidth"); - el.dialog('option', 'width', 200); - equal(el.dialog('option', 'width'), 300, "width unchanged when set to < minWidth"); - el.dialog('option', 'width', 320); - equal(el.dialog('option', 'width'), 320, "width changed if set to > minWidth"); - el.remove(); - - el = $('<div></div>').dialog({ - minWidth: 300 - }); - ok(el.dialog('option', 'width') >= 300, "width is at least 300"); - el.remove(); - -}); - -test("#6137: dialog('open') causes form elements to reset on IE7", function() { - expect(2); - - var d1 = $('<form><input type="radio" name="radio" id="a" value="a" checked="checked"></input>' + - '<input type="radio" name="radio" id="b" value="b">b</input></form>').appendTo( "body" ).dialog({autoOpen: false}); - - d1.find('#b').prop( "checked", true ); - equal(d1.find('input:checked').val(), 'b', "checkbox b is checked"); - - d1.dialog('open'); - equal(d1.find('input:checked').val(), 'b', "checkbox b is checked"); - - d1.remove(); -}); - -test("#6645: Missing element not found check in overlay", function(){ - expect(2); - var d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true}), - d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true, close: function(){ d2.remove(); }}); - - equal($.ui.dialog.overlay.instances.length, 2, 'two overlays created'); - d2.dialog('close'); - equal($.ui.dialog.overlay.instances.length, 1, 'one overlay remains after closing the 2nd overlay'); - d1.add(d2).remove(); -}); - -// TODO merge this with the main destroy test -test("#4980: Destroy should place element back in original DOM position", function(){ - expect( 2 ); - var container = $('<div id="container"><div id="modal">Content</div></div>'), - modal = container.find('#modal'); - modal.dialog(); - ok(!$.contains(container[0], modal[0]), 'dialog should move modal element to outside container element'); - modal.dialog('destroy'); - ok($.contains(container[0], modal[0]), 'dialog(destroy) should place element back in original DOM position'); -}); - -})(jQuery); diff --git a/tests/unit/draggable/draggable_core.js b/tests/unit/draggable/draggable_core.js index 28a19f380..2bfccbfa6 100644 --- a/tests/unit/draggable/draggable_core.js +++ b/tests/unit/draggable/draggable_core.js @@ -17,12 +17,15 @@ test("element types", function() { $.each(typeNames, function(i) { var offsetBefore, offsetAfter, typeName = typeNames[i], - el = $(document.createElement(typeName)).appendTo('#main'); + el = $(document.createElement(typeName)).appendTo('#qunit-fixture'); (typeName === 'table' && el.append("<tr><td>content</td></tr>")); el.draggable({ cancel: '' }); offsetBefore = el.offset(); - TestHelpers.draggable.drag(el, 50, 50); + el.simulate( "drag", { + dx: 50, + dy: 50 + }); offsetAfter = el.offset(); // there are some rounding errors in FF, Chrome, and IE9, so we can't say equal, we have to settle for close enough closeEnough(offsetBefore.left, offsetAfter.left - 50, 1, "dragged[50, 50] " + "<" + typeName + ">"); @@ -55,21 +58,15 @@ test("resizable handle with complex markup (#8756 / #8757)", function() { .append($('<div>')) ); - var handle = '.ui-resizable-w div', - target = $('#draggable1').draggable().resizable({ handles: 'all' }), - drag = function(el, dx) { - $(el) - .simulate("mouseover") - .simulate("drag", { - dx: dx || 0, - speed: 'sync' - }); - }; + var handle = $('.ui-resizable-w div'), + target = $('#draggable1').draggable().resizable({ handles: 'all' }); - drag(handle, -50); + // todo: fix resizable so it doesn't require a mouseover + handle.simulate("mouseover").simulate( "drag", { dx: -50 } ); equal( target.width(), 250, "compare width" ); - drag(handle, 50); + // todo: fix resizable so it doesn't require a mouseover + handle.simulate("mouseover").simulate( "drag", { dx: 50 } ); equal( target.width(), 200, "compare width" ); }); diff --git a/tests/unit/draggable/draggable_events.js b/tests/unit/draggable/draggable_events.js index 5eab97713..07a53e22e 100644 --- a/tests/unit/draggable/draggable_events.js +++ b/tests/unit/draggable/draggable_events.js @@ -18,7 +18,10 @@ test("callbacks occurrence count", function() { stop: function() { stop++; } }); - TestHelpers.draggable.drag(el, 10, 10); + el.simulate( "drag", { + dx: 10, + dy: 10 + }); equal(start, 1, "start callback should happen exactly once"); equal(dragc, 3, "drag callback should happen exactly once per mousemove"); @@ -39,7 +42,10 @@ test("stopping the start callback", function() { stop: function() { stop++; } }); - TestHelpers.draggable.drag(el, 10, 10); + el.simulate( "drag", { + dx: 10, + dy: 10 + }); equal(start, 1, "start callback should happen exactly once"); equal(dragc, 0, "drag callback should not happen at all"); @@ -60,7 +66,10 @@ test("stopping the drag callback", function() { stop: function() { stop++; } }); - TestHelpers.draggable.drag(el, 10, 10); + el.simulate( "drag", { + dx: 10, + dy: 10 + }); equal(start, 1, "start callback should happen exactly once"); equal(dragc, 1, "drag callback should happen exactly once"); @@ -77,7 +86,10 @@ test("stopping the stop callback", function() { stop: function() { return false; } }); - TestHelpers.draggable.drag(el, 10, 10); + el.simulate( "drag", { + dx: 10, + dy: 10 + }); ok($("#draggable2").data('ui-draggable').helper, "the clone should not be deleted if the stop callback is stopped"); diff --git a/tests/unit/draggable/draggable_options.js b/tests/unit/draggable/draggable_options.js index 3f4592d31..d9a7038f7 100644 --- a/tests/unit/draggable/draggable_options.js +++ b/tests/unit/draggable/draggable_options.js @@ -162,7 +162,11 @@ test("{ containment: 'parent' }, relative", function() { left: po.left + TestHelpers.draggable.border(p, 'left') + TestHelpers.draggable.margin(el, 'left'), top: po.top + TestHelpers.draggable.border(p, 'top') + TestHelpers.draggable.margin(el, 'top') }; - TestHelpers.draggable.drag(el, -100, -100); + + el.simulate( "drag", { + dx: -100, + dy: -100 + }); offsetAfter = el.offset(); deepEqual(offsetAfter, expected, 'compare offset to parent'); }); @@ -178,7 +182,11 @@ test("{ containment: 'parent' }, absolute", function() { left: po.left + TestHelpers.draggable.border(p, 'left') + TestHelpers.draggable.margin(el, 'left'), top: po.top + TestHelpers.draggable.border(p, 'top') + TestHelpers.draggable.margin(el, 'top') }; - TestHelpers.draggable.drag(el, -100, -100); + + el.simulate( "drag", { + dx: -100, + dy: -100 + }); offsetAfter = el.offset(); deepEqual(offsetAfter, expected, 'compare offset to parent'); }); @@ -214,17 +222,20 @@ test("{ cursor: 'auto' }, default", function() { expect(2); - var expected = "auto", actual, before, after; - - $("#draggable2").draggable({ - cursor: expected, - start: function() { - actual = getCursor(); - } - }); + var actual, before, after, + expected = "auto", + el = $("#draggable2").draggable({ + cursor: expected, + start: function() { + actual = getCursor(); + } + }); before = getCursor(); - TestHelpers.draggable.drag("#draggable2", -1, -1); + el.simulate( "drag", { + dx: -1, + dy: -1 + }); after = getCursor(); equal(actual, expected, "start callback: cursor '" + expected + "'"); @@ -238,17 +249,20 @@ test("{ cursor: 'move' }", function() { expect(2); - var expected = "move", actual, before, after; - - $("#draggable2").draggable({ - cursor: expected, - start: function() { - actual = getCursor(); - } - }); + var actual, before, after, + expected = "move", + el = $("#draggable2").draggable({ + cursor: expected, + start: function() { + actual = getCursor(); + } + }); before = getCursor(); - TestHelpers.draggable.drag("#draggable2", -1, -1); + el.simulate( "drag", { + dx: -1, + dy: -1 + }); after = getCursor(); equal(actual, expected, "start callback: cursor '" + expected + "'"); @@ -648,7 +662,10 @@ test("{ helper: 'clone' }, absolute", function() { helperOffset = ui.helper.offset(); } }); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); }); @@ -666,17 +683,26 @@ test("{ helper: 'clone' }, absolute with scroll offset on parent", function() { $("#main").css('position', 'relative'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'static'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'absolute'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); TestHelpers.draggable.restoreScroll(); @@ -696,17 +722,26 @@ test("{ helper: 'clone' }, absolute with scroll offset on root", function() { $("#main").css('position', 'relative'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'static'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'absolute'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); TestHelpers.draggable.restoreScroll('root'); @@ -728,17 +763,26 @@ test("{ helper: 'clone' }, absolute with scroll offset on root and parent", func $("#main").css('position', 'relative'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'static'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); $("#main").css('position', 'absolute'); origOffset = $("#draggable1").offset(); - TestHelpers.draggable.drag(el, 1, 1); + el.simulate( "drag", { + dx: 1, + dy: 1 + }); deepEqual({ top: helperOffset.top-1, left: helperOffset.left-1 }, origOffset, 'dragged[1, 1] '); TestHelpers.draggable.restoreScroll('root'); @@ -750,17 +794,19 @@ test("{ opacity: 0.5 }", function() { expect(1); - var opacity = null; - - $("#draggable2").draggable({ - opacity: 0.5, - start: function() { - opacity = $(this).css("opacity"); - } + var opacity = null, + el = $("#draggable2").draggable({ + opacity: 0.5, + start: function() { + opacity = $(this).css("opacity"); + } + }); + + el.simulate( "drag", { + dx: -1, + dy: -1 }); - TestHelpers.draggable.drag("#draggable2", -1, -1); - equal(opacity, 0.5, "start callback: opacity is"); }); @@ -770,17 +816,19 @@ test("{ zIndex: 10 }", function() { expect(1); var actual, - expected = 10; - - $("#draggable2").draggable({ - zIndex: expected, - start: function() { - actual = $(this).css("zIndex"); - } + expected = 10, + el = $("#draggable2").draggable({ + zIndex: expected, + start: function() { + actual = $(this).css("zIndex"); + } + }); + + el.simulate( "drag", { + dx: -1, + dy: -1 }); - TestHelpers.draggable.drag("#draggable2", -1, -1); - equal(actual, expected, "start callback: zIndex is"); }); diff --git a/tests/unit/draggable/draggable_test_helpers.js b/tests/unit/draggable/draggable_test_helpers.js index 7057df1f8..9a6355b2e 100644 --- a/tests/unit/draggable/draggable_test_helpers.js +++ b/tests/unit/draggable/draggable_test_helpers.js @@ -1,17 +1,14 @@ TestHelpers.draggable = { // todo: remove the unreliable offset hacks unreliableOffset: $.ui.ie && ( !document.documentMode || document.documentMode < 8 ) ? 2 : 0, - drag: function(handle, dx, dy) { - $(handle).simulate("drag", { - dx: dx || 0, - dy: dy || 0 - }); - }, testDrag: function(el, handle, dx, dy, expectedDX, expectedDY, msg) { var offsetAfter, actual, expected, offsetBefore = el.offset(); - TestHelpers.draggable.drag(handle, dx, dy); + $( handle ).simulate( "drag", { + dx: dx, + dy: dy + }); offsetAfter = el.offset(); actual = { left: offsetAfter.left, top: offsetAfter.top }, diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index a94968138..3c94a5a6c 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -87,7 +87,7 @@ asyncTest( "handle blur via click outside", function() { }); }); -test( "handle focus of menu with active item", function() { +asyncTest( "handle focus of menu with active item", function() { expect( 1 ); var element = $( "#menu1" ).menu({ focus: function( event ) { @@ -96,11 +96,19 @@ test( "handle focus of menu with active item", function() { }); log( "focus", true ); - element.focus(); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.focus(); - equal( logOutput(), "focus,0,1,2,2", "current active item remains active" ); + element[0].focus(); + setTimeout(function() { + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element[0].blur(); + setTimeout(function() { + element[0].focus(); + setTimeout(function() { + equal( logOutput(), "focus,0,1,2,2", "current active item remains active" ); + start(); + }); + }); + }); }); asyncTest( "handle submenu auto collapse: mouseleave", function() { @@ -162,7 +170,7 @@ asyncTest( "handle submenu auto collapse: mouseleave", function() { }); -test( "handle keyboard navigation on menu without scroll and without submenus", function() { +asyncTest( "handle keyboard navigation on menu without scroll and without submenus", function() { expect( 12 ); var element = $( "#menu1" ).menu({ select: function( event, ui ) { @@ -174,54 +182,58 @@ test( "handle keyboard navigation on menu without scroll and without submenus", }); log( "keydown", true ); - element.focus(); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( logOutput(), "keydown,0,1,2", "Keydown DOWN" ); + element[0].focus(); + setTimeout(function() { + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal( logOutput(), "keydown,0,1,2", "Keydown DOWN" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equal( logOutput(), "keydown,1", "Keydown UP" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal( logOutput(), "keydown,1", "Keydown UP" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); - equal( logOutput(), "keydown", "Keydown LEFT (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal( logOutput(), "keydown", "Keydown LEFT (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); - equal( logOutput(), "keydown", "Keydown RIGHT (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal( logOutput(), "keydown", "Keydown RIGHT (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,4", "Keydown PAGE_DOWN" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal( logOutput(), "keydown,4", "Keydown PAGE_DOWN" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown", "Keydown PAGE_DOWN (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal( logOutput(), "keydown", "Keydown PAGE_DOWN (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown,0", "Keydown PAGE_UP" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal( logOutput(), "keydown,0", "Keydown PAGE_UP" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown", "Keydown PAGE_UP (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal( logOutput(), "keydown", "Keydown PAGE_UP (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); - equal( logOutput(), "keydown,4", "Keydown END" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equal( logOutput(), "keydown,4", "Keydown END" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); - equal( logOutput(), "keydown,0", "Keydown HOME" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equal( logOutput(), "keydown,0", "Keydown HOME" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); - equal( logOutput(), "keydown", "Keydown ESCAPE (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equal( logOutput(), "keydown", "Keydown ESCAPE (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - equal( logOutput(), "keydown,Aberdeen", "Keydown ENTER" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equal( logOutput(), "keydown,Aberdeen", "Keydown ENTER" ); + + start(); + }); }); asyncTest( "handle keyboard navigation on menu without scroll and with submenus", function() { @@ -344,7 +356,7 @@ asyncTest( "handle keyboard navigation on menu without scroll and with submenus" } }); -test( "handle keyboard navigation on menu with scroll and without submenus", function() { +asyncTest( "handle keyboard navigation on menu with scroll and without submenus", function() { expect( 14 ); var element = $( "#menu3" ).menu({ select: function( event, ui ) { @@ -356,63 +368,67 @@ test( "handle keyboard navigation on menu with scroll and without submenus", fun }); log( "keydown", true ); - element.focus(); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( logOutput(), "keydown,0,1,2", "Keydown DOWN" ); + element[0].focus(); + setTimeout(function() { + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equal( logOutput(), "keydown,0,1,2", "Keydown DOWN" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); - equal( logOutput(), "keydown,1,0", "Keydown UP" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equal( logOutput(), "keydown,1,0", "Keydown UP" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); - equal( logOutput(), "keydown", "Keydown LEFT (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equal( logOutput(), "keydown", "Keydown LEFT (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); - equal( logOutput(), "keydown", "Keydown RIGHT (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equal( logOutput(), "keydown", "Keydown RIGHT (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_UP" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal( logOutput(), "keydown,10", "Keydown PAGE_UP" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown,0", "Keydown PAGE_UP" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal( logOutput(), "keydown,0", "Keydown PAGE_UP" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown", "Keydown PAGE_UP (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equal( logOutput(), "keydown", "Keydown PAGE_UP (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); - equal( logOutput(), "keydown,37", "Keydown END" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equal( logOutput(), "keydown,37", "Keydown END" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown", "Keydown PAGE_DOWN (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equal( logOutput(), "keydown", "Keydown PAGE_DOWN (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); - equal( logOutput(), "keydown,0", "Keydown HOME" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equal( logOutput(), "keydown,0", "Keydown HOME" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); - equal( logOutput(), "keydown", "Keydown ESCAPE (no effect)" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equal( logOutput(), "keydown", "Keydown ESCAPE (no effect)" ); - log( "keydown", true ); - element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - equal( logOutput(), "keydown,Aberdeen", "Keydown ENTER" ); + log( "keydown", true ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equal( logOutput(), "keydown,Aberdeen", "Keydown ENTER" ); + + start(); + }); }); asyncTest( "handle keyboard navigation on menu with scroll and with submenus", function() { @@ -561,7 +577,7 @@ asyncTest( "handle keyboard navigation and mouse click on menu with disabled ite } }); -test( "handle keyboard navigation with spelling of menu items", function() { +asyncTest( "handle keyboard navigation with spelling of menu items", function() { expect( 2 ); var element = $( "#menu2" ).menu({ focus: function( event ) { @@ -577,8 +593,9 @@ test( "handle keyboard navigation with spelling of menu items", function() { equal( logOutput(), "keydown,0,1,3", "Keydown focus Addyston by spelling the first 3 letters" ); element.simulate( "keydown", { keyCode: 68 } ); equal( logOutput(), "keydown,0,1,3,4", "Keydown focus Delphi by repeating the 'd' again" ); + start(); }); - element.focus(); + element[0].focus(); }); })( jQuery ); diff --git a/tests/unit/progressbar/progressbar_common.js b/tests/unit/progressbar/progressbar_common.js index 2f97a78bb..0768576f5 100644 --- a/tests/unit/progressbar/progressbar_common.js +++ b/tests/unit/progressbar/progressbar_common.js @@ -1,10 +1,12 @@ TestHelpers.commonWidgetTests( "progressbar", { defaults: { disabled: false, - value: 0, max: 100, + value: 0, //callbacks + change: null, + complete: null, create: null } }); diff --git a/tests/unit/progressbar/progressbar_core.js b/tests/unit/progressbar/progressbar_core.js index 0a2ef895b..cffd84d21 100644 --- a/tests/unit/progressbar/progressbar_core.js +++ b/tests/unit/progressbar/progressbar_core.js @@ -1,7 +1,7 @@ module( "progressbar: core" ); test( "accessibility", function() { - expect( 7 ); + expect( 11 ); var element = $( "#progressbar" ).progressbar(); equal( element.attr( "role" ), "progressbar", "aria role" ); @@ -12,9 +12,17 @@ test( "accessibility", function() { element.progressbar( "value", 77 ); equal( element.attr( "aria-valuenow" ), 77, "aria-valuenow" ); + element.progressbar( "option", "max", 150 ); + equal( element.attr( "aria-valuemax" ), 150, "aria-valuemax" ); + element.progressbar( "disable" ); equal( element.attr( "aria-disabled" ), "true", "aria-disabled on" ); element.progressbar( "enable" ); equal( element.attr( "aria-disabled" ), "false", "aria-disabled off" ); + + element.progressbar( "option", "value", false ); + equal( element.attr( "aria-valuemin" ), 0, "aria-valuemin" ); + equal( element.attr( "aria-valuemax" ), 150, "aria-valuemax" ); + strictEqual( element.attr( "aria-valuenow" ), undefined, "aria-valuenow" ); }); diff --git a/tests/unit/progressbar/progressbar_events.js b/tests/unit/progressbar/progressbar_events.js index fe05182a1..95effda75 100644 --- a/tests/unit/progressbar/progressbar_events.js +++ b/tests/unit/progressbar/progressbar_events.js @@ -5,34 +5,40 @@ test( "create", function() { $( "#progressbar" ).progressbar({ value: 5, create: function() { - deepEqual( 5, $( this ).progressbar( "value" ) ); + equal( $( this ).progressbar( "value" ), 5, "Correct value at create" ); }, change: function() { - ok( false, "create() has triggered change()" ); + ok( false, "create has triggered change()" ); } }); }); test( "change", function() { - expect( 1 ); - $( "#progressbar" ).progressbar({ - change: function() { - deepEqual( 5, $( thisĀ ).progressbar( "value" ) ); - } - }).progressbar( "value", 5 ); + expect( 2 ); + var element = $( "#progressbar" ).progressbar(); + + element.one( "progressbarchange", function() { + equal( element.progressbar( "value" ), 5, "change triggered for middle value" ); + }); + element.progressbar( "value", 5 ); + element.one( "progressbarchange", function() { + equal( element.progressbar( "value" ), 100, "change triggered for final value" ); + }); + element.progressbar( "value", 100 ); }); test( "complete", function() { - expect( 4 ); + expect( 5 ); var value, changes = 0, element = $( "#progressbar" ).progressbar({ change: function() { changes++; - deepEqual( element.progressbar( "value" ), value, "change at " + value ); + equal( element.progressbar( "value" ), value, "change at " + value ); }, complete: function() { equal( changes, 3, "complete triggered after change and not on indeterminate" ); + equal( element.progressbar( "value" ), 100, "value is 100" ); } }); diff --git a/tests/unit/progressbar/progressbar_methods.js b/tests/unit/progressbar/progressbar_methods.js index 990739c6e..cf7faf6af 100644 --- a/tests/unit/progressbar/progressbar_methods.js +++ b/tests/unit/progressbar/progressbar_methods.js @@ -12,7 +12,7 @@ test( "value", function() { var element = $( "<div>" ).progressbar({ value: 20 }); equal( element.progressbar( "value" ), 20, "correct value as getter" ); - equal( element.progressbar( "value", 30), element, "chainable as setter" ); + strictEqual( element.progressbar( "value", 30 ), element, "chainable as setter" ); equal( element.progressbar( "option", "value" ), 30, "correct value after setter" ); }); diff --git a/tests/unit/progressbar/progressbar_options.js b/tests/unit/progressbar/progressbar_options.js index e4d9b7ab8..bc0b5d00d 100644 --- a/tests/unit/progressbar/progressbar_options.js +++ b/tests/unit/progressbar/progressbar_options.js @@ -1,14 +1,14 @@ module( "progressbar: options" ); -test( "{ value : 0 }, default", function() { +test( "{ value: 0 }, default", function() { expect( 1 ); $( "#progressbar" ).progressbar(); - equal( 0, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 0 ); }); // Ticket #7231 - valueDiv should be hidden when value is at 0% test( "value: visibility of valueDiv", function() { - expect( 5 ); + expect( 4 ); var element = $( "#progressbar" ).progressbar({ value: 0 }); @@ -23,58 +23,50 @@ test( "value: visibility of valueDiv", function() { element.progressbar( "value", 0 ); ok( element.children( ".ui-progressbar-value" ).is( ":hidden" ), "valueDiv hidden when value is set to 0" ); - element.progressbar( "value", -1 ); - ok( element.children( ".ui-progressbar-value" ).is( ":hidden" ), - "valueDiv hidden when value set to -1 (normalizes to 0)" ); }); -test( "{ value : 5 }", function() { +test( "{ value: 5 }", function() { expect( 1 ); $( "#progressbar" ).progressbar({ value: 5 }); - equal( 5, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 5 ); }); -test( "{ value : -5 }", function() { +test( "{ value: -5 }", function() { expect( 1 ); $( "#progressbar" ).progressbar({ value: -5 }); - deepEqual( 0, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 0, + "value constrained at min" ); }); -test( "{ value : 105 }", function() { +test( "{ value: 105 }", function() { expect( 1 ); $( "#progressbar" ).progressbar({ value: 105 }); - deepEqual( 100, $( "#progressbar" ).progressbar( "value" ) ); -}); - -test( "{ max : 5, value : 10 }", function() { - expect( 1 ); - $("#progressbar").progressbar({ - max: 5, - value: 10 - }); - deepEqual( 5, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 100, + "value constrained at max" ); }); -test( "{ value : 10, max : 5 }", function() { +test( "{ value: 10, max: 5 }", function() { expect( 1 ); $("#progressbar").progressbar({ max: 5, value: 10 }); - deepEqual( 5, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 5, + "value constrained at max" ); }); -test( "{ max : 5 }", function() { +test( "change max below value", function() { expect( 1 ); $("#progressbar").progressbar({ max: 10, value: 10 }).progressbar( "option", "max", 5 ); - deepEqual( 5, $( "#progressbar" ).progressbar( "value" ) ); + equal( $( "#progressbar" ).progressbar( "value" ), 5, + "value constrained at max" ); }); diff --git a/tests/unit/resizable/resizable.html b/tests/unit/resizable/resizable.html index 0a27f2a80..255c98887 100644 --- a/tests/unit/resizable/resizable.html +++ b/tests/unit/resizable/resizable.html @@ -31,15 +31,19 @@ <script src="../swarminject.js"></script> <style> - #resizable1 { - background: green; - height: 100px; - width: 100px; - } - #resizable2 { - height: 100px; - width: 100px; - } + #container { + width: 300px; + height: 200px; + } + #resizable1 { + background: green; + height: 100px; + width: 100px; + } + #resizable2 { + height: 100px; + width: 100px; + } </style> </head> <body> @@ -51,7 +55,9 @@ <ol id="qunit-tests"></ol> <div id="qunit-fixture"> -<div id="resizable1">I'm a resizable.</div> +<div id="container"> + <div id="resizable1">I'm a resizable.</div> +</div> <img src="images/test.jpg" id="resizable2" alt="solid gray"> </div> diff --git a/tests/unit/resizable/resizable_events.js b/tests/unit/resizable/resizable_events.js index 14de76da6..ac222ec10 100644 --- a/tests/unit/resizable/resizable_events.js +++ b/tests/unit/resizable/resizable_events.js @@ -29,19 +29,19 @@ test("start", function() { }); -test("resize", function() { +test( "resize", function() { - expect(9); + expect( 9 ); var count = 0, handle = ".ui-resizable-se"; $("#resizable1").resizable({ handles: "all", - resize: function(event, ui) { - if (count === 0) { - equal( ui.size.width, 101, "compare width" ); - equal( ui.size.height, 101, "compare height" ); + resize: function( event, ui ) { + if ( count === 0 ) { + equal( ui.size.width, 125, "compare width" ); + equal( ui.size.height, 125, "compare height" ); equal( ui.originalSize.width, 100, "compare original width" ); equal( ui.originalSize.height, 100, "compare original height" ); } else { @@ -54,15 +54,15 @@ test("resize", function() { } }); - TestHelpers.resizable.drag(handle, 50, 50); + TestHelpers.resizable.drag( handle, 50, 50 ); - equal(count, 2, "resize callback should happen exactly once per size adjustment"); + equal( count, 2, "resize callback should happen exactly once per size adjustment" ); }); -test("resize (min/max dimensions)", function() { +test( "resize (min/max dimensions)", function() { - expect(5); + expect( 5 ); var count = 0, handle = ".ui-resizable-se"; @@ -73,7 +73,7 @@ test("resize (min/max dimensions)", function() { minHeight: 60, maxWidth: 100, maxHeight: 100, - resize: function(event, ui) { + resize: function( event, ui ) { equal( ui.size.width, 60, "compare width" ); equal( ui.size.height, 60, "compare height" ); equal( ui.originalSize.width, 100, "compare original width" ); @@ -82,15 +82,15 @@ test("resize (min/max dimensions)", function() { } }); - TestHelpers.resizable.drag(handle, -50, -50); + TestHelpers.resizable.drag( handle, -200, -200 ); - equal(count, 1, "resize callback should happen exactly once per size adjustment"); + equal( count, 1, "resize callback should happen exactly once per size adjustment" ); }); -test("resize (containment)", function() { +test( "resize (containment)", function() { - expect(5); + expect( 5 ); var count = 0, handle = ".ui-resizable-se", @@ -102,18 +102,22 @@ test("resize (containment)", function() { $("#resizable1").resizable({ handles: "all", containment: container, - resize: function(event, ui) { - equal( ui.size.width, 50, "compare width" ); - equal( ui.size.height, 50, "compare height" ); + resize: function( event, ui ) { + equal( ui.size.width, 10, "compare width" ); + equal( ui.size.height, 10, "compare height" ); equal( ui.originalSize.width, 100, "compare original width" ); equal( ui.originalSize.height, 100, "compare original height" ); count++; } }); - TestHelpers.resizable.drag(handle, -50, -50); + // Prove you can't resize outside containment by dragging southeast corner southeast + TestHelpers.resizable.drag( handle, 100, 100 ); - equal(count, 1, "resize callback should happen exactly once per size adjustment"); + // Prove you can't resize outside containment by dragging southeast corner northwest + TestHelpers.resizable.drag( handle, -200, -200 ); + + equal( count, 1, "resize callback should happen exactly once per size adjustment" ); }); @@ -148,7 +152,7 @@ test("stop", function() { var count = 0, handle = ".ui-resizable-se"; - + $("#resizable1").resizable({ handles: "all", stop: function(event, ui) { diff --git a/tests/unit/resizable/resizable_options.js b/tests/unit/resizable/resizable_options.js index 4b47762ab..d79523183 100644 --- a/tests/unit/resizable/resizable_options.js +++ b/tests/unit/resizable/resizable_options.js @@ -5,6 +5,26 @@ module("resizable: options"); +test( "alsoResize", function() { + expect( 2 ); + + var other = $( "<div>" ) + .css({ + width: 50, + height: 50 + }) + .appendTo( "body" ), + element = $( "#resizable1" ).resizable({ + alsoResize: other + }), + handle = ".ui-resizable-e"; + + TestHelpers.resizable.drag( handle, 80 ); + equal( element.width(), 180, "resizable width" ); + equal( other.width(), 130, "alsoResize width" ); +}); + + test("aspectRatio: 'preserve' (e)", function() { expect(4); @@ -103,6 +123,21 @@ test("aspectRatio: 'preserve' (ne)", function() { equal( target.height(), 70, "compare minHeight"); }); +test( "containment", function() { + expect( 4 ); + var element = $( "#resizable1" ).resizable({ + containment: "#container" + }); + + TestHelpers.resizable.drag( ".ui-resizable-se", 20, 30 ); + equal( element.width(), 120, "unconstrained width within container" ); + equal( element.height(), 130, "unconstrained height within container" ); + + TestHelpers.resizable.drag( ".ui-resizable-se", 400, 400 ); + equal( element.width(), 300, "constrained width at containment edge" ); + equal( element.height(), 200, "constrained height at containment edge" ); +}); + test("grid", function() { expect(4); @@ -210,4 +245,24 @@ test("zIndex, applied to all handles", function() { }); }); +test( "alsoResize + containment", function() { + expect( 4 ); + var other = $( "<div>" ) + .css({ + width: 50, + height: 50 + }) + .appendTo( "body" ), + element = $( "#resizable1" ).resizable({ + alsoResize: other, + containment: "#container" + }); + + TestHelpers.resizable.drag( ".ui-resizable-se", 400, 400 ); + equal( element.width(), 300, "resizable constrained width at containment edge" ); + equal( element.height(), 200, "resizable constrained height at containment edge" ); + equal( other.width(), 250, "alsoResize constrained width at containment edge" ); + equal( other.height(), 150, "alsoResize constrained height at containment edge" ); +}); + })(jQuery); diff --git a/tests/unit/resizable/resizable_test_helpers.js b/tests/unit/resizable/resizable_test_helpers.js index fe6c84900..7ab5aa1a5 100644 --- a/tests/unit/resizable/resizable_test_helpers.js +++ b/tests/unit/resizable/resizable_test_helpers.js @@ -1,15 +1,11 @@ TestHelpers.resizable = { - drag: function(el, dx, dy, complete) { - - // speed = sync -> Drag syncrhonously. - // speed = fast|slow -> Drag asyncrhonously - animated. - - //this mouseover is to work around a limitation in resizable - //TODO: fix resizable so handle doesn't require mouseover in order to be used - $(el).simulate("mouseover"); - - return $(el).simulate("drag", { - dx: dx||0, dy: dy||0, speed: 'sync', complete: complete + drag: function( el, dx, dy ) { + // this mouseover is to work around a limitation in resizable + // TODO: fix resizable so handle doesn't require mouseover in order to be used + $( el ).simulate("mouseover").simulate( "drag", { + moves: 2, + dx: dx, + dy: dy }); } };
\ No newline at end of file diff --git a/tests/unit/selectable/selectable_events.js b/tests/unit/selectable/selectable_events.js index 331bae146..984fd1862 100644 --- a/tests/unit/selectable/selectable_events.js +++ b/tests/unit/selectable/selectable_events.js @@ -1,32 +1,38 @@ /* * selectable_events.js */ -(function($) { +(function( $ ) { module("selectable: events"); -test("start", function() { - expect(2); +test( "start", function() { + expect( 2 ); var el = $("#selectable1"); el.selectable({ start: function() { - ok(true, "drag fired start callback"); - equal(this, el[0], "context of callback"); + ok( true, "drag fired start callback" ); + equal( this, el[0], "context of callback" ); } }); - el.simulate("drag", 20, 20); + el.simulate( "drag", { + dx: 20, + dy: 20 + }); }); -test("stop", function() { - expect(2); +test( "stop", function() { + expect( 2 ); var el = $("#selectable1"); el.selectable({ start: function() { - ok(true, "drag fired stop callback"); - equal(this, el[0], "context of callback"); + ok( true, "drag fired stop callback" ); + equal( this, el[0], "context of callback" ); } }); - el.simulate("drag", 20, 20); + el.simulate( "drag", { + dx: 20, + dy: 20 + }); }); -})(jQuery); +})( jQuery ); diff --git a/tests/unit/selectable/selectable_methods.js b/tests/unit/selectable/selectable_methods.js index aa8924176..d894a13e4 100644 --- a/tests/unit/selectable/selectable_methods.js +++ b/tests/unit/selectable/selectable_methods.js @@ -53,10 +53,16 @@ test("enable", function() { disabled: true, start: function() { fired = true; } }); - el.simulate("drag", 20, 20); + el.simulate( "drag", { + dx: 20, + dy: 20 + }); equal(fired, false, "start fired"); el.selectable("enable"); - el.simulate("drag", 20, 20); + el.simulate( "drag", { + dx: 20, + dy: 20 + }); equal(fired, true, "start fired"); el.selectable("destroy"); @@ -75,11 +81,18 @@ test("disable", function() { disabled: false, start: function() { fired = true; } }); - el.simulate("drag", 20, 20); + el.simulate( "drag", { + dx: 20, + dy: 20 + }); equal(fired, true, "start fired"); el.selectable("disable"); fired = false; - el.simulate("drag", 20, 20); + + el.simulate( "drag", { + dx: 20, + dy: 20 + }); equal(fired, false, "start fired"); el.selectable("destroy"); diff --git a/tests/unit/selectable/selectable_options.js b/tests/unit/selectable/selectable_options.js index 50e047427..a2455fdca 100644 --- a/tests/unit/selectable/selectable_options.js +++ b/tests/unit/selectable/selectable_options.js @@ -15,7 +15,10 @@ test("autoRefresh", function() { el = $("#selectable1").selectable({ autoRefresh: false, selected: selected }); sel.hide(); - TestHelpers.selectable.drag(el, 1000, 1000); + el.simulate( "drag", { + dx: 1000, + dy: 1000 + }); equal(actual, sel.length); el.selectable("destroy"); @@ -23,11 +26,19 @@ test("autoRefresh", function() { sel.show(); el = $("#selectable1").selectable({ autoRefresh: true, selected: selected }); sel.hide(); - TestHelpers.selectable.drag(el, 1000, 1000); + el.simulate( "drag", { + dx: 1000, + dy: 1000 + }); equal(actual, 0); + sel.show(); - TestHelpers.selectable.drag( sel[ 0 ], 1000, 1000 ); + $( sel[ 0 ] ).simulate( "drag", { + dx: 1000, + dy: 1000 + }); equal(actual, sel.length); + el.selectable("destroy"); sel.show(); }); @@ -42,7 +53,10 @@ test("filter", function() { el = $("#selectable1").selectable({ filter: '.special', selected: selected }); - TestHelpers.selectable.drag(el, 1000, 1000); + el.simulate( "drag", { + dx: 1000, + dy: 1000 + }); ok(sel.length !== 1, "this test assumes more than 1 selectee"); equal(actual, 1); el.selectable("destroy"); diff --git a/tests/unit/selectable/selectable_test_helpers.js b/tests/unit/selectable/selectable_test_helpers.js deleted file mode 100644 index 6f87efbb3..000000000 --- a/tests/unit/selectable/selectable_test_helpers.js +++ /dev/null @@ -1,8 +0,0 @@ -TestHelpers.selectable = { - drag: function( el, dx, dy ) { - $( el ).simulate( "drag", { - dx: dx || 0, - dy: dy || 0 - }); - } -};
\ No newline at end of file diff --git a/tests/unit/sortable/sortable_events.js b/tests/unit/sortable/sortable_events.js index 556f539e1..b9ee078f5 100644 --- a/tests/unit/sortable/sortable_events.js +++ b/tests/unit/sortable/sortable_events.js @@ -9,9 +9,13 @@ test("start", function() { expect( 7 ); var hash; - $("#sortable") - .sortable({ start: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 10 }); + $("#sortable").sortable({ + start: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 10 + }); ok(hash, 'start event triggered'); ok(hash.helper, 'UI hash includes: helper'); @@ -30,9 +34,13 @@ test("sort", function() { expect( 7 ); var hash; - $("#sortable") - .sortable({ sort: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 10 }); + $("#sortable").sortable({ + sort: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 10 + }); ok(hash, 'sort event triggered'); ok(hash.helper, 'UI hash includes: helper'); @@ -48,15 +56,24 @@ test("change", function() { expect( 8 ); var hash; - $("#sortable") - .sortable({ change: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 1, dy: 1 }); + $("#sortable").sortable({ + change: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dx: 1, + dy: 1 + }); ok(!hash, '1px drag, change event should not be triggered'); - $("#sortable") - .sortable({ change: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 22 }); + $("#sortable").sortable({ + change: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 22 + }); ok(hash, 'change event triggered'); ok(hash.helper, 'UI hash includes: helper'); @@ -72,9 +89,13 @@ test("beforeStop", function() { expect( 7 ); var hash; - $("#sortable") - .sortable({ beforeStop: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 20 }); + $("#sortable").sortable({ + beforeStop: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 20 + }); ok(hash, 'beforeStop event triggered'); ok(hash.helper, 'UI hash includes: helper'); @@ -90,9 +111,13 @@ test("stop", function() { expect( 7 ); var hash; - $("#sortable") - .sortable({ stop: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 20 }); + $("#sortable").sortable({ + stop: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 20 + }); ok(hash, 'stop event triggered'); ok(!hash.helper, 'UI should not include: helper'); @@ -108,15 +133,24 @@ test("update", function() { expect( 8 ); var hash; - $("#sortable") - .sortable({ update: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 1, dy: 1 }); + $("#sortable").sortable({ + update: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dx: 1, + dy: 1 + }); ok(!hash, '1px drag, update event should not be triggered'); - $("#sortable") - .sortable({ update: function(e, ui) { hash = ui; } }) - .find('li:eq(0)').simulate("drag", { dx: 0, dy: 22 }); + $("#sortable").sortable({ + update: function( e, ui ) { + hash = ui; + } + }).find("li:eq(0)").simulate( "drag", { + dy: 22 + }); ok(hash, 'update event triggered'); ok(!hash.helper, 'UI hash should not include: helper'); @@ -128,6 +162,67 @@ test("update", function() { }); +test("#3019: Stop fires too early", function() { + expect(2); + + var helper = null, + el = $("#sortable").sortable({ + stop: function(event, ui) { + helper = ui.helper; + } + }); + + TestHelpers.sortable.sort($("li", el)[0], 0, 44, 2, 'Dragging the sortable'); + equal(helper, null, "helper should be false"); + +}); + +test('#4752: link event firing on sortable with connect list', function () { + expect( 10 ); + + var fired = {}, + hasFired = function (type) { return (type in fired) && (true === fired[type]); }; + + $('#sortable').clone().attr('id', 'sortable2').insertAfter('#sortable'); + + $('#qunit-fixture ul').sortable({ + connectWith: '#qunit-fixture ul', + change: function () { + fired.change = true; + }, + receive: function () { + fired.receive = true; + }, + remove: function () { + fired.remove = true; + } + }); + + $('#qunit-fixture ul').bind('click.ui-sortable-test', function () { + fired.click = true; + }); + + $('#sortable li:eq(0)').simulate('click'); + ok(!hasFired('change'), 'Click only, change event should not have fired'); + ok(hasFired('click'), 'Click event should have fired'); + + // Drag an item within the first list + fired = {}; + $('#sortable li:eq(0)').simulate('drag', { dx: 0, dy: 40 }); + ok(hasFired('change'), '40px drag, change event should have fired'); + ok(!hasFired('receive'), 'Receive event should not have fired'); + ok(!hasFired('remove'), 'Remove event should not have fired'); + ok(!hasFired('click'), 'Click event should not have fired'); + + // Drag an item from the first list to the second, connected list + fired = {}; + $('#sortable li:eq(0)').simulate('drag', { dx: 0, dy: 150 }); + ok(hasFired('change'), '150px drag, change event should have fired'); + ok(hasFired('receive'), 'Receive event should have fired'); + ok(hasFired('remove'), 'Remove event should have fired'); + ok(!hasFired('click'), 'Click event should not have fired'); +}); + /* test("receive", function() { ok(false, "missing test - untested code is broken code."); diff --git a/tests/unit/sortable/sortable_test_helpers.js b/tests/unit/sortable/sortable_test_helpers.js index 7569b5797..12e4829ea 100644 --- a/tests/unit/sortable/sortable_test_helpers.js +++ b/tests/unit/sortable/sortable_test_helpers.js @@ -1,9 +1,9 @@ TestHelpers.sortable = { - sort: function(handle, dx, dy, index, msg) { - $(handle).simulate("drag", { - dx: dx || 0, - dy: dy || 0 + sort: function( handle, dx, dy, index, msg ) { + $( handle ).simulate( "drag", { + dx: dx, + dy: dy }); - equal($(handle).parent().children().index(handle), index, msg); + equal( $( handle ).parent().children().index( handle ), index, msg ); } };
\ No newline at end of file diff --git a/tests/unit/sortable/sortable_tickets.js b/tests/unit/sortable/sortable_tickets.js deleted file mode 100644 index eebd8dc21..000000000 --- a/tests/unit/sortable/sortable_tickets.js +++ /dev/null @@ -1,69 +0,0 @@ -/* - * sortable_tickets.js - */ -(function($) { - -module("sortable: tickets"); - -test("#3019: Stop fires too early", function() { - expect(2); - - var helper = null, - el = $("#sortable").sortable({ - stop: function(event, ui) { - helper = ui.helper; - } - }); - - TestHelpers.sortable.sort($("li", el)[0], 0, 44, 2, 'Dragging the sortable'); - equal(helper, null, "helper should be false"); - -}); - -test('#4752: link event firing on sortable with connect list', function () { - expect( 10 ); - - var fired = {}, - hasFired = function (type) { return (type in fired) && (true === fired[type]); }; - - $('#sortable').clone().attr('id', 'sortable2').insertAfter('#sortable'); - - $('#qunit-fixture ul').sortable({ - connectWith: '#qunit-fixture ul', - change: function () { - fired.change = true; - }, - receive: function () { - fired.receive = true; - }, - remove: function () { - fired.remove = true; - } - }); - - $('#qunit-fixture ul').bind('click.ui-sortable-test', function () { - fired.click = true; - }); - - $('#sortable li:eq(0)').simulate('click'); - ok(!hasFired('change'), 'Click only, change event should not have fired'); - ok(hasFired('click'), 'Click event should have fired'); - - // Drag an item within the first list - fired = {}; - $('#sortable li:eq(0)').simulate('drag', { dx: 0, dy: 40 }); - ok(hasFired('change'), '40px drag, change event should have fired'); - ok(!hasFired('receive'), 'Receive event should not have fired'); - ok(!hasFired('remove'), 'Remove event should not have fired'); - ok(!hasFired('click'), 'Click event should not have fired'); - - // Drag an item from the first list to the second, connected list - fired = {}; - $('#sortable li:eq(0)').simulate('drag', { dx: 0, dy: 150 }); - ok(hasFired('change'), '150px drag, change event should have fired'); - ok(hasFired('receive'), 'Receive event should have fired'); - ok(hasFired('remove'), 'Remove event should have fired'); - ok(!hasFired('click'), 'Click event should not have fired'); -}); - -})(jQuery); diff --git a/tests/unit/spinner/spinner_events.js b/tests/unit/spinner/spinner_events.js index 64f510de0..1ee0d17a5 100644 --- a/tests/unit/spinner/spinner_events.js +++ b/tests/unit/spinner/spinner_events.js @@ -131,100 +131,129 @@ asyncTest( "change", function() { }); } - element.focus(); - shouldChange( false, "key UP, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - shouldChange( true, "blur after key UP" ); - element.blur(); + function focusWrap( fn, next ) { + element[0].focus(); + setTimeout( function() { + fn(); + setTimeout(function() { + element[0].blur(); + setTimeout( next ); + }); + }); + } - element.focus(); - shouldChange( false, "key DOWN, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.DOWN ); - shouldChange( true, "blur after key DOWN" ); - element.blur(); + function step1() { + focusWrap(function() { + shouldChange( false, "key UP, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + shouldChange( true, "blur after key UP" ); + }, step2 ); + } - element.focus(); - shouldChange( false, "key PAGE_UP, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.PAGE_UP ); - shouldChange( true, "blur after key PAGE_UP" ); - element.blur(); + function step2() { + focusWrap(function() { + shouldChange( false, "key DOWN, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.DOWN ); + shouldChange( true, "blur after key DOWN" ); + }, step3 ); + } - element.focus(); - shouldChange( false, "key PAGE_DOWN, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.PAGE_DOWN ); - shouldChange( true, "blur after key PAGE_DOWN" ); - element.blur(); + function step3() { + focusWrap(function() { + shouldChange( false, "key PAGE_UP, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.PAGE_UP ); + shouldChange( true, "blur after key PAGE_UP" ); + }, step4 ); + } - shouldChange( false, "many keys, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.PAGE_DOWN ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - simulateKeyDownUp( element, $.ui.keyCode.DOWN ); - shouldChange( true, "blur after many keys" ); - element.blur(); + function step4() { + focusWrap(function() { + shouldChange( false, "key PAGE_DOWN, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.PAGE_DOWN ); + shouldChange( true, "blur after key PAGE_DOWN" ); + }, step5 ); + } - shouldChange( false, "many keys, same final value, before blur" ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - simulateKeyDownUp( element, $.ui.keyCode.UP ); - simulateKeyDownUp( element, $.ui.keyCode.DOWN ); - simulateKeyDownUp( element, $.ui.keyCode.DOWN ); - shouldChange( false, "blur after many keys, same final value" ); + function step5() { + focusWrap(function() { + shouldChange( false, "many keys, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.PAGE_DOWN ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + simulateKeyDownUp( element, $.ui.keyCode.DOWN ); + shouldChange( true, "blur after many keys" ); + }, step6 ); + } - shouldChange( false, "button up, before blur" ); - element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup(); - shouldChange( true, "blur after button up" ); - setTimeout(function() { - element.blur(); + function step6() { + focusWrap(function() { + shouldChange( false, "many keys, same final value, before blur" ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + simulateKeyDownUp( element, $.ui.keyCode.UP ); + simulateKeyDownUp( element, $.ui.keyCode.DOWN ); + simulateKeyDownUp( element, $.ui.keyCode.DOWN ); + shouldChange( false, "blur after many keys, same final value" ); - shouldChange( false, "button down, before blur" ); - element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup(); - shouldChange( true, "blur after button down" ); - setTimeout(function() { - element.blur(); + shouldChange( false, "button up, before blur" ); + element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup(); + shouldChange( true, "blur after button up" ); + }, step7 ); + } + function step7() { + focusWrap(function() { + shouldChange( false, "button down, before blur" ); + element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup(); + shouldChange( true, "blur after button down" ); + }, step8 ); + } + + function step8() { + focusWrap(function() { shouldChange( false, "many buttons, same final value, before blur" ); element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup(); element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup(); element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup(); element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup(); shouldChange( false, "blur after many buttons, same final value" ); - element.blur(); - setTimeout(function() { - shouldChange( true, "stepUp" ); - element.spinner( "stepUp" ); + }, step9 ); + } - shouldChange( true, "stepDown" ); - element.spinner( "stepDown" ); + function step9() { + shouldChange( true, "stepUp" ); + element.spinner( "stepUp" ); - shouldChange( true, "pageUp" ); - element.spinner( "pageUp" ); + shouldChange( true, "stepDown" ); + element.spinner( "stepDown" ); - shouldChange( true, "pageDown" ); - element.spinner( "pageDown" ); + shouldChange( true, "pageUp" ); + element.spinner( "pageUp" ); - shouldChange( true, "value" ); - element.spinner( "value", 999 ); + shouldChange( true, "pageDown" ); + element.spinner( "pageDown" ); - shouldChange( false, "value, same value" ); - element.spinner( "value", 999 ); + shouldChange( true, "value" ); + element.spinner( "value", 999 ); - shouldChange( true, "max, value changed" ); - element.spinner( "option", "max", 900 ); + shouldChange( false, "value, same value" ); + element.spinner( "value", 999 ); - shouldChange( false, "max, value not changed" ); - element.spinner( "option", "max", 1000 ); + shouldChange( true, "max, value changed" ); + element.spinner( "option", "max", 900 ); - shouldChange( true, "min, value changed" ); - element.spinner( "option", "min", 950 ); + shouldChange( false, "max, value not changed" ); + element.spinner( "option", "max", 1000 ); - shouldChange( false, "min, value not changed" ); - element.spinner( "option", "min", 200 ); - shouldChange( true, "cleanup" ); - start(); - }); - }); - }); + shouldChange( true, "min, value changed" ); + element.spinner( "option", "min", 950 ); + + shouldChange( false, "min, value not changed" ); + element.spinner( "option", "min", 200 ); + start(); + } + + setTimeout( step1 ); }); })( jQuery ); diff --git a/tests/unit/tabs/tabs_core.js b/tests/unit/tabs/tabs_core.js index 20364a37d..5f70206dc 100644 --- a/tests/unit/tabs/tabs_core.js +++ b/tests/unit/tabs/tabs_core.js @@ -599,8 +599,8 @@ test( "#3627 - Ajax tab with url containing a fragment identifier fails to load" test( "#4033 - IE expands hash to full url and misinterprets tab as ajax", function() { expect( 2 ); - var element = $( "<div><ul><li><a href='#tab'>Tab</a></li></ul><div id='tab'></div></div>" ); - element.appendTo( "#main" ); + var element = $("<div><ul><li><a href='#tab'>Tab</a></li></ul><div id='tab'></div></div>"); + element.appendTo("#qunit-fixture"); element.tabs({ beforeLoad: function() { event.preventDefault(); @@ -608,7 +608,7 @@ test( "#4033 - IE expands hash to full url and misinterprets tab as ajax", funct } }); - equal( element.find( ".ui-tabs-nav li" ).attr( "aria-controls" ), "tab", "aria-contorls attribute is correct" ); + equal( element.find(".ui-tabs-nav li").attr("aria-controls"), "tab", "aria-contorls attribute is correct" ); state( element, 1 ); }); diff --git a/tests/unit/testsuite.js b/tests/unit/testsuite.js index 18337fe4e..42fdf4f9e 100644 --- a/tests/unit/testsuite.js +++ b/tests/unit/testsuite.js @@ -212,7 +212,7 @@ window.domEqual = function( selector, modifier, message ) { "tabIndex", "title" ]; -/* + function getElementStyles( elem ) { var key, len, style = elem.ownerDocument.defaultView ? @@ -239,7 +239,7 @@ window.domEqual = function( selector, modifier, message ) { return styles; } -*/ + function extract( elem ) { if ( !elem || !elem.length ) { QUnit.push( false, actual, expected, @@ -257,8 +257,7 @@ window.domEqual = function( selector, modifier, message ) { var value = elem.attr( attr ); result[ attrĀ ] = value !== undefined ? value : ""; }); - // TODO: Enable when we can figure out what's happening with accordion - //result.style = getElementStyles( elem[ 0 ] ); + result.style = getElementStyles( elem[ 0 ] ); result.events = $._data( elem[ 0 ], "events" ); result.data = $.extend( {}, elem.data() ); delete result.data[ $.expando ]; diff --git a/tests/unit/widget/widget_core.js b/tests/unit/widget/widget_core.js index 18b93d92e..8102b1f4f 100644 --- a/tests/unit/widget/widget_core.js +++ b/tests/unit/widget/widget_core.js @@ -13,18 +13,23 @@ TestHelpers.testJshint( "widget" ); test( "widget creation", function() { expect( 5 ); - var myPrototype = { - _create: function() {}, - creationTest: function() {} - }; + var method, + myPrototype = { + _create: function() { + equal( method, "_create", "create function is copied over" ); + }, + creationTest: function() { + equal( method, "creationTest", "random function is copied over" ); + } + }; $.widget( "ui.testWidget", myPrototype ); ok( $.isFunction( $.ui.testWidget ), "constructor was created" ); - equal( "object", typeof $.ui.testWidget.prototype, "prototype was created" ); - equal( $.ui.testWidget.prototype._create, myPrototype._create, - "create function is copied over" ); - equal( $.ui.testWidget.prototype.creationTest, myPrototype.creationTest, - "random function is copied over" ); + equal( typeof $.ui.testWidget.prototype, "object", "prototype was created" ); + method = "_create"; + $.ui.testWidget.prototype._create(); + method = "creationTest"; + $.ui.testWidget.prototype.creationTest(); equal( $.ui.testWidget.prototype.option, $.Widget.prototype.option, "option method copied over from base widget" ); }); @@ -1324,6 +1329,34 @@ test( "redefine - widgetEventPrefix", function() { }); +test( "mixins", function() { + expect( 2 ); + + var mixin = { + method: function() { + return "mixed " + this._super(); + } + }; + + $.widget( "ui.testWidget1", { + method: function() { + return "testWidget1"; + } + }); + $.widget( "ui.testWidget2", { + method: function() { + return "testWidget2"; + } + }); + $.widget( "ui.testWidget1", $.ui.testWidget1, mixin ); + $.widget( "ui.testWidget2", $.ui.testWidget2, mixin ); + + equal( $( "<div>" ).testWidget1().testWidget1( "method" ), + "mixed testWidget1", "testWidget1 mixin successful" ); + equal( $( "<div>" ).testWidget2().testWidget2( "method" ), + "mixed testWidget2", "testWidget2 mixin successful" ); +}); + asyncTest( "_delay", function() { expect( 6 ); var order = 0, diff --git a/tests/visual/dialog/complex-dialogs.html b/tests/visual/dialog/complex-dialogs.html index 5cd9271ae..9cc2d1416 100644 --- a/tests/visual/dialog/complex-dialogs.html +++ b/tests/visual/dialog/complex-dialogs.html @@ -20,6 +20,11 @@ <script src="../../../ui/jquery.ui.autocomplete.js"></script> <script src="../../../ui/jquery.ui.tooltip.js"></script> + <style> + body { + font-size: 62.5%; + } + </style> <script> $(function() { var dialog = $( "#dialog" ).dialog({ @@ -98,7 +103,7 @@ <button id="open-dialog">Reopen dialog</button> -<div id="dialog" title="Basic dialog"> +<div id="dialog" title="Basic dialog, but with a really long title that doesn't quite fit."> <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> <p><button id="open-datepicker">Open another window with a datepicker.</button></p> <p><button id="destroy-dialog">Self destruct</button></p> |