diff --git a/AUTHORS.txt b/AUTHORS.txt index 1521874ce45..bf1554481da 100644 --- a/AUTHORS.txt +++ b/AUTHORS.txt @@ -282,3 +282,15 @@ Will Holley Uri Gilad Richard Gibson Simen Bekkhus +Chen Eshchar +Bruno Pérel +Mohammed Alshehri +Anne-Gaelle Colom +Adam Foster +Luke Page +Marcus Warren +Patricia Juarez +Ben Mosher +Ablay Keldibek +Nils Heuermann +Marco Ziech diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 5d694c99cfc..8c1ceb034ae 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -16,68 +16,83 @@ This is the best way to contribute to jQuery UI. Please read through the full gu Every week (unless otherwise noted) the jQuery UI team has a meeting to discuss the progress of current work and to bring forward possible new blockers for discussion. The meeting is held on [IRC](http://irc.jquery.org) in the #jquery-meeting channel at [Noon EST](http://www.timeanddate.com/worldclock/fixedtime.html?month=1&day=17&year=2011&hour=12&min=0&sec=0&p1=43) on Wednesdays. Meeting notes are posted on http://meetings.jquery.org/category/ui/ after each meeting. -## Tips For Bug Patching +## Tips for Getting Started -### Environment: localhost w/ PHP, Node.js & Grunt +### Environment: Minimum Required -jQuery UI uses Node.js & Grunt to automate the building and validation of source code. +If you are contributing changes you will need a fork of jquery-ui (see [Getting the Source](#environment-getting-the-source)). If you just want the source code you could clone jquery-ui directly: -Some tests depend on PHP running locally, so make sure you have the following installed: - -* A web server with PHP support (any will do, such as [XAMPP](http://www.apachefriends.org/en/xampp.html) or [MAMP](http://www.mamp.info/en/index.html)) -* [Node.js](http://nodejs.org/) (includes NPM, necessary for the next step) -* Grunt (install with: `npm install -g grunt`) +```bash +git clone git://github.com/jquery/jquery-ui.git +cd jquery-ui +``` -### Build a Local Copy of jQuery UI +The tests can run in any local web server. Ideally you should test your patch in appropriate web browsers and if possible run `grunt` to lint the code and run automated tests (this will happen automatically when you create a pull request). See the [Recommended Setup](#environment-recommended-setup) for setting up Node.js so that the grunt command works. -Create a fork of the jQuery UI repo on GitHub at http://github.com/jquery/jquery-ui. +### Environment: Getting the Source -Change directory to your web root directory, whatever that might be: +* Create a fork of the jQuery UI repo on GitHub at http://github.com/jquery/jquery-ui. This will create a fork of jquery-ui in your Github account. +* You may want to clone jquery-ui under the path to your web server. If so, change to the required directory ```bash -$ cd /path/to/your/www/root/ +cd /path/to/your/www/root/ ``` -Clone your jQuery UI fork to work locally. - -*Note: be sure to replace `[USERNAME]` with your GitHub username.* +* Clone your jQuery UI git repo. ```bash -$ git clone git@github.com:[USERNAME]/jquery-ui.git +git clone git://github.com/[USERNAME]/jquery-ui.git +cd jquery-ui ``` -Change to the newly created directory. +*Note: be sure to replace `[USERNAME]` with your GitHub username.* + +* Add the official jQuery repository as a remote. We recommend naming it "upstream". ```bash -$ cd jquery-ui +git remote add upstream git://github.com/jquery/jquery-ui.git ``` -Add the official jQuery repository as a remote. We recommend naming it "upstream". +* Get in the habit of pulling in the "upstream" master to stay up to date as jQuery UI receives new commits. ```bash -$ git remote add upstream git://github.com/jquery/jquery-ui.git +git pull upstream master ``` -Get in the habit of pulling in the "upstream" master to stay up to date as jQuery UI receives new commits. +### Environment: Recommended Setup + +jQuery UI uses Node.js & Grunt to automate the building and validation of source code. Here is how to set that up: + +* Get [Node.js](http://nodejs.org/) (includes NPM, necessary for the next step) +* Install Grunt cli: ```bash -$ git pull upstream master +npm install -g grunt-cli ``` -Install the dependencies. +* Install local Node.js modules ```bash npm install ``` +The tests require a local web server and the samples contain some PHP, so a PHP web server may be useful. + +* Install a web server. Here are some you could use: + * Windows: [WAMP download](http://www.wampserver.com/en/) + * Mac: [MAMP download](http://www.mamp.info/en/index.html) + * Linux: [Setting up LAMP](https://www.linux.com/learn/tutorials/288158-easy-lamp-server-installation) + * [Mongoose (most platforms)](http://code.google.com/p/mongoose/) + * [http-server](https://www.npmjs.com/package/http-server) + +### Running the Tests + To lint the JavaScript, HTML, and CSS, as well as run a smoke test in PhantomJS, run grunt: ```bash -$ grunt +grunt ``` To run the tests for a specific plugin in your browser, open the appropriate file from the `/tests/unit/` directory, for example: `http://localhost/tests/unit/accordion/accordion.html`. The domain will be dependent on your local server configuration; if there is a port, be sure to include it. Ideally you would test in all of our [supported browsers](http://jqueryui.com/browser-support/), but if you don't have all of these browsers available, that's ok. - -Make sure to read our [commits and pull requests documentation](http://dev.contribute.jquery.org/commits-and-pull-requests/) for full details on working with branches and forks, as well as our commit guidelines. diff --git a/Gruntfile.js b/Gruntfile.js index 72236561f59..d951d2d1204 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -119,7 +119,7 @@ function createBanner( files ) { "<%= grunt.template.today('isoDate') %>\n" + "<%= pkg.homepage ? '* ' + pkg.homepage + '\\n' : '' %>" + (files ? "* Includes: " + fileNames.join(", ") + "\n" : "") + - "* Copyright <%= grunt.template.today('yyyy') %> <%= pkg.author.name %>;" + + "* Copyright <%= pkg.author.name %>;" + " Licensed <%= _.pluck(pkg.licenses, 'type').join(', ') %> */\n"; } diff --git a/LICENSE.txt b/LICENSE.txt index 156f8d5caaf..4819e54213f 100644 --- a/LICENSE.txt +++ b/LICENSE.txt @@ -1,5 +1,4 @@ -Copyright 2007, 2014 jQuery Foundation and other contributors, -https://jquery.org/ +Copyright jQuery Foundation and other contributors, https://jquery.org/ This software consists of voluntary contributions made by many individuals. For exact contribution history, see the revision history diff --git a/README.md b/README.md index edd49ab7baa..998a3f24be1 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ If you are interested in helping develop jQuery UI, you are in the right place. To discuss development with team members and the community, visit the [Developing jQuery UI Forum](http://forum.jquery.com/developing-jquery-ui) or [#jqueryui-dev on irc.freenode.net](http://irc.jquery.org/). -## For contributors +## For Contributors If you want to help and provide a patch for a bugfix or new feature, please take a few minutes and look at [our Getting Involved guide](http://wiki.jqueryui.com/w/page/35263114/Getting-Involved). @@ -21,35 +21,21 @@ In general, fork the project, create a branch for a specific change and send a pull request for that branch. Don't mix unrelated changes. You can use the commit message as the description for the pull request. +For more information, see the [contributing page](CONTRIBUTING.md). ## Running the Unit Tests -Run the unit tests with a local server that supports PHP. No database is required. Pre-configured php local servers are available for Windows and Mac. Here are some options: - -- Windows: [WAMP download](http://www.wampserver.com/en/) -- Mac: [MAMP download](http://www.mamp.info/en/index.html) -- Linux: [Setting up LAMP](https://www.linux.com/learn/tutorials/288158-easy-lamp-server-installation) -- [Mongoose (most platforms)](http://code.google.com/p/mongoose/) +Run the unit tests manually with appropriate browsers and any local web server. See our [environment setup](CONTRIBUTING.md#environment-minimum-required) and [information on running tests](CONTRIBUTING.md#running-the-tests). +You can also run the unit tests inside phantomjs by [setting up your environment](CONTRIBUTING.md#user-content-environment-recommended-setup). ## Building jQuery UI -jQuery UI uses the [Grunt](http://github.com/gruntjs/grunt) build system. +jQuery UI uses the [Grunt](http://gruntjs.com/) build system. -To build jQuery UI, you must have [node.js](http://nodejs.org/) installed and then run the following commands: +To build jQuery UI, [setup your environment]([setting up your environment](CONTRIBUTING.md#environment-minimum-required)) and then run the following commands: ```sh - -# Install the Grunt CLI -npm install -g grunt-cli - -# Clone the jQuery UI git repo -git clone git://github.com/jquery/jquery-ui.git -cd jquery-ui - -# Install the node module dependencies -npm install - # Run the concat task to concatenate files grunt concat diff --git a/build/tasks/testswarm.js b/build/tasks/testswarm.js index aa1c52abc53..a23214e6d7d 100644 --- a/build/tasks/testswarm.js +++ b/build/tasks/testswarm.js @@ -61,7 +61,7 @@ function submit( commit, runs, configFile, extra, done ) { name: "Commit " + commit.substr( 0, 10 ) + "" + extra, runs: runs, runMax: config.runMax, - browserSets: [ "popular-ui" ], + browserSets: config.browserSets, timeout: 1000 * 60 * 30 }, function( error, passed ) { if ( error ) { diff --git a/demos/autocomplete/search.php b/demos/autocomplete/search.php index 835772deea8..04bda422423 100644 --- a/demos/autocomplete/search.php +++ b/demos/autocomplete/search.php @@ -368,7 +368,6 @@ "Glossy Ibis"=>"Plegadis falcinellus", "Spanish Imperial Eagle"=>"Aquila adalberti", "Lesser Kestrel"=>"Falco naumanni", -"Houbara Bustard"=>"Chlamydotis undulata", "Crab-Plover"=>"Dromas ardeola", "Cream-coloured Courser"=>"Cursorius cursor", "Collared Pratincole"=>"Glareola pratincola", diff --git a/demos/effect/easing.html b/demos/effect/easing.html index aa5bccbc6f5..c70786d7309 100644 --- a/demos/effect/easing.html +++ b/demos/effect/easing.html @@ -96,7 +96,7 @@
-

All easings provided by jQuery UI are drawn above, using a HTML canvas element. Click a diagram to see the easing in action.

+

All easings provided by jQuery UI are drawn above, using an HTML canvas element. Click a diagram to see the easing in action.

diff --git a/demos/sortable/empty-lists.html b/demos/sortable/empty-lists.html index 6d8f6565b2d..1925446195a 100644 --- a/demos/sortable/empty-lists.html +++ b/demos/sortable/empty-lists.html @@ -11,7 +11,7 @@ - diff --git a/tests/unit/draggable/draggable_options.js b/tests/unit/draggable/draggable_options.js index e54ae1df46d..d8bbedc9163 100644 --- a/tests/unit/draggable/draggable_options.js +++ b/tests/unit/draggable/draggable_options.js @@ -405,6 +405,29 @@ test( "connectToSortable, dragging through one sortable to a second", function() element.simulate( "drag", dragParams ); }); +test( "connectToSortable, dragging through a sortable", function() { + expect( 1 ); + + var draggable = $( "#draggableSortable" ).draggable({ + scroll: false, + connectToSortable: "#sortable2" + }), + sortable = $( "#sortable2" ).sortable(), + sortableOffset = sortable.offset(); + + // http://bugs.jqueryui.com/ticket/10669 + // Draggable: Position issue with connectToSortable + draggable.one( "dragstop", function() { + equal( draggable.parent().attr( "id" ), "sortable", "restored draggable to original parent" ); + }); + + draggable.simulate( "drag", { + x: sortableOffset.left + 25, + y: sortableOffset.top + sortable.outerHeight() + 400, + moves: 20 + }); +}); + test( "{ containment: Element }", function() { expect( 1 ); diff --git a/tests/unit/index.html b/tests/unit/index.html index bd48590ec37..418cfd34cc6 100644 --- a/tests/unit/index.html +++ b/tests/unit/index.html @@ -7,7 +7,7 @@ - + diff --git a/tests/unit/position/position.html b/tests/unit/position/position.html index 0cad7d322a7..334fbbb7826 100644 --- a/tests/unit/position/position.html +++ b/tests/unit/position/position.html @@ -47,6 +47,9 @@
+ +
+
diff --git a/tests/unit/position/position_core.js b/tests/unit/position/position_core.js index 5b1872af983..7176e37e147 100644 --- a/tests/unit/position/position_core.js +++ b/tests/unit/position/position_core.js @@ -726,4 +726,41 @@ test( "bug #5280: consistent results (avoid fractional values)", function() { deepEqual( offset1, offset2 ); }); +test( "bug #8710: flip if flipped position fits more", function() { + expect( 3 ); + + // Positions a 10px tall element within 99px height at top 90px. + collisionTest({ + within: "#bug-8710-within-smaller", + of: "#parentx", + collision: "flip", + at: "right bottom+30" + }, { + top: 0, + left: 60 + }, "flip - top fits all" ); + + // Positions a 10px tall element within 99px height at top 92px. + collisionTest({ + within: "#bug-8710-within-smaller", + of: "#parentx", + collision: "flip", + at: "right bottom+32" + }, { + top: -2, + left: 60 + }, "flip - top fits more" ); + + // Positions a 10px tall element within 101px height at top 92px. + collisionTest({ + within: "#bug-8710-within-bigger", + of: "#parentx", + collision: "flip", + at: "right bottom+32" + }, { + top: 92, + left: 60 + }, "no flip - top fits less" ); +}); + }( jQuery ) ); diff --git a/tests/unit/resizable/resizable.html b/tests/unit/resizable/resizable.html index 5668c909a22..a44346e7cba 100644 --- a/tests/unit/resizable/resizable.html +++ b/tests/unit/resizable/resizable.html @@ -69,6 +69,7 @@
I'm a resizable.
+
diff --git a/tests/unit/resizable/resizable_options.js b/tests/unit/resizable/resizable_options.js index c46801bc54d..7fd409cecb2 100644 --- a/tests/unit/resizable/resizable_options.js +++ b/tests/unit/resizable/resizable_options.js @@ -237,7 +237,7 @@ test( "containment - immediate parent", function() { test("grid", function() { expect(4); - var handle = ".ui-resizable-se", target = $("#resizable1").resizable({ handles: "all", grid: [0, 20] }); + var handle = ".ui-resizable-se", target = $("#resizable1").resizable({ handles: "all", grid: [ 0, 20 ] }); TestHelpers.resizable.drag(handle, 3, 9); equal( target.width(), 103, "compare width"); @@ -265,7 +265,7 @@ test("grid (min/max dimensions)", function() { test("grid (wrapped)", function() { expect(4); - var handle = ".ui-resizable-se", target = $("#resizable2").resizable({ handles: "all", grid: [0, 20] }); + var handle = ".ui-resizable-se", target = $("#resizable2").resizable({ handles: "all", grid: [ 0, 20 ] }); TestHelpers.resizable.drag(handle, 3, 9); equal( target.width(), 103, "compare width"); @@ -311,12 +311,12 @@ test( "grid - maintains grid with padding and border when approaching no dimensi height: 80 }).resizable({ handles: "all", - grid: 50 + grid: [ 50, 12 ] }); TestHelpers.resizable.drag( handle, 50, 50 ); equal( target.outerWidth(), 50, "compare width" ); - equal( target.outerHeight(), 50, "compare height" ); + equal( target.outerHeight(), 52, "compare height" ); }); test("ui-resizable-se { handles: 'all', minWidth: 60, minHeight: 60, maxWidth: 100, maxHeight: 100 }", function() { @@ -375,6 +375,35 @@ test("ui-resizable-nw { handles: 'all', minWidth: 60, minHeight: 60, maxWidth: 1 equal( target.height(), 100, "compare maxHeight" ); }); + +test( "custom handles { handles: { 's': $('#resizer1'), containment: 'parent' }", function () { + expect( 2 ); + + var handle = "#resizer1", + target = $( "#resizable1" ).resizable({ handles: { "s": $( "#resizer1" ) }, containment: "parent" }); + + TestHelpers.resizable.drag( handle, 0, 70 ); + equal( target.height(), 170, "compare height" ); + + TestHelpers.resizable.drag( handle, 0, -70 ); + equal( target.height(), 100, "compare height" ); +}); + + +test( "custom handles { handles: { 's': $('#resizer1')[0], containment: 'parent' }", function () { + expect( 2 ); + + var handle = "#resizer1", + target = $( "#resizable1" ).resizable({ handles: { "s": $( "#resizer1" )[ 0 ] }, containment: "parent" }); + + TestHelpers.resizable.drag( handle, 0, 70 ); + equal( target.height(), 170, "compare height" ); + + TestHelpers.resizable.drag( handle, 0, -70 ); + equal( target.height(), 100, "compare height" ); +}); + + test("zIndex, applied to all handles", function() { expect(8); @@ -404,4 +433,34 @@ test( "alsoResize + containment", function() { equal( other.height(), 150, "alsoResize constrained height at containment edge" ); }); +test( "alsoResize + multiple selection", function() { + expect( 6 ); + var other1 = $( "
" ) + .addClass( "other" ) + .css({ + width: 50, + height: 50 + }) + .appendTo( "body" ), + other2 = $( "
" ) + .addClass( "other" ) + .css({ + width: 50, + height: 50 + }) + .appendTo( "body"), + element = $( "#resizable1" ).resizable({ + alsoResize: other1.add( other2 ), + 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( other1.width(), 250, "alsoResize o1 constrained width at containment edge" ); + equal( other1.height(), 150, "alsoResize o1 constrained height at containment edge" ); + equal( other2.width(), 250, "alsoResize o2 constrained width at containment edge" ); + equal( other2.height(), 150, "alsoResize o2 constrained height at containment edge" ); +}); + })(jQuery); diff --git a/tests/unit/slider/slider_methods.js b/tests/unit/slider/slider_methods.js index c5c7e1254aa..ce26620e221 100644 --- a/tests/unit/slider/slider_methods.js +++ b/tests/unit/slider/slider_methods.js @@ -62,7 +62,7 @@ test( "disable", function() { }); test( "value", function() { - expect( 17 ); + expect( 18 ); $( [ false, "min", "max" ] ).each(function() { var element = $( "
" ).slider({ range: this, @@ -88,6 +88,16 @@ test( "value", function() { equal( element.slider( "value" ), 1, "value method get respects max" ); equal( element.slider( "value", 2 ), element, "value method is chainable" ); equal( element.slider( "option", "value" ), 1, "value method set respects max" ); + + // set max value with step 0.01 + element.slider( "option", { + min: 2, + value: 2, + max: 2.4, + step: 0.01 + }); + element.slider( "option", "value", 2.4 ); + equal( element.slider( "value" ), 2.4, "value is set to max with 0.01 step" ); }); //test( "values", function() { diff --git a/tests/unit/slider/slider_options.js b/tests/unit/slider/slider_options.js index defb6f3b0fb..2badcc566f9 100644 --- a/tests/unit/slider/slider_options.js +++ b/tests/unit/slider/slider_options.js @@ -40,7 +40,7 @@ test( "disabled", function(){ }); test( "max", function() { - expect( 4 ); + expect( 5 ); element = $( "
" ); options = { @@ -72,6 +72,18 @@ test( "max", function() { ok( element.slider( "value" ) === options.max, "value method will max, step is changed" ); element.slider( "destroy" ); + options = { + max: 60, + min: 50, + orientation: "horizontal", + step: 0.1, + value: 60 + }; + + element.slider( options ); + ok( element.slider( "value" ) === options.max, "value method will max, step is changed and step is float" ); + element.slider( "destroy" ); + }); test( "min", function() { diff --git a/tests/unit/sortable/sortable.html b/tests/unit/sortable/sortable.html index 3edc999b76e..f13b895b8db 100644 --- a/tests/unit/sortable/sortable.html +++ b/tests/unit/sortable/sortable.html @@ -74,20 +74,56 @@ - - + + - - + + - - + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
121.11.2
341.31.4
561.51.6
781.71.8
2.12.2
2.32.4
2.52.6
2.72.8
3.13.2
3.33.4
3.53.6
3.73.8
diff --git a/tests/unit/sortable/sortable_methods.js b/tests/unit/sortable/sortable_methods.js index f3fe240e701..9c0a86a359b 100644 --- a/tests/unit/sortable/sortable_methods.js +++ b/tests/unit/sortable/sortable_methods.js @@ -90,4 +90,39 @@ test( "disable", function() { equal( chainable, element, "disable is chainable" ); }); +test( "refresh() should update the positions of initially empty lists (see #7498)", function() { + expect( 1 ); + + var changeCount = 0, + element = $( "#qunit-fixture" ).html( "
    " ).find( "ul" ); + + element + .css({ + "float": "left", + width: "100px" + }) + .sortable({ + change: function() { + changeCount++; + } + }) + .append( "
  • a
  • a
    • " ) + .find( "li" ) + .css({ + "float": "left", + width: "50px", + height: "50px" + }); + + element.sortable( "refresh" ); + + // Switch the order of the two li elements + element.find( "li" ).eq( 0 ).simulate( "drag", { + dx: 55, + moves: 15 + }); + + equal( changeCount, 1 ); +}); + })(jQuery); diff --git a/tests/unit/sortable/sortable_options.js b/tests/unit/sortable/sortable_options.js index f2beb4dbcd6..90cf765a2b5 100644 --- a/tests/unit/sortable/sortable_options.js +++ b/tests/unit/sortable/sortable_options.js @@ -388,6 +388,42 @@ test( "{ placholder: String } tr", function() { }); }); +test( "{ placholder: String } tbody", function() { + expect( 6 ); + + var originalWidths, + element = $( "#sortable-table" ).sortable({ + placeholder: "test", + start: function( event, ui ) { + var currentWidths = otherBody.children().map(function() { + return $( this ).width(); + }).get(); + ok( ui.placeholder.hasClass( "test" ), "placeholder has class" ); + deepEqual( currentWidths, originalWidths, "table cells maintain size" ); + equal( ui.placeholder.children().length, 1, + "placeholder has one child" ); + equal( ui.placeholder.children( "tr" ).length, 1, + "placeholder's child is tr" ); + equal( ui.placeholder.find( "> tr" ).children().length, + dragBody.find( "> tr:first" ).children().length, + "placeholder's tr has correct number of cells" ); + equal( ui.placeholder.find( "> tr" ).children().html(), + $( " " ).html(), + "placeholder td has content for forced dimensions" ); + } + }), + bodies = element.children( "tbody" ), + dragBody = bodies.eq( 0 ), + otherBody = bodies.eq( 1 ); + + originalWidths = otherBody.children().map(function() { + return $( this ).width(); + }).get(); + dragBody.simulate( "drag", { + dy: 1 + }); +}); + /* test("{ revert: false }, default", function() { ok(false, "missing test - untested code is broken code."); diff --git a/tests/unit/tabs/tabs_core.js b/tests/unit/tabs/tabs_core.js index 2e094e11b0a..2d18a6f1ab7 100644 --- a/tests/unit/tabs/tabs_core.js +++ b/tests/unit/tabs/tabs_core.js @@ -299,197 +299,224 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", setTimeout( step1, 1 ); }); -asyncTest( "keyboard support - CTRL navigation", function() { - expect( 115 ); - var element = $( "#tabs1" ).tabs(), - tabs = element.find( ".ui-tabs-nav li" ), - panels = element.find( ".ui-tabs-panel" ), - keyCode = $.ui.keyCode; - - element.tabs( "instance" ).delay = 50; - - equal( tabs.filter( ".ui-state-focus" ).length, 0, "no tabs focused on init" ); - tabs.eq( 0 ).simulate( "focus" ); - - // down - function step1() { - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - - tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.DOWN, ctrlKey: true } ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" ); - ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" ); - equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); - equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); - equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - setTimeout( step2, 100 ); - } - - // right - function step2() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - ok( panels.eq( 1 ).is( ":hidden" ), "second panel is hidden" ); - equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); - equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); - - tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.RIGHT, ctrlKey: true } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" ); - equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - setTimeout( step3, 100 ); - } - - // down (wrap) - function step3() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); - - tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.DOWN, ctrlKey: true } ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - setTimeout( step4, 100 ); - } - - // up (wrap) - function step4() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.UP, ctrlKey: true } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" ); - equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - setTimeout( step5, 100 ); - } - - // left - function step5() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); - - tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.LEFT, ctrlKey: true } ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" ); - equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); - equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); - equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - - setTimeout( step6, 100 ); - } - - // home - function step6() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - ok( panels.eq( 1 ).is( ":hidden" ), "second panel is hidden" ); - equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); - equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); - - tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.HOME, ctrlKey: true } ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); - ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); - equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); - equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); +// Navigation with CTRL and COMMAND (both behave the same) +$.each({ + ctrl: "CTRL", + meta: "COMMAND" +}, function( modifier, label ) { + asyncTest( "keyboard support - " + label + " navigation", function() { + expect( 115 ); + var element = $( "#tabs1" ).tabs(), + tabs = element.find( ".ui-tabs-nav li" ), + panels = element.find( ".ui-tabs-panel" ), + keyCode = $.ui.keyCode; + + element.tabs( "instance" ).delay = 50; + + equal( tabs.filter( ".ui-state-focus" ).length, 0, "no tabs focused on init" ); + tabs.eq( 0 ).simulate( "focus" ); + + // down + function step1() { + var eventProperties = { keyCode: keyCode.DOWN }; + eventProperties[ modifier + "Key" ] = true; + + ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + + tabs.eq( 0 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" ); + ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" ); + equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); + equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); + equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step2, 100 ); + } - setTimeout( step7, 100 ); - } + // right + function step2() { + var eventProperties = { keyCode: keyCode.RIGHT }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + ok( panels.eq( 1 ).is( ":hidden" ), "second panel is hidden" ); + equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); + equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); + + tabs.eq( 1 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" ); + equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step3, 100 ); + } - // end - function step7() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + // down (wrap) + function step3() { + var eventProperties = { keyCode: keyCode.DOWN }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + + tabs.eq( 2 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step4, 100 ); + } - tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.END, ctrlKey: true } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" ); - equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + // up (wrap) + function step4() { + var eventProperties = { keyCode: keyCode.UP }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + tabs.eq( 0 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" ); + equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step5, 100 ); + } - setTimeout( step8, 100 ); - } + // left + function step5() { + var eventProperties = { keyCode: keyCode.LEFT }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + + tabs.eq( 2 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" ); + equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); + equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); + equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step6, 100 ); + } - // space - function step8() { - equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); - ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); - ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + // home + function step6() { + var eventProperties = { keyCode: keyCode.HOME }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + ok( panels.eq( 1 ).is( ":hidden" ), "second panel is hidden" ); + equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); + equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); + + tabs.eq( 1 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); + ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); + equal( tabs.eq( 1 ).attr( "aria-expanded" ), "false", "second tab has aria-expanded=false" ); + equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step7, 100 ); + } - tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.SPACE } ); - equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); - equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" ); - ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" ); - equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" ); - equal( panels.eq( 2 ).attr( "aria-hidden" ), "false", "third panel has aria-hidden=false" ); - ok( panels.eq( 0 ).is( ":hidden" ), "first panel is hidden" ); - equal( tabs.eq( 0 ).attr( "aria-expanded" ), "false", "first tab has aria-expanded=false" ); - equal( panels.eq( 0 ).attr( "aria-hidden" ), "true", "first panel has aria-hidden=true" ); + // end + function step7() { + var eventProperties = { keyCode: keyCode.END }; + eventProperties[ modifier + "Key" ] = true; + + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + tabs.eq( 0 ).simulate( "keydown", eventProperties ); + ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" ); + equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + + setTimeout( step8, 100 ); + } - setTimeout( start, 1 ); - } + // space + function step8() { + equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); + ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); + ok( panels.eq( 2 ).is( ":hidden" ), "third panel is hidden" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "false", "third tab has aria-expanded=false" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); + + tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.SPACE } ); + equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); + equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" ); + ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" ); + equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" ); + equal( panels.eq( 2 ).attr( "aria-hidden" ), "false", "third panel has aria-hidden=false" ); + ok( panels.eq( 0 ).is( ":hidden" ), "first panel is hidden" ); + equal( tabs.eq( 0 ).attr( "aria-expanded" ), "false", "first tab has aria-expanded=false" ); + equal( panels.eq( 0 ).attr( "aria-hidden" ), "true", "first panel has aria-hidden=true" ); + + setTimeout( start, 1 ); + } - setTimeout( step1, 1 ); + setTimeout( step1, 1 ); + }); }); asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() { diff --git a/tests/unit/testsuite.js b/tests/unit/testsuite.js index 18353c702df..1c0f1785916 100644 --- a/tests/unit/testsuite.js +++ b/tests/unit/testsuite.js @@ -64,7 +64,7 @@ QUnit.config.urlConfig.push({ id: "jquery", label: "jQuery version", value: [ - "1.6", "1.6.1", "1.6.2", "1.6.3", "1.6.4", "1.7", "1.7.1", "1.7.2", + "1.6.0", "1.6.1", "1.6.2", "1.6.3", "1.6.4", "1.7.0", "1.7.1", "1.7.2", "1.8.0", "1.8.1", "1.8.2", "1.8.3", "1.9.0", "1.9.1", "1.10.0", "1.10.1", "1.10.2", "2.0.0", "2.0.1", "2.0.2", "2.0.3", "git" ], diff --git a/tests/unit/tooltip/tooltip_options.js b/tests/unit/tooltip/tooltip_options.js index 17f0a423775..a07f65199ab 100644 --- a/tests/unit/tooltip/tooltip_options.js +++ b/tests/unit/tooltip/tooltip_options.js @@ -71,6 +71,28 @@ asyncTest( "content: sync + async callback", function() { }).tooltip( "open" ); }); +// http://bugs.jqueryui.com/ticket/8740 +asyncTest( "content: async callback loses focus before load", function() { + expect( 1 ); + + var element = $( "#tooltipped1" ).tooltip({ + content: function( response ) { + setTimeout(function() { + element.trigger( "mouseleave" ); + setTimeout(function() { + response( "sometext" ); + setTimeout(function() { + ok( !$( "#" + element.data( "ui-tooltip-id" ) ).is( ":visible" ), + "Tooltip should not display" ); + start(); + }); + }); + }); + } + }); + element.trigger( "mouseover" ); +}); + test( "content: change while open", function() { expect( 2 ) ; var element = $( "#tooltipped1" ).tooltip({ diff --git a/tests/unit/widget/widget_core.js b/tests/unit/widget/widget_core.js index feafca9428c..2b88e39ef22 100644 --- a/tests/unit/widget/widget_core.js +++ b/tests/unit/widget/widget_core.js @@ -50,21 +50,21 @@ test( "element normalization", function() { $.ui.testWidget.prototype.defaultElement = ""; $.ui.testWidget.prototype._create = function() { ok( this.element.is( "span[data-test=pass]" ), "generated span with properties" ); - deepEqual( this.element.testWidget( "instance" ), this, "instace stored in .data()" ); + deepEqual( this.element.testWidget( "instance" ), this, "instance stored in .data()" ); }; $.ui.testWidget(); elem = $( "" ); $.ui.testWidget.prototype._create = function() { deepEqual( this.element[ 0 ], elem[ 0 ], "from element" ); - deepEqual( elem.testWidget( "instance" ), this, "instace stored in .data()" ); + deepEqual( elem.testWidget( "instance" ), this, "instance stored in .data()" ); }; $.ui.testWidget( {}, elem[ 0 ] ); elem = $( "
    " ); $.ui.testWidget.prototype._create = function() { deepEqual( this.element[ 0 ], elem[ 0 ], "from jQuery object" ); - deepEqual( elem.testWidget( "instance" ), this, "instace stored in .data()" ); + deepEqual( elem.testWidget( "instance" ), this, "instance stored in .data()" ); }; $.ui.testWidget( {}, elem ); @@ -72,7 +72,7 @@ test( "element normalization", function() { .appendTo( "#qunit-fixture" ); $.ui.testWidget.prototype._create = function() { deepEqual( this.element[ 0 ], elem[ 0 ], "from selector" ); - deepEqual( elem.testWidget( "instance" ), this, "instace stored in .data()" ); + deepEqual( elem.testWidget( "instance" ), this, "instance stored in .data()" ); }; $.ui.testWidget( {}, "#element-normalization-selector" ); diff --git a/tests/visual/compound/datepicker_dialog.html b/tests/visual/compound/datepicker_dialog.html index e6a25a2e8df..52c91a0835b 100644 --- a/tests/visual/compound/datepicker_dialog.html +++ b/tests/visual/compound/datepicker_dialog.html @@ -12,6 +12,7 @@ +