diff --git a/.jscs.json b/.jscs.json new file mode 100644 index 000000000..6540c8f39 --- /dev/null +++ b/.jscs.json @@ -0,0 +1,23 @@ +{ + "requireCurlyBraces": [ "if", "else", "for", "while", "do" ], + "requireSpaceAfterKeywords": [ "if", "else", "for", "while", "do", "switch", "return" ], + "requireSpacesInFunctionExpression": { + "beforeOpeningCurlyBrace": true + }, + "disallowSpacesInFunctionExpression": { + "beforeOpeningRoundBrace": true + }, + "requireMultipleVarDecl": true, + "requireSpacesInsideObjectBrackets": "all", + "requireSpacesInsideArrayBrackets": "all", + "disallowLeftStickedOperators": [ "?", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<=" ], + "disallowRightStickedOperators": [ "?", "/", "*", ":", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<="], + "requireRightStickedOperators": [ "!" ], + "requireLeftStickedOperators": [ "," ], + "disallowKeywords": [ "with" ], + "disallowMultipleLineBreaks": true, + "disallowKeywordsOnNewLine": [ "else" ], + "requireLineFeedAtFileEnd": true, + + "excludeFiles": [ "src/intro.js", "src/outro.js" ] +} diff --git a/Gruntfile.js b/Gruntfile.js index c6fcd3095..24b9632f0 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -106,6 +106,7 @@ grunt.loadNpmTasks( "grunt-contrib-uglify" ); grunt.loadNpmTasks( "grunt-contrib-concat" ); grunt.loadNpmTasks( "grunt-contrib-qunit" ); grunt.loadNpmTasks( "grunt-contrib-csslint" ); +grunt.loadNpmTasks( "grunt-jscs-checker" ); grunt.loadNpmTasks( "grunt-html" ); grunt.loadNpmTasks( "grunt-compare-size" ); grunt.loadNpmTasks( "grunt-git-authors" ); @@ -162,6 +163,13 @@ grunt.initConfig({ dest: "dist/jquery-ui.css" } }, + jscs: { + // datepicker, sortable, resizable and draggable are getting rewritten, ignore until that's done + ui: [ "ui/jquery.ui.*.js", "!ui/jquery.ui.datepicker.js", "!ui/jquery.ui.sortable.js", "!ui/jquery.ui.resizable.js", "!ui/jquery.ui.draggable.js" ], + // TODO enable this once we have a tool that can help with fixing formatting of existing files + // tests: "tests/unit/**/*.js", + grunt: "Gruntfile.js" + }, uglify: minify, htmllint: { // ignore files that contain invalid html, used only for ajax content testing @@ -198,7 +206,7 @@ grunt.initConfig({ }); grunt.registerTask( "default", [ "lint", "test" ] ); -grunt.registerTask( "lint", [ "asciilint", "jshint", "csslint", "htmllint" ] ); +grunt.registerTask( "lint", [ "asciilint", "jshint", "jscs", "csslint", "htmllint" ] ); grunt.registerTask( "test", [ "qunit" ] ); grunt.registerTask( "sizer", [ "concat:ui", "uglify:main", "compare_size:all" ] ); grunt.registerTask( "sizer_all", [ "concat:ui", "uglify", "compare_size" ] ); diff --git a/demos/autocomplete/categories.html b/demos/autocomplete/categories.html index e3c59ba13..3c436efbd 100644 --- a/demos/autocomplete/categories.html +++ b/demos/autocomplete/categories.html @@ -23,7 +23,7 @@ $.widget( "custom.catcomplete", $.ui.autocomplete, { _create: function() { this._super(); - this.menu.option( "items", "> :not(.ui-autocomplete-category)" ); + this.widget().menu( "option", "items", "> :not(.ui-autocomplete-category)" ); }, _renderMenu: function( ul, items ) { var that = this, diff --git a/package.json b/package.json index 02fbf7c5a..a802617b1 100644 --- a/package.json +++ b/package.json @@ -63,6 +63,7 @@ "grunt-contrib-qunit": "0.2.0", "grunt-contrib-csslint": "0.1.1", "grunt-compare-size": "0.4.0-rc.3", + "grunt-jscs-checker": "0.2.0", "grunt-html": "0.3.3", "grunt-git-authors": "1.2.0", "rimraf": "2.1.4", diff --git a/tests/unit/dialog/dialog.html b/tests/unit/dialog/dialog.html index 7943b425b..d8506a1bd 100644 --- a/tests/unit/dialog/dialog.html +++ b/tests/unit/dialog/dialog.html @@ -52,6 +52,8 @@
+ +
...
Please share some personal information diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js index e85759dc9..062d44576 100644 --- a/tests/unit/dialog/dialog_core.js +++ b/tests/unit/dialog/dialog_core.js @@ -40,7 +40,7 @@ test("widget method", function() { }); asyncTest( "focus tabbable", function() { - expect( 5 ); + expect( 6 ); var element, options = { buttons: [{ @@ -50,6 +50,12 @@ asyncTest( "focus tabbable", function() { }; function checkFocus( markup, options, testFn, next ) { + + // Support: IE8 + // For some reason the focus doesn't get set properly if we don't + // focus the body first. + $( "body" ).focus(); + element = $( markup ).dialog( options ); setTimeout(function() { testFn(); @@ -59,43 +65,57 @@ asyncTest( "focus tabbable", function() { } function step1() { - checkFocus( "
", options, function() { - equal( document.activeElement, element.find( "input" )[ 1 ], - "1. first element inside the dialog matching [autofocus]" ); - }, step2 ); + element = $( "
" ).dialog( options ); + setTimeout(function() { + var input = element.find( "input:last" ).focus().blur(); + element.dialog( "instance" )._focusTabbable(); + setTimeout(function() { + equal( document.activeElement, input[ 0 ], + "1. an element that was focused previously." ); + element.remove(); + setTimeout( step2 ); + }); + }); } function step2() { - checkFocus( "
", options, function() { - equal( document.activeElement, element.find( "input" )[ 0 ], - "2. tabbable element inside the content element" ); + checkFocus( "
", options, function() { + equal( document.activeElement, element.find( "input" )[ 1 ], + "2. first element inside the dialog matching [autofocus]" ); }, step3 ); } function step3() { - checkFocus( "
text
", options, function() { - equal( document.activeElement, - element.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], - "3. tabbable element inside the buttonpane" ); + checkFocus( "
", options, function() { + equal( document.activeElement, element.find( "input" )[ 0 ], + "3. tabbable element inside the content element" ); }, step4 ); } function step4() { - checkFocus( "
text
", {}, function() { + checkFocus( "
text
", options, function() { equal( document.activeElement, - element.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], - "4. the close button" ); + element.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], + "4. tabbable element inside the buttonpane" ); }, step5 ); } function step5() { + checkFocus( "
text
", {}, function() { + equal( document.activeElement, + element.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], + "5. the close button" ); + }, step6 ); + } + + function step6() { element = $( "
text
" ).dialog({ autoOpen: false }); element.dialog( "widget" ).find( ".ui-dialog-titlebar-close" ).hide(); element.dialog( "open" ); setTimeout(function() { - equal( document.activeElement, element.parent()[ 0 ], "5. the dialog itself" ); + equal( document.activeElement, element.parent()[ 0 ], "6. the dialog itself" ); element.remove(); start(); }); diff --git a/tests/unit/dialog/dialog_methods.js b/tests/unit/dialog/dialog_methods.js index 8918e8d36..d315e5fc3 100644 --- a/tests/unit/dialog/dialog_methods.js +++ b/tests/unit/dialog/dialog_methods.js @@ -220,6 +220,11 @@ asyncTest( "#8958: dialog can be opened while opening", function() { } }); + // Support: IE8 + // For some reason the #favorite-color input doesn't get focus if we don't + // focus the body first, causing the test to hang. + $( "body" ).focus(); + $( "#favorite-animal" ) // We focus the input to start the test. Once it receives focus, the // dialog will open. Opening the dialog, will cause an element inside diff --git a/tests/unit/menu/menu_common.js b/tests/unit/menu/menu_common.js index 2404ebe02..099dd091e 100644 --- a/tests/unit/menu/menu_common.js +++ b/tests/unit/menu/menu_common.js @@ -7,7 +7,7 @@ TestHelpers.commonWidgetTests( "menu", { items: "> *", menus: "ul", position: { - my: "left top", + my: "left-1 top", at: "right top" }, role: "menu", diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index 0b89b86ac..9d74b4bbb 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -389,15 +389,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and without submenus" log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" ); + equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" ); + equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_UP" ); + equal( logOutput(), "keydown,11", "Keydown PAGE_UP" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); @@ -484,15 +484,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and with submenus", f function menukeyboard3() { log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" ); + equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); - equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" ); + equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); - equal( logOutput(), "keydown,10", "Keydown PAGE_UP" ); + equal( logOutput(), "keydown,11", "Keydown PAGE_UP" ); log( "keydown", true ); element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); diff --git a/tests/unit/menu/menu_options.js b/tests/unit/menu/menu_options.js index 527cc4784..c76673345 100644 --- a/tests/unit/menu/menu_options.js +++ b/tests/unit/menu/menu_options.js @@ -66,13 +66,12 @@ test( "{ icons: { submenu: 'custom' } }", function() { test( "{ role: 'menu' } ", function() { var element = $( "#menu1" ).menu(), items = element.find( "li" ); - expect( 2 + 4 * items.length ); + expect( 2 + 3 * items.length ); equal( element.attr( "role" ), "menu" ); ok( items.length > 0, "number of menu items" ); items.each(function( item ) { ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" ); equal( $( this ).attr( "role" ), "menuitem", "menu item ("+ item + ") role" ); - ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" ); equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" ); }); }); @@ -82,13 +81,12 @@ test( "{ role: 'listbox' } ", function() { role: "listbox" }), items = element.find( "li" ); - expect( 2 + 4 * items.length ); + expect( 2 + 3 * items.length ); equal( element.attr( "role" ), "listbox" ); ok( items.length > 0, "number of menu items" ); items.each(function( item ) { ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" ); equal( $( this ).attr( "role" ), "option", "menu item ("+ item + ") role" ); - ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" ); equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" ); }); }); @@ -98,13 +96,12 @@ test( "{ role: null }", function() { role: null }), items = element.find( "li" ); - expect( 2 + 4 * items.length ); + expect( 2 + 3 * items.length ); strictEqual( element.attr( "role" ), undefined ); ok( items.length > 0, "number of menu items" ); items.each(function( item ) { ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" ); equal( $( this ).attr( "role" ), undefined, "menu item ("+ item + ") role" ); - ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" ); equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" ); }); }); diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index 2b803b62f..aa6164c5c 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -86,7 +86,7 @@ $.widget( "ui.autocomplete", { suppressInput = false; suppressKeyPressRepeat = false; var keyCode = $.ui.keyCode; - switch( event.keyCode ) { + switch ( event.keyCode ) { case keyCode.PAGE_UP: suppressKeyPress = true; this._move( "previousPage", event ); @@ -149,7 +149,7 @@ $.widget( "ui.autocomplete", { // replicate some key handlers to allow them to repeat in Firefox and Opera var keyCode = $.ui.keyCode; - switch( event.keyCode ) { + switch ( event.keyCode ) { case keyCode.PAGE_UP: this._move( "previousPage", event ); break; @@ -570,7 +570,6 @@ $.extend( $.ui.autocomplete, { } }); - // live region extension, adding a `messages` option // NOTE: This is an experimental API. We are still investigating // a full solution for string manipulation and internationalization. diff --git a/ui/jquery.ui.core.js b/ui/jquery.ui.core.js index 7faae0760..e789910df 100644 --- a/ui/jquery.ui.core.js +++ b/ui/jquery.ui.core.js @@ -211,10 +211,6 @@ if ( $( "" ).data( "a-b", "a" ).removeData( "a-b" ).data( "a-b" ) ) { })( $.fn.removeData ); } - - - - // deprecated $.ui.ie = !!/msie [\w.]+/.exec( navigator.userAgent.toLowerCase() ); diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index c5bd42ab5..d3ce333f4 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -86,25 +86,25 @@ $.widget( "ui.dialog", { _create: function() { this.originalCss = { - display: this.element[0].style.display, - width: this.element[0].style.width, - minHeight: this.element[0].style.minHeight, - maxHeight: this.element[0].style.maxHeight, - height: this.element[0].style.height + display: this.element[ 0 ].style.display, + width: this.element[ 0 ].style.width, + minHeight: this.element[ 0 ].style.minHeight, + maxHeight: this.element[ 0 ].style.maxHeight, + height: this.element[ 0 ].style.height }; this.originalPosition = { parent: this.element.parent(), index: this.element.parent().children().index( this.element ) }; - this.originalTitle = this.element.attr("title"); + this.originalTitle = this.element.attr( "title" ); this.options.title = this.options.title || this.originalTitle; this._createWrapper(); this.element .show() - .removeAttr("title") - .addClass("ui-dialog-content ui-widget-content") + .removeAttr( "title" ) + .addClass( "ui-dialog-content ui-widget-content" ) .appendTo( this.uiDialog ); this._createTitlebar(); @@ -118,6 +118,8 @@ $.widget( "ui.dialog", { } this._isOpen = false; + + this._trackFocus(); }, _init: function() { @@ -142,7 +144,7 @@ $.widget( "ui.dialog", { this.element .removeUniqueId() - .removeClass("ui-dialog-content ui-widget-content") + .removeClass( "ui-dialog-content ui-widget-content" ) .css( this.originalCss ) // Without detaching first, the following becomes really slow .detach(); @@ -155,7 +157,7 @@ $.widget( "ui.dialog", { next = originalPosition.parent.children().eq( originalPosition.index ); // Don't try to place the dialog next to itself (#8613) - if ( next.length && next[0] !== this.element[0] ) { + if ( next.length && next[ 0 ] !== this.element[ 0 ] ) { next.before( this.element ); } else { originalPosition.parent.append( this.element ); @@ -178,9 +180,10 @@ $.widget( "ui.dialog", { } this._isOpen = false; + this._focusedElement = null; this._destroyOverlay(); - if ( !this.opener.filter(":focusable").focus().length ) { + if ( !this.opener.filter( ":focusable" ).focus().length ) { // support: IE9 // IE9 throws an "Unspecified error" accessing document.activeElement from an