diff --git a/.gitignore b/.gitignore index 3330f6be..251f2cfc 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ test/public/vendor/jquery.js +node_modules *.swp *.swo .#* diff --git a/.jshintrc b/.jshintrc new file mode 100644 index 00000000..9bfd6603 --- /dev/null +++ b/.jshintrc @@ -0,0 +1,71 @@ +{ + "maxerr" : 50, // {int} Maximum error before stopping + + // Enforcing + "bitwise" : true, // true: Prohibit bitwise operators (&, |, ^, etc.) + "camelcase" : true, // true: Identifiers must be in camelCase + "curly" : false, // true: Require {} for every new block or scope + "eqeqeq" : true, // true: Require triple equals (===) for comparison + "forin" : true, // true: Require filtering for..in loops with obj.hasOwnProperty() + "freeze" : true, // true: prohibits overwriting prototypes of native objects such as Array, Date etc. + "immed" : false, // true: Require immediate invocations to be wrapped in parens e.g. `(function () { } ());` + "indent" : 2, // {int} Number of spaces to use for indentation + "latedef" : false, // true: Require variables/functions to be defined before being used + "newcap" : false, // true: Require capitalization of all constructor functions e.g. `new F()` + "noarg" : true, // true: Prohibit use of `arguments.caller` and `arguments.callee` + "noempty" : true, // true: Prohibit use of empty blocks + "nonbsp" : true, // true: Prohibit "non-breaking whitespace" characters. + "nonew" : false, // true: Prohibit use of constructors for side-effects (without assignment) + "plusplus" : false, // true: Prohibit use of `++` & `--` + "quotmark" : "single", // Quotation mark consistency: + // false : do nothing (default) + // true : ensure whatever is used is consistent + // "single" : require single quotes + // "double" : require double quotes + "undef" : true, // true: Require all non-global variables to be declared (prevents global leaks) + "unused" : true, // Unused variables: + // true : all variables, last function parameter + // "vars" : all variables only + // "strict" : all variables, all function parameters + "strict" : true, // true: Requires all functions run in ES5 Strict Mode + "maxparams" : false, // {int} Max number of formal params allowed per function + "maxdepth" : false, // {int} Max depth of nested blocks (within functions) + "maxstatements" : false, // {int} Max number statements per function + "maxcomplexity" : false, // {int} Max cyclomatic complexity per function + "maxlen" : false, // {int} Max number of characters per line + + // Relaxing + "asi" : false, // true: Tolerate Automatic Semicolon Insertion (no semicolons) + "boss" : false, // true: Tolerate assignments where comparisons would be expected + "debug" : false, // true: Allow debugger statements e.g. browser breakpoints. + "eqnull" : false, // true: Tolerate use of `== null` + "es5" : false, // true: Allow ES5 syntax (ex: getters and setters) + "esnext" : false, // true: Allow ES.next (ES6) syntax (ex: `const`) + "moz" : false, // true: Allow Mozilla specific syntax (extends and overrides esnext features) + // (ex: `for each`, multiple try/catch, function expression…) + "evil" : false, // true: Tolerate use of `eval` and `new Function()` + "expr" : false, // true: Tolerate `ExpressionStatement` as Programs + "funcscope" : false, // true: Tolerate defining variables inside control statements + "globalstrict" : false, // true: Allow global "use strict" (also enables 'strict') + "iterator" : false, // true: Tolerate using the `__iterator__` property + "lastsemic" : false, // true: Tolerate omitting a semicolon for the last statement of a 1-line block + "laxbreak" : false, // true: Tolerate possibly unsafe line breakings + "laxcomma" : false, // true: Tolerate comma-first style coding + "loopfunc" : false, // true: Tolerate functions being defined in loops + "multistr" : false, // true: Tolerate multi-line strings + "noyield" : false, // true: Tolerate generator functions with no yield statement in them. + "notypeof" : false, // true: Tolerate invalid typeof operator values + "proto" : false, // true: Tolerate using the `__proto__` property + "scripturl" : false, // true: Tolerate script-targeted URLs + "shadow" : false, // true: Allows re-define variables later in code e.g. `var x=1; x=2;` + "sub" : false, // true: Tolerate using `[]` notation when it can still be expressed in dot notation + "supernew" : false, // true: Tolerate `new function () { ... };` and `new Object;` + "validthis" : false, // true: Tolerate using this in a non-constructor function + + // Environments + "browser" : true, // Web Browser (window, document, etc) + "jquery" : true, + "devel" : true, // Development/debugging (alert, confirm, etc) + + "globals" : {} +} diff --git a/.npmignore b/.npmignore new file mode 100644 index 00000000..3af83847 --- /dev/null +++ b/.npmignore @@ -0,0 +1,4 @@ +script/ +test/ +Rakefile +Gemfile* diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 00000000..7e6cb080 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,29 @@ +language: ruby +sudo: false +cache: + - bundler + - directories: + - $HOME/.npm +script: ./script/cibuild +before_install: + - "npm install jshint -g" +env: + - JQUERY_VERSION: 1.8.0 + - JQUERY_VERSION: 1.8.1 + - JQUERY_VERSION: 1.8.2 + - JQUERY_VERSION: 1.8.3 + - JQUERY_VERSION: 1.9.0 + - JQUERY_VERSION: 1.9.1 + - JQUERY_VERSION: 1.10.0 + - JQUERY_VERSION: 1.10.1 + - JQUERY_VERSION: 1.10.2 + - JQUERY_VERSION: 1.11.0 + - JQUERY_VERSION: 1.11.1 + - JQUERY_VERSION: 1.11.2 + - JQUERY_VERSION: 1.12.0 + - JQUERY_VERSION: 2.0.0 + - JQUERY_VERSION: 2.1.0 + - JQUERY_VERSION: 2.1.1 + - JQUERY_VERSION: 2.1.2 + - JQUERY_VERSION: 2.1.3 + - JQUERY_VERSION: 2.2.0 diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index cfff7571..00000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,41 +0,0 @@ -CHANGELOG -========= - -Here is a non-exhaustive list of notable changes to jquery-ujs (oldest -to newest): - -- [`085d910a5ec07b69`](https://github.com/rails/jquery-ujs/commit/085d910a5ec07b69f31beabce286141aa26f3005) last version before callback names updated -- [`72d875a8d57c6bb4`](https://github.com/rails/jquery-ujs/commit/72d875a8d57c6bb466170980a5142c66ac74e8f0) callback name updates completed -- [`e076121248913143`](https://github.com/rails/jquery-ujs/commit/e0761212489131437402a92fa8f548a78f685ae2) dropped support for jQuery 1.4, 1.4.1, 1.4.2 (separate [v1.4 branch](https://github.com/rails/jquery-ujs/commits/v1.4) created) -- [`498b35e24cdb14f2`](https://github.com/rails/jquery-ujs/commit/498b35e24cdb14f2d94486e8a1f4a1f661091426) last version before `.callRemote()` removed -- [`ec96408a746d3b06`](https://github.com/rails/jquery-ujs/commit/ec96408a746d3b0692da9249f218a3943fbffc28) `ACCEPTS` header data-type default changed to prefer `:js` but not require it -- [`fc639928d1e15c88`](https://github.com/rails/jquery-ujs/commit/fc639928d1e15c885b85de5b517346db7f963f44) default form method changed from `POST` to `GET` -- [`e9311550fdb3afeb`](https://github.com/rails/jquery-ujs/commit/e9311550fdb3afeb2917bcb1fef39767bf715003) added CSRF Protection to remote requests -- [`a284dd706e7d76e8`](https://github.com/rails/jquery-ujs/commit/a284dd706e7d76e85471ef39ab3efdf07feef374) CSRF fixed - changed to only add if token is present -- [`f9b21b3a3c7c4684`](https://github.com/rails/jquery-ujs/commit/f9b21b3a3c7c46840fed8127a90def26911fad3d) `ajax:before` added back -- [`7f2acc1811f62877`](https://github.com/rails/jquery-ujs/commit/7f2acc1811f62877611e16451530728b5e13dbe7) last version before file-upload aborting behavior added -- [`ca575e184e93b3ef`](https://github.com/rails/jquery-ujs/commit/ca575e184e93b3efe1a858cf598f8a37f0a760cc) added `ajax:aborted:required` and `ajax:aborted:file` event hooks -- [`d2abd6f9df4e4a42`](https://github.com/rails/jquery-ujs/commit/d2abd6f9df4e4a426c17c218b7d5e05004c768d0) fixed submit and bubbling behavior for IE -- [`d59144177d867908`](https://github.com/rails/jquery-ujs/commit/d59144177d86790891fdb99b0e3437312e04fda2) created external api via `$.rails` object -- [`cd357e492de14747`](https://github.com/rails/jquery-ujs/commit/cd357e492de147472a8a2524575acce5d923e640) added support for jQuery 1.6 and dropped support for jQuery 1.4.3 -- [`50c06dcc02c1b08c`](https://github.com/rails/jquery-ujs/commit/50c06dcc02c1b08cb7a9b4b8eced54ed685c1c93) added `confirm:complete` event hook which is passed result from confirm dialog -- [`8063d1d47ea6a08e`](https://github.com/rails/jquery-ujs/commit/8063d1d47ea6a08e545e9a6ba3e84af584200e41) made $.rails.confirm and $.rails.ajax functions available in $.rails object -- [`a96c4e9b074998c6`](https://github.com/rails/jquery-ujs/commit/a96c4e9b074998c6b6d102e4573b81c8a76f07a7) added support for jQuery 1.6.1 -- [`dad6982dc5926866`](https://github.com/rails/jquery-ujs/commit/dad6982dc592686677e6845e681233c40d2ead27) added support for `data-params` attribute on remote links -- [`5433841d01622345`](https://github.com/rails/jquery-ujs/commit/5433841d01622345f734f22f82394ac035c2f783) removed support for jquery 1.4.4 and 1.5.x, and added support for jquery 1.6.2 -- [`cd619df9f0daad33`](https://github.com/rails/jquery-ujs/commit/cd619df9f0daad3303aacd4f992fff19158b1e5d) added support for html5 `novalidate` attribute, so required fields validation is not enforced -- [`840ab6ac76b2d5ab`](https://github.com/rails/jquery-ujs/commit/840ab6ac76b2d5ab931841bc3d8567e5b57f183e) added support for jquery 1.6.3 -- [`ba5808e73111fb65`](https://github.com/rails/jquery-ujs/commit/ba5808e73111fb65e91610b078577bb014d9b6d8) added `data-remote` support for checkboxes -- [`6e9a06d45eaf2da1`](https://github.com/rails/jquery-ujs/commit/6e9a06d45eaf2da1036d4c2ead25ff57d0127d03) added `data-disable-with` support for links -- [`89396108ce574080`](https://github.com/rails/jquery-ujs/commit/89396108ce574080f9b877cad74573c5d1ae9aa2) added `data-remote` support for all input types -- [`c01215c3d48ebb9f`](https://github.com/rails/jquery-ujs/commit/c01215c3d48ebb9f9f1059f26efa0c0c9092da2b) added support for jquery 1.6.4 -- [`17f4004310b6ece3`](https://github.com/rails/jquery-ujs/commit/17f4004310b6ece3cb240914932b4d6d46032c24) added support for jquery 1.7 -- [`cb54ae287f5c7320`](https://github.com/rails/jquery-ujs/commit/cb54ae287f5c73207aef2891cdf22212aea5fb86) added support for jquery 1.7.1 -- [`dbb1b5f72a62e59f`](https://github.com/rails/jquery-ujs/commit/dbb1b5f72a62e59f34f6b5be4bee291ee7f3318f) added support for jquery 1.7.2 -- [`8100cf3b2462f144`](https://github.com/rails/jquery-ujs/commit/8100cf3b2462f144e6a0bcef7cb78d05be41755d) created `rails:attachBindings` to allow for customization of - $.rails object settings -- [`e4ca2045b202cd7a`](https://github.com/rails/jquery-ujs/commit/e4ca2045b202cd7ade97d78c20caa2822c5c28da) created `ajax:send` event to provide access to jqXHR object from - ajax requests -- [`4382f580766fcdd1`](https://github.com/rails/jquery-ujs/commit/4382f580766fcdd14201c204f43ca5aeb0928501) added support for `data-with-credentials` -- [`12da9fc2f175c8e4`](https://github.com/rails/jquery-ujs/commit/12da9fc2f175c8e445413b15cf6b685deb271d6e) added support for jQuery 1.8.0, removed support for jquery 1.6.x -- [`faeb0ad734ff6867`](https://github.com/rails/jquery-ujs/commit/faeb0ad734ff6867149b8522f9a29081734442e6) added support for jQuery 1.8.1 diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 00000000..6827438d --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,109 @@ +Contributing to jquery-ujs +===================== + +[](https://travis-ci.org/rails/jquery-ujs) + +jquery-ujs is work of [many contributors](https://github.com/rails/jquery-ujs/graphs/contributors). You're encouraged to submit [pull requests](https://github.com/rails/jquery-ujs/pulls), [propose features and discuss issues](https://github.com/rails/jquery-ujs/issues). + +#### Fork the Project + +Fork the [project on Github](https://github.com/rails/jquery-ujs) and check out your copy. + +``` +git clone https://github.com/contributor/jquery-ujs.git +cd jquery-ujs +git remote add upstream https://github.com/rails/jquery-ujs.git +``` + +#### Create a Topic Branch + +Make sure your fork is up-to-date and create a topic branch for your feature or bug fix. + +``` +git checkout master +git pull upstream master +git checkout -b my-feature-branch +``` + +#### Bundle Install and Test + +Ensure that you can build the project and run tests. Run `rake test:server` first, and then run the web tests by visiting [[http://localhost:4567]] in your browser. Click the version links at the top right of the page to run the test suite with the different supported versions of jQuery. + +``` +bundle install +rake test:server +``` + +#### Write Tests + +Try to write a test that reproduces the problem you're trying to fix or describes a feature that you want to build. Add to [test](test). + +Here are some additional notes to keep in mind when developing your patch for jquery-ujs. + +* The tests can be found in: +``` + |~test + |~public + |~test +``` +* Some tests ensure consistent behavior across the major browsers, meaning it is possible for tests to pass in Firefox, but fail in Internet Explorer. If possible, it helps if you can run the test suite in multiple browsers before submitting patches. + +We definitely appreciate pull requests that highlight or reproduce a problem, even without a fix. + +#### Write Code + +Implement your feature or bug fix. + +Make sure that `bundle exec rake test` completes without errors. + +#### Write Documentation + +Document any external behavior in the [README](README.md). + +#### Commit Changes + +Make sure git knows your name and email address: + +``` +git config --global user.name "Your Name" +git config --global user.email "contributor@example.com" +``` + +Writing good commit logs is important. A commit log should describe what changed and why. + +``` +git add ... +git commit +``` + +#### Push + +``` +git push origin my-feature-branch +``` + +#### Make a Pull Request + +Go to https://github.com/contributor/jquery-ujs and select your feature branch. Click the 'Pull Request' button and fill out the form. Pull requests are usually reviewed within a few days. + +#### Rebase + +If you've been working on a change for a while, rebase with upstream/master. + +``` +git fetch upstream +git rebase upstream/master +git push origin my-feature-branch -f +``` + +#### Check on Your Pull Request + +Go back to your pull request after a few minutes and see whether it passed muster with Travis-CI. Everything should look green, otherwise fix issues and amend your commit as described above. + +#### Be Patient + +It's likely that your change will not be merged and that the nitpicky maintainers will ask you to do more, or fix seemingly benign problems. Hang on there! + +#### Thank You + +Please do know that we really appreciate and value your time and work. We love you, really. diff --git a/Gemfile b/Gemfile index e32e523b..aca39a6b 100644 --- a/Gemfile +++ b/Gemfile @@ -1,6 +1,6 @@ -source 'http://rubygems.org' +source 'https://rubygems.org' gem 'sinatra', '~> 1.0' gem 'shotgun', :group => :reloadable gem 'thin', :group => :reloadable -gem 'json' +gem 'rake' diff --git a/Gemfile.lock b/Gemfile.lock index 42460e58..8ced3297 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,26 +1,29 @@ GEM - remote: http://rubygems.org/ + remote: https://rubygems.org/ specs: - daemons (1.1.0) - eventmachine (0.12.10) - json (1.4.6) - rack (1.2.1) - shotgun (0.8) + daemons (1.1.9) + eventmachine (1.0.4) + rack (1.6.0) + rack-protection (1.5.3) + rack + rake (10.4.2) + shotgun (0.9) rack (>= 1.0) - sinatra (1.1.2) - rack (~> 1.1) - tilt (~> 1.2) - thin (1.2.7) - daemons (>= 1.0.9) - eventmachine (>= 0.12.6) - rack (>= 1.0.0) - tilt (1.2.1) + sinatra (1.4.5) + rack (~> 1.4) + rack-protection (~> 1.4) + tilt (~> 1.3, >= 1.3.4) + thin (1.6.3) + daemons (~> 1.0, >= 1.0.9) + eventmachine (~> 1.0) + rack (~> 1.0) + tilt (1.4.1) PLATFORMS ruby DEPENDENCIES - json + rake shotgun sinatra (~> 1.0) thin diff --git a/MIT-LICENSE.txt b/MIT-LICENSE similarity index 94% rename from MIT-LICENSE.txt rename to MIT-LICENSE index ed37a233..9c7e3c0b 100644 --- a/MIT-LICENSE.txt +++ b/MIT-LICENSE @@ -1,4 +1,4 @@ -Copyright (c) 2007-2010 Contributors at http://github.com/rails/jquery-ujs/contributors +Copyright (c) 2007-2016 Contributors at http://github.com/rails/jquery-ujs/contributors Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the diff --git a/README.md b/README.md index db3dff79..2e429bd1 100644 --- a/README.md +++ b/README.md @@ -15,82 +15,84 @@ Full [documentation is on the wiki][wiki], including the [list of published Ajax Requirements ------------ -- [jQuery 1.7.x or 1.8.x][jquery]; +- [jQuery 1.8.x or higher][jquery]; - HTML5 doctype (optional). If you don't use HTML5, adding "data" attributes to your HTML4 or XHTML pages might make them fail [W3C markup validation][validator]. However, this shouldn't create any issues for web browsers or other user agents. -Installation +Installation using the jquery-rails gem ------------ For automated installation in Rails, use the "jquery-rails" gem. Place this in your Gemfile: ```ruby -gem 'jquery-rails', '~> 2.1' +gem 'jquery-rails' ``` And run: - $ bundle install - -This next step depends on your version of Rails. +```shell +$ bundle install +``` -a. For Rails 3.1, add these lines to the top of your app/assets/javascripts/application.js file: +Require both `jquery` and `jquery_ujs` into your application.js manifest. ```javascript //= require jquery //= require jquery_ujs ``` -b. For Rails 3.0, run this command (add `--ui` if you want jQuery UI): - -*Be sure to get rid of the rails.js file if it exists, and instead use -the new jquery_ujs.js file that gets copied to the public directory. -Choose to overwrite jquery_ujs.js if prompted.* +Installation using npm. +------------ - $ rails generate jquery:install +Run `npm install --save jquery-ujs` to install the jquery-ujs package. +Installation using Rails and Webpacker +------------ -### Manual installation (including Rails 2) +If you're using [webpacker](https://github.com/rails/webpacker) (introduced in [Rails 5.1](http://edgeguides.rubyonrails.org/5_1_release_notes.html#optional-webpack-support)) to manage JavaScript assets, then you can add the jquery-ujs npm package to your project using the [yarn](https://yarnpkg.com/en/) CLI. -[Download jQuery][jquery] and ["rails.js"][adapter] and place them in your "javascripts" directory. +``` +$ yarn add jquery-ujs +``` -Configure the following in your application startup file (for Rails 3): +Then, from any of your included files (e.g. `app/javascript/packs/application.js`, or from a JavaScript file imported by such a pack), you need only import the package for jquery-ujs to be initialized: -```ruby - config.action_view.javascript_expansions[:defaults] = %w(jquery rails) +```js +import {} from 'jquery-ujs' ``` -Or create an initializer (for Rails 2): +Installation using Bower +------------ -```ruby -module ActionView::Helpers::AssetTagHelper - remove_const :JAVASCRIPT_DEFAULT_SOURCES - JAVASCRIPT_DEFAULT_SOURCES = %w(jquery.js rails.js) +Run `bower install jquery-ujs --save` to install the jquery-ujs package. - reset_javascript_include_default -end +Usage +------------ + +Require both `jquery` and `jquery-ujs` into your application.js manifest. + +```javascript +//= require jquery +//= require jquery-ujs ``` -Now the template helper `javascript_include_tag :defaults` will generate SCRIPT tags to load jQuery and rails.js. +How to run tests +------------ -For Rails 2, you will need to manually implement the `csrf_meta_tag` helper and include it inside the `` of your application layout. +Follow [this wiki](https://github.com/rails/jquery-ujs/wiki/Running-Tests-and-Contributing) to run tests. -The `csrf_meta_tags` (Rails 3.1) and `csrf_meta_tag` (Rails 3.0) helpers generate two meta tags containing values necessary for the [cross-site request forgery protection][csrf] built into Rails. Here is how to implement that helper in Rails 2: +## Contributing to jquery-ujs -```ruby - # app/helpers/application_helper.rb - def csrf_meta_tag - if protect_against_forgery? - out = %(\n) - out << %() - out % [ Rack::Utils.escape_html(request_forgery_protection_token), - Rack::Utils.escape_html(form_authenticity_token) ] - end - end -``` +jquery-ujs is work of many contributors. You're encouraged to submit pull requests, propose +features and discuss issues. + +See [CONTRIBUTING](CONTRIBUTING.md). + +## License +jquery-ujs is released under the [MIT License](MIT-LICENSE). -[data]: http://dev.w3.org/html5/spec/elements.html#embedding-custom-non-visible-data-with-the-data-attributes "Embedding custom non-visible data with the data-* attributes" +[data]: http://www.w3.org/TR/html5/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes "Embedding custom non-visible data with the data-* attributes" [wiki]: https://github.com/rails/jquery-ujs/wiki [events]: https://github.com/rails/jquery-ujs/wiki/ajax [jquery]: http://docs.jquery.com/Downloading_jQuery diff --git a/RELEASE.md b/RELEASE.md new file mode 100644 index 00000000..59316f77 --- /dev/null +++ b/RELEASE.md @@ -0,0 +1,23 @@ +## Releasing jquery-ujs + +### Releasing to npm + +Make sure npm's configuration `sign-git-tag` is set to true. + +``` +npm config set sign-git-tag true +``` + +Release it to npm using the [npm version command](https://docs.npmjs.com/cli/version). Like: + +``` +npm version patch +``` + +This will: + +* Bump a patch version +* Commit the change +* Generate the tag +* Push the commit and the tag to the repository +* Publish the package in https://www.npmjs.com diff --git a/bower.json b/bower.json new file mode 100644 index 00000000..14f93cf3 --- /dev/null +++ b/bower.json @@ -0,0 +1,19 @@ +{ + "name": "jquery-ujs", + "homepage": "https://github.com/rails/jquery-ujs", + "authors": ["Stephen St. Martin", "Steve Schwartz"], + "description": "Ruby on Rails unobtrusive scripting adapter for jQuery", + "main": "src/rails.js", + "license": "MIT", + "dependencies": { + "jquery": ">1.8.*" + }, + "ignore": [ + "**/.*", + "Gemfile*", + "Rakefile", + "bower_components", + "script", + "test" + ] +} diff --git a/package.json b/package.json new file mode 100644 index 00000000..9299d5f5 --- /dev/null +++ b/package.json @@ -0,0 +1,26 @@ +{ + "name": "jquery-ujs", + "version": "1.2.3", + "description": "Unobtrusive scripting adapter for jQuery", + "main": "src/rails.js", + "scripts": { + "test": "echo \"See the wiki: https://github.com/rails/jquery-ujs/wiki/Running-Tests-and-Contributing\" && exit 1", + "postversion": "git push && git push --tags && npm publish" + }, + "repository": { + "type": "git", + "url": "https://github.com/rails/jquery-ujs.git" + }, + "author": [ + "Stephen St. Martin", + "Steve Schwartz" + ], + "license": "MIT", + "bugs": { + "url": "https://github.com/rails/jquery-ujs/issues" + }, + "homepage": "https://github.com/rails/jquery-ujs#readme", + "peerDependencies": { + "jquery": ">=1.8.0" + } +} diff --git a/script/cibuild b/script/cibuild new file mode 100755 index 00000000..45c97099 --- /dev/null +++ b/script/cibuild @@ -0,0 +1,40 @@ +#!/bin/bash + +port=4567 + +start_server() { + mkdir -p log + bundle exec ruby test/server.rb > log/test.log 2>&1 & +} + +run_tests() { + jshint src/*.js && phantomjs script/runner.js http://localhost:$port/ +} + +server_started() { + lsof -i :${1?} >/dev/null +} + +timestamp() { + date +%s +} + +wait_for_server() { + timeout=$(( `timestamp` + $1 )) + while true; do + if server_started "$2"; then + break + elif [ `timestamp` -gt "$timeout" ]; then + echo "timed out after $1 seconds" >&2 + exit 1 + fi + done +} + +start_server +server_pid=$! +wait_for_server 5 $port +run_tests +result=$? +kill $server_pid +exit $result diff --git a/script/runner.js b/script/runner.js new file mode 100644 index 00000000..5d9f96c5 --- /dev/null +++ b/script/runner.js @@ -0,0 +1,148 @@ +/* + * PhantomJS Runner QUnit Plugin 1.2.0 + * + * PhantomJS binaries: http://phantomjs.org/download.html + * Requires PhantomJS 1.6+ (1.7+ recommended) + * + * Run with: + * phantomjs runner.js [url-of-your-qunit-testsuite] + * + * e.g. + * phantomjs runner.js http://localhost/qunit/test/index.html + */ + +/*global phantom:false, require:false, console:false, window:false, QUnit:false */ + +(function() { + 'use strict'; + + var url, page, timeout, + args = require('system').args; + + // arg[0]: scriptName, args[1...]: arguments + if (args.length < 2 || args.length > 3) { + console.error('Usage:\n phantomjs runner.js [url-of-your-qunit-testsuite] [timeout-in-seconds]'); + phantom.exit(1); + } + + url = args[1]; + page = require('webpage').create(); + if (args[2] !== undefined) { + timeout = parseInt(args[2], 10); + } + + // Route `console.log()` calls from within the Page context to the main Phantom context (i.e. current `this`) + page.onConsoleMessage = function(msg) { + console.log(msg); + }; + + page.onInitialized = function() { + page.evaluate(addLogging); + }; + + page.onCallback = function(message) { + var result, + failed; + + if (message) { + if (message.name === 'QUnit.done') { + result = message.data; + failed = !result || !result.total || result.failed; + + if (!result.total) { + console.error('No tests were executed. Are you loading tests asynchronously?'); + } + + phantom.exit(failed ? 1 : 0); + } + } + }; + + page.open(url, function(status) { + if (status !== 'success') { + console.error('Unable to access network: ' + status); + phantom.exit(1); + } else { + // Cannot do this verification with the 'DOMContentLoaded' handler because it + // will be too late to attach it if a page does not have any script tags. + var qunitMissing = page.evaluate(function() { return (typeof QUnit === 'undefined' || !QUnit); }); + if (qunitMissing) { + console.error('The `QUnit` object is not present on this page.'); + phantom.exit(1); + } + + // Set a timeout on the test running, otherwise tests with async problems will hang forever + if (typeof timeout === 'number') { + setTimeout(function() { + console.error('The specified timeout of ' + timeout + ' seconds has expired. Aborting...'); + phantom.exit(1); + }, timeout * 1000); + } + + // Do nothing... the callback mechanism will handle everything! + } + }); + + function addLogging() { + window.document.addEventListener('DOMContentLoaded', function() { + var currentTestAssertions = []; + + QUnit.log(function(details) { + var response; + + // Ignore passing assertions + if (details.result) { + return; + } + + response = details.message || ''; + + if (typeof details.expected !== 'undefined') { + if (response) { + response += ', '; + } + + response += 'expected: ' + details.expected + ', but was: ' + details.actual; + } + + if (details.source) { + response += "\n" + details.source; + } + + currentTestAssertions.push('Failed assertion: ' + response); + }); + + QUnit.testDone(function(result) { + var i, + len, + name = ''; + + if (result.module) { + name += result.module + ': '; + } + name += result.name; + + if (result.failed) { + console.log('\n' + 'Test failed: ' + name); + + for (i = 0, len = currentTestAssertions.length; i < len; i++) { + console.log(' ' + currentTestAssertions[i]); + } + } + + currentTestAssertions.length = 0; + }); + + QUnit.done(function(result) { + console.log('\n' + 'Took ' + result.runtime + 'ms to run ' + result.total + ' tests. ' + result.passed + ' passed, ' + result.failed + ' failed.'); + + if (typeof window.callPhantom === 'function') { + window.callPhantom({ + 'name': 'QUnit.done', + 'data': result + }); + } + }); + }, false); + } +})(); diff --git a/src/rails.js b/src/rails.js index df9dc862..0e27110d 100644 --- a/src/rails.js +++ b/src/rails.js @@ -1,98 +1,85 @@ -(function($, undefined) { +/* jshint node: true */ /** * Unobtrusive scripting adapter for jQuery - * - * Requires jQuery 1.6.0 or later. * https://github.com/rails/jquery-ujs - - * Uploading file using rails.js - * ============================= - * - * By default, browsers do not allow files to be uploaded via AJAX. As a result, if there are any non-blank file fields - * in the remote form, this adapter aborts the AJAX submission and allows the form to submit through standard means. - * - * The `ajax:aborted:file` event allows you to bind your own handler to process the form submission however you wish. - * - * Ex: - * $('form').live('ajax:aborted:file', function(event, elements){ - * // Implement own remote file-transfer handler here for non-blank file inputs passed in `elements`. - * // Returning false in this handler tells rails.js to disallow standard form submission - * return false; - * }); - * - * The `ajax:aborted:file` event is fired when a file-type input is detected with a non-blank value. - * - * Third-party tools can use this hook to detect when an AJAX file upload is attempted, and then use - * techniques like the iframe method to upload the file instead. * - * Required fields in rails.js - * =========================== + * Requires jQuery 1.8.0 or later. * - * If any blank required inputs (required="required") are detected in the remote form, the whole form submission - * is canceled. Note that this is unlike file inputs, which still allow standard (non-AJAX) form submission. + * Released under the MIT license * - * The `ajax:aborted:required` event allows you to bind your own handler to inform the user of blank required inputs. - * - * !! Note that Opera does not fire the form's submit event if there are blank required inputs, so this event may never - * get fired in Opera. This event is what causes other browsers to exhibit the same submit-aborting behavior. - * - * Ex: - * $('form').live('ajax:aborted:required', function(event, elements){ - * // Returning false in this handler tells rails.js to submit the form anyway. - * // The blank required inputs are passed to this function in `elements`. - * return ! confirm("Would you like to submit the form with missing info?"); - * }); */ - // Cut down on the number if issues from people inadvertently including jquery_ujs twice - // by detecting and raising an error when it happens. - var alreadyInitialized = function() { - var events = $._data(document, 'events'); - return events && events.click && $.grep(events.click, function(e) { return e.namespace === 'rails'; }).length; - } +(function() { + 'use strict'; + + var jqueryUjsInit = function($, undefined) { - if ( alreadyInitialized() ) { + // Cut down on the number of issues from people inadvertently including jquery_ujs twice + // by detecting and raising an error when it happens. + if ( $.rails !== undefined ) { $.error('jquery-ujs has already been loaded!'); } // Shorthand to make it a little easier to call public rails functions from within rails.js var rails; + var $document = $(document); $.rails = rails = { // Link elements bound by jquery-ujs - linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]', + linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]:not([disabled]), a[data-disable-with], a[data-disable]', + + // Button elements bound by jquery-ujs + buttonClickSelector: 'button[data-remote]:not([form]):not(form button), button[data-confirm]:not([form]):not(form button)', // Select elements bound by jquery-ujs inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]', // Form elements bound by jquery-ujs - formSubmitSelector: 'form', + formSubmitSelector: 'form:not([data-turbo=true])', // Form input elements bound by jquery-ujs - formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form button:not([type])', + formInputClickSelector: 'form:not([data-turbo=true]) input[type=submit], form:not([data-turbo=true]) input[type=image], form:not([data-turbo=true]) button[type=submit], form:not([data-turbo=true]) button:not([type]), input[type=submit][form], input[type=image][form], button[type=submit][form], button[form]:not([type])', // Form input elements disabled during form submission - disableSelector: 'input[data-disable-with], button[data-disable-with], textarea[data-disable-with]', + disableSelector: 'input[data-disable-with]:enabled, button[data-disable-with]:enabled, textarea[data-disable-with]:enabled, input[data-disable]:enabled, button[data-disable]:enabled, textarea[data-disable]:enabled', // Form input elements re-enabled after form submission - enableSelector: 'input[data-disable-with]:disabled, button[data-disable-with]:disabled, textarea[data-disable-with]:disabled', + enableSelector: 'input[data-disable-with]:disabled, button[data-disable-with]:disabled, textarea[data-disable-with]:disabled, input[data-disable]:disabled, button[data-disable]:disabled, textarea[data-disable]:disabled', // Form required input elements - requiredInputSelector: 'input[name][required]:not([disabled]),textarea[name][required]:not([disabled])', + requiredInputSelector: 'input[name][required]:not([disabled]), textarea[name][required]:not([disabled])', // Form file input elements - fileInputSelector: 'input:file', + fileInputSelector: 'input[name][type=file]:not([disabled])', // Link onClick disable selector with possible reenable after remote submission - linkDisableSelector: 'a[data-disable-with]', + linkDisableSelector: 'a[data-disable-with], a[data-disable]', + + // Button onClick disable selector with possible reenable after remote submission + buttonDisableSelector: 'button[data-remote][data-disable-with], button[data-remote][data-disable]', + + // Up-to-date Cross-Site Request Forgery token + csrfToken: function() { + return $('meta[name=csrf-token]').attr('content'); + }, + + // URL param that must contain the CSRF token + csrfParam: function() { + return $('meta[name=csrf-param]').attr('content'); + }, // Make sure that every Ajax request sends the CSRF token CSRFProtection: function(xhr) { - var token = $('meta[name="csrf-token"]').attr('content'); + var token = rails.csrfToken(); if (token) xhr.setRequestHeader('X-CSRF-Token', token); }, + // Make sure that all forms have actual up-to-date tokens (cached forms contain old ones) + refreshCSRFTokens: function(){ + $('form input[name="' + rails.csrfParam() + '"]').val(rails.csrfToken()); + }, + // Triggers an event on an element and returns false if the event result is false fire: function(obj, name, data) { var event = $.Event(name); @@ -112,34 +99,44 @@ // Default way to get an element's href. May be overridden at $.rails.href. href: function(element) { - return element.attr('href'); + return element[0].href; + }, + + // Checks "data-remote" if true to handle the request through a XHR request. + isRemote: function(element) { + return element.data('remote') !== undefined && element.data('remote') !== false; }, // Submits "remote" forms and links with ajax handleRemote: function(element) { - var method, url, data, elCrossDomain, crossDomain, withCredentials, dataType, options; + var method, url, data, withCredentials, dataType, options; if (rails.fire(element, 'ajax:before')) { - elCrossDomain = element.data('cross-domain'); - crossDomain = elCrossDomain === undefined ? null : elCrossDomain; withCredentials = element.data('with-credentials') || null; dataType = element.data('type') || ($.ajaxSettings && $.ajaxSettings.dataType); if (element.is('form')) { - method = element.attr('method'); - url = element.attr('action'); - data = element.serializeArray(); + method = element.data('ujs:submit-button-formmethod') || element.attr('method'); + url = element.data('ujs:submit-button-formaction') || element.attr('action'); + data = $(element[0]).serializeArray(); // memoized value from clicked submit button var button = element.data('ujs:submit-button'); if (button) { data.push(button); element.data('ujs:submit-button', null); } + element.data('ujs:submit-button-formmethod', null); + element.data('ujs:submit-button-formaction', null); } else if (element.is(rails.inputChangeSelector)) { method = element.data('method'); url = element.data('url'); data = element.serialize(); - if (element.data('params')) data = data + "&" + element.data('params'); + if (element.data('params')) data = data + '&' + element.data('params'); + } else if (element.is(rails.buttonClickSelector)) { + method = element.data('method') || 'get'; + url = element.data('url'); + data = element.serialize(); + if (element.data('params')) data = data + '&' + element.data('params'); } else { method = element.data('method'); url = rails.href(element); @@ -153,7 +150,11 @@ if (settings.dataType === undefined) { xhr.setRequestHeader('accept', '*/*;q=0.5, ' + settings.accepts.script); } - return rails.fire(element, 'ajax:beforeSend', [xhr, settings]); + if (rails.fire(element, 'ajax:beforeSend', [xhr, settings])) { + element.trigger('ajax:send', xhr); + } else { + return false; + } }, success: function(data, status, xhr) { element.trigger('ajax:success', [data, status, xhr]); @@ -164,69 +165,125 @@ error: function(xhr, status, error) { element.trigger('ajax:error', [xhr, status, error]); }, - xhrFields: { - withCredentials: withCredentials - }, - crossDomain: crossDomain + crossDomain: rails.isCrossDomain(url) }; + + // There is no withCredentials for IE6-8 when + // "Enable native XMLHTTP support" is disabled + if (withCredentials) { + options.xhrFields = { + withCredentials: withCredentials + }; + } + // Only pass url to `ajax` options if not blank if (url) { options.url = url; } - var jqxhr = rails.ajax(options); - element.trigger('ajax:send', jqxhr); - return jqxhr; + return rails.ajax(options); } else { return false; } }, + // Determines if the request is a cross domain request. + isCrossDomain: function(url) { + var originAnchor = document.createElement('a'); + originAnchor.href = location.href; + var urlAnchor = document.createElement('a'); + + try { + urlAnchor.href = url; + // This is a workaround to a IE bug. + urlAnchor.href = urlAnchor.href; + + // If URL protocol is false or is a string containing a single colon + // *and* host are false, assume it is not a cross-domain request + // (should only be the case for IE7 and IE compatibility mode). + // Otherwise, evaluate protocol and host of the URL against the origin + // protocol and host. + return !(((!urlAnchor.protocol || urlAnchor.protocol === ':') && !urlAnchor.host) || + (originAnchor.protocol + '//' + originAnchor.host === + urlAnchor.protocol + '//' + urlAnchor.host)); + } catch (e) { + // If there is an error parsing the URL, assume it is crossDomain. + return true; + } + }, + // Handles "data-method" on links such as: // Delete handleMethod: function(link) { var href = rails.href(link), method = link.data('method'), target = link.attr('target'), - csrf_token = $('meta[name=csrf-token]').attr('content'), - csrf_param = $('meta[name=csrf-param]').attr('content'), + csrfToken = rails.csrfToken(), + csrfParam = rails.csrfParam(), form = $('

'), - metadata_input = ''; + metadataInput = ''; - if (csrf_param !== undefined && csrf_token !== undefined) { - metadata_input += ''; + if (csrfParam !== undefined && csrfToken !== undefined && !rails.isCrossDomain(href)) { + metadataInput += ''; } if (target) { form.attr('target', target); } - form.hide().append(metadata_input).appendTo('body'); + form.hide().append(metadataInput).appendTo('body'); form.submit(); }, + // Helper function that returns form elements that match the specified CSS selector + // If form is actually a "form" element this will return associated elements outside the from that have + // the html form attribute set + formElements: function(form, selector) { + return form.is('form') ? $(form[0].elements).filter(selector) : form.find(selector); + }, + /* Disables form elements: - Caches element value in 'ujs:enable-with' data store - Replaces element text with value of 'data-disable-with' attribute - Sets disabled property to true */ disableFormElements: function(form) { - form.find(rails.disableSelector).each(function() { - var element = $(this), method = element.is('button') ? 'html' : 'val'; - element.data('ujs:enable-with', element[method]()); - element[method](element.data('disable-with')); - element.prop('disabled', true); + rails.formElements(form, rails.disableSelector).each(function() { + rails.disableFormElement($(this)); }); }, + disableFormElement: function(element) { + var method, replacement; + + method = element.is('button') ? 'html' : 'val'; + replacement = element.data('disable-with'); + + if (replacement !== undefined) { + element.data('ujs:enable-with', element[method]()); + element[method](replacement); + } + + element.prop('disabled', true); + element.data('ujs:disabled', true); + }, + /* Re-enables disabled form elements: - Replaces element text with cached value from 'ujs:enable-with' data store (created in `disableFormElements`) - Sets disabled property to false */ enableFormElements: function(form) { - form.find(rails.enableSelector).each(function() { - var element = $(this), method = element.is('button') ? 'html' : 'val'; - if (element.data('ujs:enable-with')) element[method](element.data('ujs:enable-with')); - element.prop('disabled', false); + rails.formElements(form, rails.enableSelector).each(function() { + rails.enableFormElement($(this)); }); }, + enableFormElement: function(element) { + var method = element.is('button') ? 'html' : 'val'; + if (element.data('ujs:enable-with') !== undefined) { + element[method](element.data('ujs:enable-with')); + element.removeData('ujs:enable-with'); // clean up cache + } + element.prop('disabled', false); + element.removeData('ujs:disabled'); + }, + /* For 'data-confirm' attribute: - Fires `confirm` event - Shows the confirmation dialog @@ -243,7 +300,11 @@ if (!message) { return true; } if (rails.fire(element, 'confirm')) { - answer = rails.confirm(message); + try { + answer = rails.confirm(message); + } catch (e) { + (console.error || console.log).call(console, e.stack || e); + } callback = rails.fire(element, 'confirm:complete', [answer]); } return answer && callback; @@ -251,25 +312,45 @@ // Helper function which checks for blank inputs in a form that match the specified CSS selector blankInputs: function(form, specifiedSelector, nonBlank) { - var inputs = $(), input, valueToCheck, - selector = specifiedSelector || 'input,textarea', - allInputs = form.find(selector); - - allInputs.each(function() { + var foundInputs = $(), + input, + valueToCheck, + radiosForNameWithNoneSelected, + radioName, + selector = specifiedSelector || 'input,textarea', + requiredInputs = form.find(selector), + checkedRadioButtonNames = {}; + + requiredInputs.each(function() { input = $(this); - valueToCheck = input.is(':checkbox,:radio') ? input.is(':checked') : input.val(); - // If nonBlank and valueToCheck are both truthy, or nonBlank and valueToCheck are both falsey - if (!valueToCheck === !nonBlank) { + if (input.is('input[type=radio]')) { - // Don't count unchecked required radio if other radio with same name is checked - if (input.is(':radio') && allInputs.filter('input:radio:checked[name="' + input.attr('name') + '"]').length) { - return true; // Skip to next input - } + // Don't count unchecked required radio as blank if other radio with same name is checked, + // regardless of whether same-name radio input has required attribute or not. The spec + // states https://www.w3.org/TR/html5/forms.html#the-required-attribute + radioName = input.attr('name'); + + // Skip if we've already seen the radio with this name. + if (!checkedRadioButtonNames[radioName]) { + + // If none checked + if (form.find('input[type=radio]:checked[name="' + radioName + '"]').length === 0) { + radiosForNameWithNoneSelected = form.find( + 'input[type=radio][name="' + radioName + '"]'); + foundInputs = foundInputs.add(radiosForNameWithNoneSelected); + } - inputs = inputs.add(input); + // We only need to check each name once. + checkedRadioButtonNames[radioName] = radioName; + } + } else { + valueToCheck = input.is('input[type=checkbox],input[type=radio]') ? input.is(':checked') : !!input.val(); + if (valueToCheck === nonBlank) { + foundInputs = foundInputs.add(input); + } } }); - return inputs.length ? inputs : false; + return foundInputs.length ? foundInputs : false; }, // Helper function which checks for non-blank inputs in a form that match the specified CSS selector @@ -284,146 +365,201 @@ return false; }, - // find all the submit events directly bound to the form and - // manually invoke them. If anyone returns false then stop the loop - callFormSubmitBindings: function(form, event) { - var events = form.data('events'), continuePropagation = true; - if (events !== undefined && events['submit'] !== undefined) { - $.each(events['submit'], function(i, obj){ - if (typeof obj.handler === 'function') return continuePropagation = obj.handler(event); - }); - } - return continuePropagation; - }, - - // replace element's html with the 'data-disable-with' after storing original html + // Replace element's html with the 'data-disable-with' after storing original html // and prevent clicking on it disableElement: function(element) { - element.data('ujs:enable-with', element.html()); // store enabled state - element.html(element.data('disable-with')); // set to disabled state - element.bind('click.railsDisable', function(e) { // prevent further clicking + var replacement = element.data('disable-with'); + + if (replacement !== undefined) { + element.data('ujs:enable-with', element.html()); // store enabled state + element.html(replacement); + } + + element.on('click.railsDisable', function(e) { // prevent further clicking return rails.stopEverything(e); }); + element.data('ujs:disabled', true); }, - // restore element to its original state which was disabled by 'disableElement' above + // Restore element to its original state which was disabled by 'disableElement' above enableElement: function(element) { if (element.data('ujs:enable-with') !== undefined) { element.html(element.data('ujs:enable-with')); // set to old enabled state - // this should be element.removeData('ujs:enable-with') - // but, there is currently a bug in jquery which makes hyphenated data attributes not get removed - element.data('ujs:enable-with', false); // clean up cache + element.removeData('ujs:enable-with'); // clean up cache } - element.unbind('click.railsDisable'); // enable element + element.off('click.railsDisable'); // enable element + element.removeData('ujs:disabled'); } - }; - if (rails.fire($(document), 'rails:attachBindings')) { + if (rails.fire($document, 'rails:attachBindings')) { $.ajaxPrefilter(function(options, originalOptions, xhr){ if ( !options.crossDomain ) { rails.CSRFProtection(xhr); }}); - $(document).delegate(rails.linkDisableSelector, 'ajax:complete', function() { + // This event works the same as the load event, except that it fires every + // time the page is loaded. + // + // See https://github.com/rails/jquery-ujs/issues/357 + // See https://developer.mozilla.org/en-US/docs/Using_Firefox_1.5_caching + $(window).on('pageshow.rails', function () { + $($.rails.enableSelector).each(function () { + var element = $(this); + + if (element.data('ujs:disabled')) { + $.rails.enableFormElement(element); + } + }); + + $($.rails.linkDisableSelector).each(function () { + var element = $(this); + + if (element.data('ujs:disabled')) { + $.rails.enableElement(element); + } + }); + }); + + $document.on('ajax:complete', rails.linkDisableSelector, function() { rails.enableElement($(this)); }); - $(document).delegate(rails.linkClickSelector, 'click.rails', function(e) { - var link = $(this), method = link.data('method'), data = link.data('params'); + $document.on('ajax:complete', rails.buttonDisableSelector, function() { + rails.enableFormElement($(this)); + }); + + $document.on('click.rails', rails.linkClickSelector, function(e) { + var link = $(this), method = link.data('method'), data = link.data('params'), metaClick = e.metaKey || e.ctrlKey; if (!rails.allowAction(link)) return rails.stopEverything(e); - if (link.is(rails.linkDisableSelector)) rails.disableElement(link); + if (!metaClick && link.is(rails.linkDisableSelector)) rails.disableElement(link); - if (link.data('remote') !== undefined) { - if ( (e.metaKey || e.ctrlKey) && (!method || method === 'GET') && !data ) { return true; } + if (rails.isRemote(link)) { + if (metaClick && (!method || method === 'GET') && !data) { return true; } var handleRemote = rails.handleRemote(link); - // response from rails.handleRemote() will either be false or a deferred object promise. + // Response from rails.handleRemote() will either be false or a deferred object promise. if (handleRemote === false) { rails.enableElement(link); } else { - handleRemote.error( function() { rails.enableElement(link); } ); + handleRemote.fail( function() { rails.enableElement(link); } ); } return false; - } else if (link.data('method')) { + } else if (method) { rails.handleMethod(link); return false; } }); - $(document).delegate(rails.inputChangeSelector, 'change.rails', function(e) { + $document.on('click.rails', rails.buttonClickSelector, function(e) { + var button = $(this); + + if (!rails.allowAction(button) || !rails.isRemote(button)) return rails.stopEverything(e); + + if (button.is(rails.buttonDisableSelector)) rails.disableFormElement(button); + + var handleRemote = rails.handleRemote(button); + // Response from rails.handleRemote() will either be false or a deferred object promise. + if (handleRemote === false) { + rails.enableFormElement(button); + } else { + handleRemote.fail( function() { rails.enableFormElement(button); } ); + } + return false; + }); + + $document.on('change.rails', rails.inputChangeSelector, function(e) { var link = $(this); - if (!rails.allowAction(link)) return rails.stopEverything(e); + if (!rails.allowAction(link) || !rails.isRemote(link)) return rails.stopEverything(e); rails.handleRemote(link); return false; }); - $(document).delegate(rails.formSubmitSelector, 'submit.rails', function(e) { + $document.on('submit.rails', rails.formSubmitSelector, function(e) { var form = $(this), - remote = form.data('remote') !== undefined, - blankRequiredInputs = rails.blankInputs(form, rails.requiredInputSelector), - nonBlankFileInputs = rails.nonBlankInputs(form, rails.fileInputSelector); + remote = rails.isRemote(form), + blankRequiredInputs, + nonBlankFileInputs; if (!rails.allowAction(form)) return rails.stopEverything(e); - // skip other logic when required values are missing or file upload is present - if (blankRequiredInputs && form.attr("novalidate") == undefined && rails.fire(form, 'ajax:aborted:required', [blankRequiredInputs])) { - return rails.stopEverything(e); + // Skip other logic when required values are missing or file upload is present + if (form.attr('novalidate') === undefined) { + if (form.data('ujs:formnovalidate-button') === undefined) { + blankRequiredInputs = rails.blankInputs(form, rails.requiredInputSelector, false); + if (blankRequiredInputs && rails.fire(form, 'ajax:aborted:required', [blankRequiredInputs])) { + return rails.stopEverything(e); + } + } else { + // Clear the formnovalidate in case the next button click is not on a formnovalidate button + // Not strictly necessary to do here, since it is also reset on each button click, but just to be certain + form.data('ujs:formnovalidate-button', undefined); + } } if (remote) { + nonBlankFileInputs = rails.nonBlankInputs(form, rails.fileInputSelector); if (nonBlankFileInputs) { - // slight timeout so that the submit button gets properly serialized + // Slight timeout so that the submit button gets properly serialized // (make it easy for event handler to serialize form without disabled values) setTimeout(function(){ rails.disableFormElements(form); }, 13); var aborted = rails.fire(form, 'ajax:aborted:file', [nonBlankFileInputs]); - // re-enable form elements if event bindings return false (canceling normal form submission) + // Re-enable form elements if event bindings return false (canceling normal form submission) if (!aborted) { setTimeout(function(){ rails.enableFormElements(form); }, 13); } return aborted; } - // If browser does not support submit bubbling, then this live-binding will be called before direct - // bindings. Therefore, we should directly call any direct bindings before remotely submitting form. - if (!$.support.submitBubbles && $().jquery < '1.7' && rails.callFormSubmitBindings(form, e) === false) return rails.stopEverything(e); - rails.handleRemote(form); return false; } else { - // slight timeout so that the submit button gets properly serialized + // Slight timeout so that the submit button gets properly serialized setTimeout(function(){ rails.disableFormElements(form); }, 13); } }); - $(document).delegate(rails.formInputClickSelector, 'click.rails', function(event) { + $document.on('click.rails', rails.formInputClickSelector, function(event) { var button = $(this); if (!rails.allowAction(button)) return rails.stopEverything(event); - // register the pressed submit button + // Register the pressed submit button var name = button.attr('name'), data = name ? {name:name, value:button.val()} : null; - button.closest('form').data('ujs:submit-button', data); + var form = button.closest('form'); + if (form.length === 0) { + form = $('#' + button.attr('form')); + } + form.data('ujs:submit-button', data); + + // Save attributes from button + form.data('ujs:formnovalidate-button', button.attr('formnovalidate')); + form.data('ujs:submit-button-formaction', button.attr('formaction')); + form.data('ujs:submit-button-formmethod', button.attr('formmethod')); }); - $(document).delegate(rails.formSubmitSelector, 'ajax:beforeSend.rails', function(event) { - if (this == event.target) rails.disableFormElements($(this)); + $document.on('ajax:send.rails', rails.formSubmitSelector, function(event) { + if (this === event.target) rails.disableFormElements($(this)); }); - $(document).delegate(rails.formSubmitSelector, 'ajax:complete.rails', function(event) { - if (this == event.target) rails.enableFormElements($(this)); + $document.on('ajax:complete.rails', rails.formSubmitSelector, function(event) { + if (this === event.target) rails.enableFormElements($(this)); }); $(function(){ - // making sure that all forms have actual up-to-date token(cached forms contain old one) - csrf_token = $('meta[name=csrf-token]').attr('content'); - csrf_param = $('meta[name=csrf-param]').attr('content'); - $('form input[name="' + csrf_param + '"]').val(csrf_token); + rails.refreshCSRFTokens(); }); } -})( jQuery ); + }; + + if (window.jQuery) { + jqueryUjsInit(jQuery); + } else if (typeof exports === 'object' && typeof module === 'object') { + module.exports = jqueryUjsInit; + } +})(); diff --git a/test/public/test/call-remote-callbacks.js b/test/public/test/call-remote-callbacks.js index ecba5013..7dd1d6ac 100644 --- a/test/public/test/call-remote-callbacks.js +++ b/test/public/test/call-remote-callbacks.js @@ -7,29 +7,43 @@ module('call-remote-callbacks', { })); }, teardown: function() { - $('form[data-remote]').die('ajax:beforeSend'); - $('form[data-remote]').die('ajax:before'); - $('form[data-remote]').die('ajax:complete'); - $('form[data-remote]').die('ajax:success'); + $(document).off('ajax:beforeSend', 'form[data-remote]'); + $(document).off('ajax:before', 'form[data-remote]'); + $(document).off('ajax:send', 'form[data-remote]'); + $(document).off('ajax:complete', 'form[data-remote]'); + $(document).off('ajax:success', 'form[data-remote]'); + $(document).off('ajaxStop'); + $(document).off('iframe:loading'); } }); +function start_after_submit(form) { + form.on('ajax:complete', function() { + ok(true, 'ajax:complete'); + start(); + }); +} + function submit(fn) { - var form = $('form') - .bind('ajax:complete', function(){ - ok(true, 'ajax:complete'); - start(); - }); + var form = $('form'); + start_after_submit(form); if (fn) fn(form); form.trigger('submit'); } +function submit_with_button(submit_button) { + var form = $('form'); + start_after_submit(form); + + submit_button.trigger('click'); +} + asyncTest('modifying form fields with "ajax:before" sends modified data in request', 4, function(){ $('form[data-remote]') .append($('')) .append($('')) - .live('ajax:before', function() { + .on('ajax:before', function() { var form = $(this); form .append($('',{name: 'other_user_name',value: 'jonathan'})) @@ -39,7 +53,7 @@ asyncTest('modifying form fields with "ajax:before" sends modified data in reque }); submit(function(form) { - form.bind('ajax:success', function(e, data, status, xhr) { + form.on('ajax:success', function(e, data, status, xhr) { equal(data.params.user_name, 'steve', 'modified field value should have been submitted'); equal(data.params.other_user_name, 'jonathan', 'added field value should have been submitted'); equal(data.params.removed_user_name, undefined, 'removed field value should be undefined'); @@ -49,41 +63,27 @@ asyncTest('modifying form fields with "ajax:before" sends modified data in reque asyncTest('modifying data("type") with "ajax:before" requests new dataType in request', 2, function(){ $('form[data-remote]').data('type','html') - .live('ajax:before', function() { + .on('ajax:before', function() { var form = $(this); - form.data('type','xml') + form.data('type','xml'); }); submit(function(form) { - form.bind('ajax:beforeSend', function(e, xhr, settings) { + form.on('ajax:beforeSend', function(e, xhr, settings) { equal(settings.dataType, 'xml', 'modified dataType should have been requested'); }); }); }); -asyncTest('setting data("cross-domain",true) with "ajax:before" uses new setting in request', 2, function(){ - $('form[data-remote]').data('cross-domain',false) - .live('ajax:before', function() { - var form = $(this); - form.data('cross-domain',true) - }); - - submit(function(form) { - form.bind('ajax:beforeSend', function(e, xhr, settings) { - equal(settings.crossDomain, true, 'setting modified in ajax:before should have forced cross-domain request'); - }); - }); -}); - asyncTest('setting data("with-credentials",true) with "ajax:before" uses new setting in request', 2, function(){ $('form[data-remote]').data('with-credentials',false) - .live('ajax:before', function() { + .on('ajax:before', function() { var form = $(this); form.data('with-credentials',true); }); submit(function(form) { - form.bind('ajax:beforeSend', function(e, xhr, settings) { + form.on('ajax:beforeSend', function(e, xhr, settings) { equal(settings.xhrFields && settings.xhrFields.withCredentials, true, 'setting modified in ajax:before should have forced withCredentials request'); }); }); @@ -91,33 +91,37 @@ asyncTest('setting data("with-credentials",true) with "ajax:before" uses new set asyncTest('stopping the "ajax:beforeSend" event aborts the request', 1, function() { submit(function(form) { - form.bind('ajax:beforeSend', function() { - ok(true, 'aborting request in ajax:beforeSend') + form.on('ajax:beforeSend', function() { + ok(true, 'aborting request in ajax:beforeSend'); return false; }); - form.unbind('ajax:complete').bind('ajax:complete', function() { + form.off('ajax:send').on('ajax:send', function() { + ok(false, 'ajax:send should not run'); + }); + form.off('ajax:complete').on('ajax:complete', function() { ok(false, 'ajax:complete should not run'); }); - form.bind('ajax:error', function(e, xhr, status, error) { + form.on('ajax:error', function(e, xhr, status, error) { ok(false, 'ajax:error should not run'); }); - form.bind('ajaxStop', function() { + $(document).on('ajaxStop', function() { start(); }); }); }); asyncTest('blank required form input field should abort request and trigger "ajax:aborted:required" event', 5, function() { + $(document).on('iframe:loading', function() { + ok(false, 'form should not get submitted'); + }); + var form = $('form[data-remote]') .append($('')) .append($('')) - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(false, 'ajax:beforeSend should not run'); }) - .bind('iframe:loading', function() { - ok(false, 'form should not get submitted'); - }) - .bind('ajax:aborted:required', function(e,data){ + .on('ajax:aborted:required', function(e,data){ ok(data.length == 2, 'ajax:aborted:required event is passed all blank required inputs (jQuery objects)'); ok(data.first().is('input[name="user_name"]') , 'ajax:aborted:required adds blank required input to data'); ok(data.last().is('textarea[name="user_bio"]'), 'ajax:aborted:required adds blank required textarea to data'); @@ -127,7 +131,7 @@ asyncTest('blank required form input field should abort request and trigger "aja setTimeout(function() { form.find('input[required],textarea[required]').val('Tyler'); - form.unbind('ajax:beforeSend'); + form.off('ajax:beforeSend'); submit(); }, 13); }); @@ -136,7 +140,7 @@ asyncTest('blank required form input for non-remote form should abort normal sub var form = $('form[data-remote]') .append($('')) .removeAttr('data-remote') - .bind('ujs:everythingStopped', function() { + .on('ujs:everythingStopped', function() { ok(true, 'ujs:everythingStopped should run'); }) .trigger('submit'); @@ -149,10 +153,10 @@ asyncTest('blank required form input for non-remote form should abort normal sub asyncTest('form should be submitted with blank required fields if handler is bound to "ajax:aborted:required" event that returns false', 1, function(){ var form = $('form[data-remote]') .append($('')) - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(true, 'ajax:beforeSend should run'); }) - .bind('ajax:aborted:required', function() { + .on('ajax:aborted:required', function() { return false; }) .trigger('submit'); @@ -166,10 +170,10 @@ asyncTest('disabled fields should not be included in blank required check', 2, f var form = $('form[data-remote]') .append($('')) .append($('')) - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(true, 'ajax:beforeSend should run'); }) - .bind('ajax:aborted:required', function() { + .on('ajax:aborted:required', function() { ok(false, 'ajax:aborted:required should not run'); }); @@ -180,24 +184,40 @@ asyncTest('form should be submitted with blank required fields if it has the "no var form = $('form[data-remote]') .append($('')) .attr("novalidate", "novalidate") - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(true, 'ajax:beforeSend should run'); }) - .bind('ajax:aborted:required', function() { + .on('ajax:aborted:required', function() { ok(false, 'ajax:aborted:required should not run'); }); submit(); }); +asyncTest('form should be submitted with blank required fields if the button has the "formnovalidate" attribute', 2, function(){ + var submit_button = $(''); + var form = $('form[data-remote]') + .append($('')) + .append(submit_button) + .on('ajax:beforeSend', function() { + ok(true, 'ajax:beforeSend should run'); + }) + .on('ajax:aborted:required', function() { + ok(false, 'ajax:aborted:required should not run'); + }); + + submit_with_button(submit_button); +}); + asyncTest('blank required form input for non-remote form with "novalidate" attribute should not abort normal submission', 1, function() { + $(document).on('iframe:loading', function() { + ok(true, 'form should get submitted'); + }); + var form = $('form[data-remote]') .append($('')) .removeAttr('data-remote') .attr("novalidate","novalidate") - .bind('iframe:loading', function() { - ok(true, 'form should get submitted'); - }) .trigger('submit'); setTimeout(function() { @@ -209,7 +229,7 @@ asyncTest('unchecked required checkbox should abort form submission', 1, functio var form = $('form[data-remote]') .append($('')) .removeAttr('data-remote') - .bind('ujs:everythingStopped', function() { + .on('ujs:everythingStopped', function() { ok(true, 'ujs:everythingStopped should run'); }) .trigger('submit'); @@ -221,10 +241,10 @@ asyncTest('unchecked required checkbox should abort form submission', 1, functio asyncTest('unchecked required radio should abort form submission', 1, function() { var form = $('form[data-remote]') - .append($('')) - .append($('')) + .append($('')) + .append($('')) .removeAttr('data-remote') - .bind('ujs:everythingStopped', function() { + .on('ujs:everythingStopped', function() { ok(true, 'ujs:everythingStopped should run'); }) .trigger('submit'); @@ -235,14 +255,40 @@ asyncTest('unchecked required radio should abort form submission', 1, function() }); asyncTest('required radio should only require one to be checked', 1, function() { + $(document).on('iframe:loading', function() { + ok(true, 'form should get submitted'); + }); + var form = $('form[data-remote]') .append($('')) .append($('')) .removeAttr('data-remote') - .bind('iframe:loading', function() { - ok(true, 'form should get submitted'); + .on('ujs:everythingStopped', function() { + ok(false, 'ujs:everythingStopped should not run'); }) - .bind('ujs:everythingStopped', function() { + .find('#checkme').prop('checked', true) + .end() + .trigger('submit'); + + setTimeout(function() { + start(); + }, 13); +}); + +asyncTest('required radio should only require one to be checked if not all radios are required', 1, function() { + $(document).on('iframe:loading', function() { + ok(true, 'form should get submitted'); + }); + + var form = $('form[data-remote]') + // Check the radio that is not required + .append($('')) + // Check the radio that is not required + .append($('')) + // Only one needs to be required + .append($('')) + .removeAttr('data-remote') + .on('ujs:everythingStopped', function() { ok(false, 'ujs:everythingStopped should not run'); }) .find('#checkme').prop('checked', true) @@ -261,13 +307,13 @@ function skipIt() { asyncTest('non-blank file form input field should abort remote request, but submit normally', 5, function() { var form = $('form[data-remote]') .append($('')) - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(false, 'ajax:beforeSend should not run'); }) - .bind('iframe:loading', function() { + .on('iframe:loading', function() { ok(true, 'form should get submitted'); }) - .bind('ajax:aborted:file', function(e,data) { + .on('ajax:aborted:file', function(e,data) { ok(data.length == 1, 'ajax:aborted:file event is passed all non-blank file inputs (jQuery objects)'); ok(data.first().is('input[name="attachment"]') , 'ajax:aborted:file adds non-blank file input to data'); ok(true, 'ajax:aborted:file event should run'); @@ -276,7 +322,28 @@ function skipIt() { setTimeout(function() { form.find('input[type="file"]').val(''); - form.unbind('ajax:beforeSend'); + form.off('ajax:beforeSend'); + submit(); + }, 13); + }); + + asyncTest('file form input field should not abort remote request if file form input does not have a name attribute', 5, function() { + var form = $('form[data-remote]') + .append($('')) + .on('ajax:beforeSend', function() { + ok(true, 'ajax:beforeSend should run'); + }) + .on('iframe:loading', function() { + ok(true, 'form should get submitted'); + }) + .on('ajax:aborted:file', function(e,data) { + ok(false, 'ajax:aborted:file should not run'); + }) + .trigger('submit'); + + setTimeout(function() { + form.find('input[type="file"]').val(''); + form.off('ajax:beforeSend'); submit(); }, 13); }); @@ -284,87 +351,99 @@ function skipIt() { asyncTest('blank file input field should abort request entirely if handler bound to "ajax:aborted:file" event that returns false', 1, function() { var form = $('form[data-remote]') .append($('')) - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(false, 'ajax:beforeSend should not run'); }) - .bind('iframe:loading', function() { + .on('iframe:loading', function() { ok(false, 'form should not get submitted'); }) - .bind('ajax:aborted:file', function() { + .on('ajax:aborted:file', function() { return false; }) .trigger('submit'); setTimeout(function() { form.find('input[type="file"]').val(''); - form.unbind('ajax:beforeSend'); + form.off('ajax:beforeSend'); submit(); }, 13); }); } asyncTest('"ajax:beforeSend" can be observed and stopped with event delegation', 1, function() { - $('form[data-remote]').live('ajax:beforeSend', function() { + $(document).on('ajax:beforeSend', 'form[data-remote]', function() { ok(true, 'ajax:beforeSend observed with event delegation'); return false; }); submit(function(form) { - form.unbind('ajax:complete').bind('ajax:complete', function() { + form.off('ajax:send').on('ajax:send', function() { + ok(false, 'ajax:send should not run'); + }); + form.off('ajax:complete').on('ajax:complete', function() { ok(false, 'ajax:complete should not run'); }); - form.bind('ajaxStop', function() { + $(document).on('ajaxStop', function() { start(); }); }); }); -asyncTest('"ajax:beforeSend", "ajax:success" and "ajax:complete" are triggered', 8, function() { +asyncTest('"ajax:beforeSend", "ajax:send", "ajax:success" and "ajax:complete" are triggered', 9, function() { submit(function(form) { - form.bind('ajax:beforeSend', function(e, xhr, settings) { + form.on('ajax:beforeSend', function(e, xhr, settings) { ok(xhr.setRequestHeader, 'first argument to "ajax:beforeSend" should be an XHR object'); equal(settings.url, '/echo', 'second argument to "ajax:beforeSend" should be a settings object'); }); - form.bind('ajax:success', function(e, data, status, xhr) { + form.on('ajax:send', function(e, xhr) { + ok(xhr.abort, 'first argument to "ajax:send" should be an XHR object'); + }); + form.on('ajax:success', function(e, data, status, xhr) { ok(data.REQUEST_METHOD, 'first argument to ajax:success should be a data object'); equal(status, 'success', 'second argument to ajax:success should be a status string'); ok(xhr.getResponseHeader, 'third argument to "ajax:success" should be an XHR object'); }); - form.bind('ajax:complete', function(e, xhr, status) { + form.on('ajax:complete', function(e, xhr, status) { ok(xhr.getResponseHeader, 'first argument to "ajax:complete" should be an XHR object'); equal(status, 'success', 'second argument to ajax:complete should be a status string'); }); }); }); -asyncTest('"ajax:beforeSend", "ajax:error" and "ajax:complete" are triggered on error', 6, function() { - submit(function(form) { - form.attr('action', '/error'); - form.bind('ajax:beforeSend', function(arg) { ok(true, 'ajax:beforeSend') }); - form.bind('ajax:error', function(e, xhr, status, error) { - ok(xhr.getResponseHeader, 'first argument to "ajax:error" should be an XHR object'); - equal(status, 'error', 'second argument to ajax:error should be a status string'); - // Firefox 8 returns "Forbidden " with trailing space - equal($.trim(error), 'Forbidden', 'third argument to ajax:error should be an HTTP status response'); - // Opera returns "0" for HTTP code - equal(xhr.status, window.opera ? 0 : 403, 'status code should be 403'); +if(window.phantom !== undefined) { + asyncTest('"ajax:beforeSend", "ajax:send", "ajax:error" and "ajax:complete" are triggered on error', 7, function() { + submit(function(form) { + form.attr('action', '/error'); + form.on('ajax:beforeSend', function(arg) { ok(true, 'ajax:beforeSend') }); + form.on('ajax:send', function(arg) { ok(true, 'ajax:send') }); + form.on('ajax:error', function(e, xhr, status, error) { + ok(xhr.getResponseHeader, 'first argument to "ajax:error" should be an XHR object'); + equal(status, 'error', 'second argument to ajax:error should be a status string'); + // Firefox 8 returns "Forbidden " with trailing space + equal($.trim(error), 'Forbidden', 'third argument to ajax:error should be an HTTP status response'); + // Opera returns "0" for HTTP code + equal(xhr.status, window.opera ? 0 : 403, 'status code should be 403'); + }); }); }); -}); +} // IF THIS TEST IS FAILING, TRY INCREASING THE TIMEOUT AT THE BOTTOM TO > 100 -asyncTest('binding to ajax callbacks via .live() triggers handlers properly', 3, function() { - $('form[data-remote]') - .live('ajax:beforeSend', function() { +asyncTest('binding to ajax callbacks via .on() triggers handlers properly', 4, function() { + $(document) + .on('ajax:beforeSend', 'form[data-remote]', function() { ok(true, 'ajax:beforeSend handler is triggered'); }) - .live('ajax:complete', function() { + .on('ajax:send', 'form[data-remote]', function() { + ok(true, 'ajax:send handler is triggered'); + }) + .on('ajax:complete', 'form[data-remote]', function() { ok(true, 'ajax:complete handler is triggered'); }) - .live('ajax:success', function() { + .on('ajax:success', 'form[data-remote]', function() { ok(true, 'ajax:success handler is triggered'); - }) - .trigger('submit'); + }); + $('form[data-remote]').trigger('submit'); setTimeout(function() { start(); diff --git a/test/public/test/call-remote.js b/test/public/test/call-remote.js index ef998a8b..0d9214a0 100644 --- a/test/public/test/call-remote.js +++ b/test/public/test/call-remote.js @@ -1,6 +1,6 @@ (function(){ -function build_form(attrs) { +function buildForm(attrs) { attrs = $.extend({ action: '/echo', 'data-remote': 'true' }, attrs); $('#qunit-fixture').append($('

', attrs)) @@ -11,53 +11,79 @@ module('call-remote'); function submit(fn) { $('form') - .bind('ajax:success', fn) - .bind('ajax:complete', function() { start() }) + .on('ajax:success', fn) + .on('ajax:complete', function() { start() }) .trigger('submit'); } asyncTest('form method is read from "method" and not from "data-method"', 1, function() { - build_form({ method: 'post', 'data-method': 'get' }); + buildForm({ method: 'post', 'data-method': 'get' }); submit(function(e, data, status, xhr) { - App.assert_post_request(data); + App.assertPostRequest(data); }); }); asyncTest('form method is not read from "data-method" attribute in case of missing "method"', 1, function() { - build_form({ 'data-method': 'put' }); + buildForm({ 'data-method': 'put' }); submit(function(e, data, status, xhr) { - App.assert_get_request(data); + App.assertGetRequest(data); }); }); +asyncTest('form method is read from submit button "formmethod" if submit is triggered by that button', 1, function() { + var submitButton = $('') + buildForm({ method: 'post' }); + + $('#qunit-fixture').find('form').append(submitButton) + .on('ajax:success', function(e, data, status, xhr) { + App.assertGetRequest(data); + }) + .on('ajax:complete', function() { start() }); + + submitButton.trigger('click'); +}); + asyncTest('form default method is GET', 1, function() { - build_form(); + buildForm(); submit(function(e, data, status, xhr) { - App.assert_get_request(data); + App.assertGetRequest(data); }); }); asyncTest('form url is picked up from "action"', 1, function() { - build_form({ method: 'post' }); + buildForm({ method: 'post' }); submit(function(e, data, status, xhr) { - App.assert_request_path(data, '/echo'); + App.assertRequestPath(data, '/echo'); }); }); asyncTest('form url is read from "action" not "href"', 1, function() { - build_form({ method: 'post', href: '/echo2' }); + buildForm({ method: 'post', href: '/echo2' }); submit(function(e, data, status, xhr) { - App.assert_request_path(data, '/echo'); + App.assertRequestPath(data, '/echo'); }); }); +asyncTest('form url is read from submit button "formaction" if submit is triggered by that button', 1, function() { + var submitButton = $('') + buildForm({ method: 'post', href: '/echo2' }); + + $('#qunit-fixture').find('form').append(submitButton) + .on('ajax:success', function(e, data, status, xhr) { + App.assertRequestPath(data, '/echo'); + }) + .on('ajax:complete', function() { start() }); + + submitButton.trigger('click'); +}); + asyncTest('prefer JS, but accept any format', 1, function() { - build_form({ method: 'post' }); + buildForm({ method: 'post' }); submit(function(e, data, status, xhr) { var accept = data.HTTP_ACCEPT; @@ -66,7 +92,7 @@ asyncTest('prefer JS, but accept any format', 1, function() { }); asyncTest('accept application/json if "data-type" is json', 1, function() { - build_form({ method: 'post', 'data-type': 'json' }); + buildForm({ method: 'post', 'data-type': 'json' }); submit(function(e, data, status, xhr) { equal(data.HTTP_ACCEPT, 'application/json, text/javascript, */*; q=0.01'); @@ -75,7 +101,7 @@ asyncTest('accept application/json if "data-type" is json', 1, function() { asyncTest('allow empty "data-remote" attribute', 1, function() { var form = $('#qunit-fixture').append($('')).find('form'); - + submit(function() { ok(true, 'form with empty "data-remote" attribute is also allowed'); }); @@ -84,10 +110,10 @@ asyncTest('allow empty "data-remote" attribute', 1, function() { asyncTest('allow empty form "action"', 1, function() { var currentLocation, ajaxLocation; - build_form({ action: '' }); + buildForm({ action: '' }); $('#qunit-fixture').find('form') - .bind('ajax:beforeSend', function(e, xhr, settings) { + .on('ajax:beforeSend', function(e, xhr, settings) { // Get current location (the same way jQuery does) try { currentLocation = location.href; @@ -114,7 +140,7 @@ asyncTest('allow empty form "action"', 1, function() { }); asyncTest('sends CSRF token in custom header', 1, function() { - build_form({ method: 'post' }); + buildForm({ method: 'post' }); $('#qunit-fixture').append(''); submit(function(e, data, status, xhr) { @@ -122,30 +148,14 @@ asyncTest('sends CSRF token in custom header', 1, function() { }); }); -asyncTest('does not send CSRF token in custom header if crossDomain', 1, function() { - build_form({ 'data-cross-domain': 'true' }); - $('#qunit-fixture').append(''); - - // Manually set request header to be XHR, since setting crossDomain: true in .ajax() - // causes jQuery to skip setting the request header, to prevent our test/server.rb from - // raising an an error (when request.xhr? is false). - $('#qunit-fixture').find('form').bind('ajax:beforeSend', function(e, xhr) { - xhr.setRequestHeader('X-Requested-With', "XMLHttpRequest"); - }); - - submit(function(e, data, status, xhr) { - equal(data.HTTP_X_CSRF_TOKEN, undefined, 'X-CSRF-Token header should NOT be sent'); - }); -}); - -asyncTest('intelligently guesses crossDomain behavior when target URL is a different domain', 1, function(e, xhr) { +asyncTest('intelligently guesses crossDomain behavior when target URL has a different protocol and/or hostname', 1, function(e, xhr) { // Don't set data-cross-domain here, just set action to be a different domain than localhost - build_form({ action: 'http://www.alfajango.com' }); + buildForm({ action: 'http://www.alfajango.com' }); $('#qunit-fixture').append(''); $('#qunit-fixture').find('form') - .bind('ajax:beforeSend', function(e, xhr, settings) { + .on('ajax:beforeSend', function(e, xhr, settings) { equal(settings.crossDomain, true, 'crossDomain should be set to true'); @@ -157,13 +167,17 @@ asyncTest('intelligently guesses crossDomain behavior when target URL is a diffe setTimeout(function() { start(); }, 13); }); -asyncTest('does not set crossDomain if explicitly set to false on element', 1, function() { - build_form({ action: 'http://www.alfajango.com', 'data-cross-domain': false }); +asyncTest('intelligently guesses crossDomain behavior when target URL consists of only a path', 1, function(e, xhr) { + + // Don't set data-cross-domain here, just set action to be a different domain than localhost + buildForm({ action: '/just/a/path' }); $('#qunit-fixture').append(''); $('#qunit-fixture').find('form') - .bind('ajax:beforeSend', function(e, xhr, settings) { + .on('ajax:beforeSend', function(e, xhr, settings) { + equal(settings.crossDomain, false, 'crossDomain should be set to false'); + // prevent request from actually getting sent off-domain return false; }) @@ -171,5 +185,4 @@ asyncTest('does not set crossDomain if explicitly set to false on element', 1, f setTimeout(function() { start(); }, 13); }); - })(); diff --git a/test/public/test/csrf-refresh.js b/test/public/test/csrf-refresh.js new file mode 100644 index 00000000..65642433 --- /dev/null +++ b/test/public/test/csrf-refresh.js @@ -0,0 +1,24 @@ +(function(){ + +module('csrf-refresh', {}); + +asyncTest('refresh all csrf tokens', 1, function() { + var correctToken = "cf50faa3fe97702ca1ae"; + + var form = $('') + var input = $('').attr({ type: 'hidden', name: 'authenticity_token', id: 'authenticity_token', value: 'foo' }) + input.appendTo(form) + + $('#qunit-fixture') + .append('') + .append('') + .append(form); + + $.rails.refreshCSRFTokens(); + currentToken = $('#qunit-fixture #authenticity_token').val(); + + start(); + equal(currentToken, correctToken); +}); + +})(); diff --git a/test/public/test/csrf-token.js b/test/public/test/csrf-token.js new file mode 100644 index 00000000..dfed3781 --- /dev/null +++ b/test/public/test/csrf-token.js @@ -0,0 +1,27 @@ +(function(){ + +module('csrf-token', {}); + +asyncTest('find csrf token', 1, function() { + var correctToken = "cf50faa3fe97702ca1ae"; + + $('#qunit-fixture').append(''); + + currentToken = $.rails.csrfToken(); + + start(); + equal(currentToken, correctToken); +}); + +asyncTest('find csrf param', 1, function() { + var correctParam = "authenticity_token"; + + $('#qunit-fixture').append(''); + + currentParam = $.rails.csrfParam(); + + start(); + equal(currentParam, correctParam); +}); + +})(); diff --git a/test/public/test/data-confirm.js b/test/public/test/data-confirm.js index 68784b84..2e905d42 100644 --- a/test/public/test/data-confirm.js +++ b/test/public/test/data-confirm.js @@ -7,6 +7,25 @@ module('data-confirm', { text: 'my social security number' })); + $('#qunit-fixture').append($('', { + 'data-url': '/echo', + 'data-remote': 'true', + 'data-confirm': 'Are you absolutely sure?', + text: 'Click me' + })); + + $('#qunit-fixture').append($('', { + id: 'confirm', + action: '/echo', + 'data-remote': 'true' + })); + + $('#qunit-fixture').append($('', { + type: 'submit', + form: 'confirm', + 'data-confirm': 'Are you absolutely sure?' + })); + this.windowConfirm = window.confirm; }, teardown: function() { @@ -20,14 +39,35 @@ asyncTest('clicking on a link with data-confirm attribute. Confirm yes.', 6, fun window.confirm = function(msg) { message = msg; return true }; $('a[data-confirm]') - .bind('confirm:complete', function(e, data) { - App.assert_callback_invoked('confirm:complete'); + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); + ok(data == true, 'confirm:complete passes in confirm answer (true)'); + }) + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); + App.assertGetRequest(data); + + equal(message, 'Are you absolutely sure?'); + start(); + }) + .trigger('click'); +}); + +asyncTest('clicking on a button with data-confirm attribute. Confirm yes.', 6, function() { + var message; + // auto-confirm: + window.confirm = function(msg) { message = msg; return true }; + + $('button[data-confirm]') + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); ok(data == true, 'confirm:complete passes in confirm answer (true)'); }) - .bind('ajax:success', function(e, data, status, xhr) { - App.assert_callback_invoked('ajax:success'); - App.assert_request_path(data, '/echo'); - App.assert_get_request(data); + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); + App.assertGetRequest(data); equal(message, 'Are you absolutely sure?'); start(); @@ -41,12 +81,33 @@ asyncTest('clicking on a link with data-confirm attribute. Confirm No.', 3, func window.confirm = function(msg) { message = msg; return false }; $('a[data-confirm]') - .bind('confirm:complete', function(e, data) { - App.assert_callback_invoked('confirm:complete'); + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); + ok(data == false, 'confirm:complete passes in confirm answer (false)'); + }) + .on('ajax:beforeSend', function(e, data, status, xhr) { + App.assertCallbackNotInvoked('ajax:beforeSend'); + }) + .trigger('click'); + + setTimeout(function() { + equal(message, 'Are you absolutely sure?'); + start(); + }, 50); +}); + +asyncTest('clicking on a button with data-confirm attribute. Confirm No.', 3, function() { + var message; + // auto-decline: + window.confirm = function(msg) { message = msg; return false }; + + $('button[data-confirm]') + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); ok(data == false, 'confirm:complete passes in confirm answer (false)'); }) - .bind('ajax:beforeSend', function(e, data, status, xhr) { - App.assert_callback_not_invoked('ajax:beforeSend'); + .on('ajax:beforeSend', function(e, data, status, xhr) { + App.assertCallbackNotInvoked('ajax:beforeSend'); }) .trigger('click'); @@ -56,20 +117,61 @@ asyncTest('clicking on a link with data-confirm attribute. Confirm No.', 3, func }, 50); }); +asyncTest('clicking on a button with data-confirm attribute. Confirm error.', 3, function() { + var message; + // auto-decline: + window.confirm = function(msg) { message = msg; throw "some random error"; }; + + $('button[data-confirm]') + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); + ok(data == false, 'confirm:complete passes in confirm answer (false)'); + }) + .on('ajax:beforeSend', function(e, data, status, xhr) { + App.assertCallbackNotInvoked('ajax:beforeSend'); + }) + .trigger('click'); -asyncTest('binding to confirm event and returning false', 1, function() { + setTimeout(function() { + equal(message, 'Are you absolutely sure?'); + start(); + }, 50); +}); + +asyncTest('clicking on a submit button with form and data-confirm attributes. Confirm No.', 3, function() { + var message; + // auto-decline: + window.confirm = function(msg) { message = msg; return false }; + + $('input[type=submit][form]') + .on('confirm:complete', function(e, data) { + App.assertCallbackInvoked('confirm:complete'); + ok(data == false, 'confirm:complete passes in confirm answer (false)'); + }) + .on('ajax:beforeSend', function(e, data, status, xhr) { + App.assertCallbackNotInvoked('ajax:beforeSend'); + }) + .trigger('click'); + + setTimeout(function() { + equal(message, 'Are you absolutely sure?'); + start(); + }, 50); +}); + +asyncTest('binding to confirm event of a link and returning false', 1, function() { // redefine confirm function so we can make sure it's not called window.confirm = function(msg) { ok(false, 'confirm dialog should not be called'); }; $('a[data-confirm]') - .bind('confirm', function() { - App.assert_callback_invoked('confirm'); + .on('confirm', function() { + App.assertCallbackInvoked('confirm'); return false; }) - .bind('confirm:complete', function() { - App.assert_callback_not_invoked('confirm:complete') + .on('confirm:complete', function() { + App.assertCallbackNotInvoked('confirm:complete'); }) .trigger('click'); @@ -78,7 +180,28 @@ asyncTest('binding to confirm event and returning false', 1, function() { }, 50); }); -asyncTest('binding to confirm:complete event and returning false', 2, function() { +asyncTest('binding to confirm event of a button and returning false', 1, function() { + // redefine confirm function so we can make sure it's not called + window.confirm = function(msg) { + ok(false, 'confirm dialog should not be called'); + }; + + $('button[data-confirm]') + .on('confirm', function() { + App.assertCallbackInvoked('confirm'); + return false; + }) + .on('confirm:complete', function() { + App.assertCallbackNotInvoked('confirm:complete'); + }) + .trigger('click'); + + setTimeout(function() { + start(); + }, 50); +}); + +asyncTest('binding to confirm:complete event of a link and returning false', 2, function() { // auto-confirm: window.confirm = function(msg) { ok(true, 'confirm dialog should be called'); @@ -86,12 +209,12 @@ asyncTest('binding to confirm:complete event and returning false', 2, function() }; $('a[data-confirm]') - .bind('confirm:complete', function() { - App.assert_callback_invoked('confirm:complete'); + .on('confirm:complete', function() { + App.assertCallbackInvoked('confirm:complete'); return false; }) - .bind('ajax:beforeSend', function() { - App.assert_callback_not_invoked('ajax:beforeSend'); + .on('ajax:beforeSend', function() { + App.assertCallbackNotInvoked('ajax:beforeSend'); }) .trigger('click'); @@ -99,3 +222,44 @@ asyncTest('binding to confirm:complete event and returning false', 2, function() start(); }, 50); }); + +asyncTest('binding to confirm:complete event of a button and returning false', 2, function() { + // auto-confirm: + window.confirm = function(msg) { + ok(true, 'confirm dialog should be called'); + return true; + }; + + $('button[data-confirm]') + .on('confirm:complete', function() { + App.assertCallbackInvoked('confirm:complete'); + return false; + }) + .on('ajax:beforeSend', function() { + App.assertCallbackNotInvoked('ajax:beforeSend'); + }) + .trigger('click'); + + setTimeout(function() { + start(); + }, 50); +}); + +asyncTest('a button inside a form only confirms once', 1, function() { + var confirmations = 0; + window.confirm = function(msg) { + confirmations++; + return true; + }; + + $('#qunit-fixture').append($('').append($('', { + 'data-remote': 'true', + 'data-confirm': 'Are you absolutely sure?', + text: 'Click me' + }))); + + $('form > button[data-confirm]').trigger('click'); + + ok(confirmations === 1, 'confirmation counter should be 1, but it was ' + confirmations); + start(); +}); diff --git a/test/public/test/data-disable-with.js b/test/public/test/data-disable-with.js new file mode 100644 index 00000000..1bb67426 --- /dev/null +++ b/test/public/test/data-disable-with.js @@ -0,0 +1,403 @@ +module('data-disable-with', { + setup: function() { + $('#qunit-fixture').append($('', { + action: '/echo', + 'data-remote': 'true', + method: 'post' + })) + .find('form') + .append($('')); + + $('#qunit-fixture').append($('', { + action: '/echo', + method: 'post', + id: 'not_remote' + })) + .find('form:last') + // WEEIRDD: the form won't submit to an iframe if the button is name="submit" (??!) + .append($('')); + + $('#qunit-fixture').append($('', { + text: 'Click me', + href: '/echo', + 'data-disable-with': 'clicking...' + })); + + + $('#qunit-fixture').append($('', { + type: 'submit', + form: 'not_remote', + 'data-disable-with': 'form attr submitting', + name: 'submit3', + value: 'Form Attr Submit' + })); + + $('#qunit-fixture').append($('', { + text: 'Click me', + 'data-remote': true, + 'data-url': '/echo', + 'data-disable-with': 'clicking...' + })); + }, + teardown: function() { + $(document).off('iframe:loaded'); + } +}); + +asyncTest('form input field with "data-disable-with" attribute', 7, function() { + var form = $('form[data-remote]'), input = form.find('input[type=text]'); + + App.checkEnabledState(input, 'john'); + + form.on('ajax:success', function(e, data) { + setTimeout(function() { + App.checkEnabledState(input, 'john'); + equal(data.params.user_name, 'john'); + start(); + }, 13); + }); + form.trigger('submit'); + + App.checkDisabledState(input, 'processing ...'); +}); + +asyncTest('blank form input field with "data-disable-with" attribute', 7, function() { + var form = $('form[data-remote]'), input = form.find('input[type=text]'); + + input.val(''); + App.checkEnabledState(input, ''); + + form.on('ajax:success', function(e, data) { + setTimeout(function() { + App.checkEnabledState(input, ''); + equal(data.params.user_name, ''); + start(); + }, 13); + }); + form.trigger('submit'); + + App.checkDisabledState(input, 'processing ...'); +}); + +asyncTest('form button with "data-disable-with" attribute', 6, function() { + var form = $('form[data-remote]'), button = $('Submit'); + form.append(button); + + App.checkEnabledState(button, 'Submit'); + + form.on('ajax:success', function(e, data) { + setTimeout(function() { + App.checkEnabledState(button, 'Submit'); + start(); + }, 13); + }); + form.trigger('submit'); + + App.checkDisabledState(button, 'submitting ...'); +}); + +asyncTest('form input[type=submit][data-disable-with] disables', 6, function(){ + var form = $('form:not([data-remote])'), input = form.find('input[type=submit]'); + + App.checkEnabledState(input, 'Submit'); + + // WEEIRDD: attaching this handler makes the test work in IE7 + $(document).on('iframe:loading', function(e, form) {}); + + $(document).on('iframe:loaded', function(e, data) { + setTimeout(function() { + App.checkDisabledState(input, 'submitting ...'); + start(); + }, 30); + }); + form.trigger('submit'); + + setTimeout(function() { + App.checkDisabledState(input, 'submitting ...'); + }, 30); +}); + +test('form input[type=submit][data-disable-with] re-enables when `pageshow` event is triggered', function(){ + var form = $('form:not([data-remote])'), input = form.find('input[type=submit]'); + + App.checkEnabledState(input, 'Submit'); + + // Emulate the disabled state without submitting the form at all, what is the + // state after going back on firefox after submitting a form. + // + // See https://github.com/rails/jquery-ujs/issues/357 + $.rails.disableFormElements(form); + + App.checkDisabledState(input, 'submitting ...'); + + $(window).trigger('pageshow'); + + App.checkEnabledState(input, 'Submit'); +}); + +asyncTest('form[data-remote] input[type=submit][data-disable-with] is replaced in ajax callback', 2, function(){ + var form = $('form:not([data-remote])').attr('data-remote', 'true'), origFormContents = form.html(); + + form.on('ajax:success', function(){ + form.html(origFormContents); + + setTimeout(function(){ + var input = form.find('input[type=submit]'); + App.checkEnabledState(input, 'Submit'); + start(); + }, 30); + }).trigger('submit'); +}); + +asyncTest('form[data-remote] input[data-disable-with] is replaced with disabled field in ajax callback', 2, function(){ + var form = $('form:not([data-remote])').attr('data-remote', 'true'), input = form.find('input[type=submit]'), + newDisabledInput = input.clone().attr('disabled', 'disabled'); + + form.on('ajax:success', function(){ + input.replaceWith(newDisabledInput); + + setTimeout(function(){ + App.checkEnabledState(newDisabledInput, 'Submit'); + start(); + }, 30); + }).trigger('submit'); +}); + +asyncTest('form input[type=submit][data-disable-with] using "form" attribute disables', 6, function() { + var form = $('#not_remote'), input = $('input[form=not_remote]'); + App.checkEnabledState(input, 'Form Attr Submit'); + + // WEEIRDD: attaching this handler makes the test work in IE7 + $(document).on('iframe:loading', function(e, form) {}); + + $(document).on('iframe:loaded', function(e, data) { + setTimeout(function() { + App.checkDisabledState(input, 'form attr submitting'); + start(); + }, 30); + }); + form.trigger('submit'); + + setTimeout(function() { + App.checkDisabledState(input, 'form attr submitting'); + }, 30); + +}); + +asyncTest('form[data-remote] textarea[data-disable-with] attribute', 3, function() { + var form = $('form[data-remote]'), + textarea = $('born, lived, died.').appendTo(form); + + form.on('ajax:success', function(e, data) { + setTimeout(function() { + equal(data.params.user_bio, 'born, lived, died.'); + start(); + }, 13); + }); + form.trigger('submit'); + + App.checkDisabledState(textarea, 'processing ...'); +}); + +asyncTest('a[data-disable-with] disables', 4, function() { + var link = $('a[data-disable-with]'); + + App.checkEnabledState(link, 'Click me'); + + link.trigger('click'); + App.checkDisabledState(link, 'clicking...'); + start(); +}); + +test('a[data-disable-with] re-enables when `pageshow` event is triggered', function() { + var link = $('a[data-disable-with]'); + + App.checkEnabledState(link, 'Click me'); + + link.trigger('click'); + App.checkDisabledState(link, 'clicking...'); + + $(window).trigger('pageshow'); + App.checkEnabledState(link, 'Click me'); +}); + +asyncTest('a[data-remote][data-disable-with] disables and re-enables', 6, function() { + var link = $('a[data-disable-with]').attr('data-remote', true); + + App.checkEnabledState(link, 'Click me'); + + link + .on('ajax:beforeSend', function() { + App.checkDisabledState(link, 'clicking...'); + }) + .on('ajax:complete', function() { + setTimeout( function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 15); + }) + .trigger('click'); +}); + +asyncTest('a[data-remote][data-disable-with] re-enables when `ajax:before` event is cancelled', 6, function() { + var link = $('a[data-disable-with]').attr('data-remote', true); + + App.checkEnabledState(link, 'Click me'); + + link + .on('ajax:before', function() { + App.checkDisabledState(link, 'clicking...'); + return false; + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 30); +}); + +asyncTest('a[data-remote][data-disable-with] re-enables when `ajax:beforeSend` event is cancelled', 6, function() { + var link = $('a[data-disable-with]').attr('data-remote', true); + + App.checkEnabledState(link, 'Click me'); + + link + .on('ajax:beforeSend', function() { + App.checkDisabledState(link, 'clicking...'); + return false; + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 30); +}); + +asyncTest('a[data-remote][data-disable-with] re-enables when `ajax:error` event is triggered', 6, function() { + var link = $('a[data-disable-with]').attr('data-remote', true).attr('href', '/error'); + + App.checkEnabledState(link, 'Click me'); + + link + .on('ajax:beforeSend', function() { + App.checkDisabledState(link, 'clicking...'); + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 30); +}); + +asyncTest('form[data-remote] input|button|textarea[data-disable-with] does not disable when `ajax:beforeSend` event is cancelled', 8, function() { + var form = $('form[data-remote]'), + input = form.find('input:text'), + button = $('Submit').appendTo(form), + textarea = $('born, lived, died.').appendTo(form), + submit = $('').appendTo(form); + + form + .on('ajax:beforeSend', function() { + return false; + }) + .trigger('submit'); + + App.checkEnabledState(input, 'john'); + App.checkEnabledState(button, 'Submit'); + App.checkEnabledState(textarea, 'born, lived, died.'); + App.checkEnabledState(submit, 'Submit'); + + start(); +}); + +asyncTest('ctrl-clicking on a link does not disables the link', 6, function() { + var link = $('a[data-disable-with]'), e; + e = $.Event('click'); + e.metaKey = true; + + App.checkEnabledState(link, 'Click me'); + + link.trigger(e); + App.checkEnabledState(link, 'Click me'); + + e = $.Event('click'); + e.ctrlKey = true; + + link.trigger(e); + App.checkEnabledState(link, 'Click me'); + start(); +}); + +asyncTest('button[data-remote][data-disable-with] disables and re-enables', 6, function() { + var button = $('button[data-remote][data-disable-with]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:send', function() { + App.checkDisabledState(button, 'clicking...'); + }) + .on('ajax:complete', function() { + setTimeout( function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 15); + }) + .trigger('click'); +}); + +asyncTest('button[data-remote][data-disable-with] re-enables when `ajax:before` event is cancelled', 6, function() { + var button = $('button[data-remote][data-disable-with]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:before', function() { + App.checkDisabledState(button, 'clicking...'); + return false; + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); +}); + +asyncTest('button[data-remote][data-disable-with] re-enables when `ajax:beforeSend` event is cancelled', 6, function() { + var button = $('button[data-remote][data-disable-with]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:beforeSend', function() { + App.checkDisabledState(button, 'clicking...'); + return false; + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); +}); + +asyncTest('button[data-remote][data-disable-with] re-enables when `ajax:error` event is triggered', 6, function() { + var button = $('a[data-disable-with]').attr('data-remote', true).attr('href', '/error'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:send', function() { + App.checkDisabledState(button, 'clicking...'); + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); +}); diff --git a/test/public/test/data-disable.js b/test/public/test/data-disable.js index d80a5102..ed30b0ec 100644 --- a/test/public/test/data-disable.js +++ b/test/public/test/data-disable.js @@ -6,7 +6,7 @@ module('data-disable', { method: 'post' })) .find('form') - .append($('')); + .append($('')); $('#qunit-fixture').append($('', { action: '/echo', @@ -14,121 +14,115 @@ module('data-disable', { })) .find('form:last') // WEEIRDD: the form won't submit to an iframe if the button is name="submit" (??!) - .append($('')); + .append($('')); $('#qunit-fixture').append($('', { text: 'Click me', href: '/echo', - 'data-disable-with': 'clicking...' + 'data-disable': 'true' })); + + $('#qunit-fixture').append($('', { + text: 'Click me', + 'data-remote': true, + 'data-url': '/echo', + 'data-disable': 'true' + })); + }, + teardown: function() { + $(document).off('iframe:loaded'); } }); -function getVal(el) { - return el.is('input,textarea,select') ? el.val() : el.text(); -} - -function disabled(el) { - return el.is('input,textarea,select,button') ? el.is(':disabled') : el.data('ujs:enable-with'); -} - -function checkEnabledState(el, text) { - ok(!disabled(el), el.get(0).tagName + ' should not be disabled'); - equal(getVal(el), text, el.get(0).tagName + ' text should be original value'); -} - -function checkDisabledState(el, text) { - ok(disabled(el), el.get(0).tagName + ' should be disabled'); - equal(getVal(el), text, el.get(0).tagName + ' text should be disabled value'); -} - -asyncTest('form input field with "data-disable-with" attribute', 7, function() { +asyncTest('form input field with "data-disable" attribute', 7, function() { var form = $('form[data-remote]'), input = form.find('input[type=text]'); - checkEnabledState(input, 'john'); + App.checkEnabledState(input, 'john'); - form.bind('ajax:success', function(e, data) { + form.on('ajax:success', function(e, data) { setTimeout(function() { - checkEnabledState(input, 'john'); + App.checkEnabledState(input, 'john'); equal(data.params.user_name, 'john'); start(); }, 13) }) form.trigger('submit'); - checkDisabledState(input, 'processing ...'); + App.checkDisabledState(input, 'john'); }); -asyncTest('form button with "data-disable-with" attribute', 6, function() { - var form = $('form[data-remote]'), button = $('Submit'); +asyncTest('form button with "data-disable" attribute', 7, function() { + var form = $('form[data-remote]'), button = $('Submit'); form.append(button); - checkEnabledState(button, 'Submit'); + App.checkEnabledState(button, 'Submit'); - form.bind('ajax:success', function(e, data) { + form.on('ajax:success', function(e, data) { setTimeout(function() { - checkEnabledState(button, 'Submit'); + App.checkEnabledState(button, 'Submit'); start(); }, 13) }) form.trigger('submit'); - checkDisabledState(button, 'submitting ...'); + App.checkDisabledState(button, 'Submit'); + equal(button.data('ujs:enable-with'), undefined); }); -asyncTest('form input[type=submit][data-disable-with] disables', 6, function(){ +asyncTest('form input[type=submit][data-disable] disables', 6, function(){ var form = $('form:not([data-remote])'), input = form.find('input[type=submit]'); - checkEnabledState(input, 'Submit'); + App.checkEnabledState(input, 'Submit'); // WEEIRDD: attaching this handler makes the test work in IE7 - form.bind('iframe:loading', function(e, form) {}); + $(document).on('iframe:loading', function(e, form) {}); - form.bind('iframe:loaded', function(e, data) { + $(document).on('iframe:loaded', function(e, data) { setTimeout(function() { - checkDisabledState(input, 'submitting ...'); + App.checkDisabledState(input, 'Submit'); start(); }, 30); - }).trigger('submit'); + }); + form.trigger('submit'); setTimeout(function() { - checkDisabledState(input, 'submitting ...'); + App.checkDisabledState(input, 'Submit'); }, 30); }); -asyncTest('form[data-remote] input[type=submit][data-disable-with] is replaced in ajax callback', 2, function(){ +asyncTest('form[data-remote] input[type=submit][data-disable] is replaced in ajax callback', 2, function(){ var form = $('form:not([data-remote])').attr('data-remote', 'true'), origFormContents = form.html(); - form.bind('ajax:success', function(){ + form.on('ajax:success', function(){ form.html(origFormContents); setTimeout(function(){ var input = form.find('input[type=submit]'); - checkEnabledState(input, 'Submit'); + App.checkEnabledState(input, 'Submit'); start(); }, 30); }).trigger('submit'); }); -asyncTest('form[data-remote] input[data-disable-with] is replaced with disabled field in ajax callback', 2, function(){ +asyncTest('form[data-remote] input[data-disable] is replaced with disabled field in ajax callback', 2, function(){ var form = $('form:not([data-remote])').attr('data-remote', 'true'), input = form.find('input[type=submit]'), newDisabledInput = input.clone().attr('disabled', 'disabled'); - form.bind('ajax:success', function(){ + form.on('ajax:success', function(){ input.replaceWith(newDisabledInput); setTimeout(function(){ - checkEnabledState(newDisabledInput, 'Submit'); + App.checkEnabledState(newDisabledInput, 'Submit'); start(); }, 30); }).trigger('submit'); }); -asyncTest('form[data-remote] textarea[data-disable-with] attribute', 3, function() { +asyncTest('form[data-remote] textarea[data-disable] attribute', 3, function() { var form = $('form[data-remote]'), - textarea = $('born, lived, died.').appendTo(form); + textarea = $('born, lived, died.').appendTo(form); - form.bind('ajax:success', function(e, data) { + form.on('ajax:success', function(e, data) { setTimeout(function() { equal(data.params.user_bio, 'born, lived, died.'); start(); @@ -136,89 +130,197 @@ asyncTest('form[data-remote] textarea[data-disable-with] attribute', 3, function }) form.trigger('submit'); - checkDisabledState(textarea, 'processing ...'); + App.checkDisabledState(textarea, 'born, lived, died.'); }); -asyncTest('a[data-disable-with] disables', 4, function() { - var link = $('a[data-disable-with]'); +asyncTest('a[data-disable] disables', 5, function() { + var link = $('a[data-disable]'); - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); link.trigger('click'); - checkDisabledState(link, 'clicking...'); + App.checkDisabledState(link, 'Click me'); + equal(link.data('ujs:enable-with'), undefined); start(); }); -asyncTest('a[data-remote][data-disable-with] disables and re-enables', 6, function() { - var link = $('a[data-disable-with]').attr('data-remote', true); +asyncTest('a[data-remote][data-disable] disables and re-enables', 6, function() { + var link = $('a[data-disable]').attr('data-remote', true); - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); link - .bind('ajax:beforeSend', function() { - checkDisabledState(link, 'clicking...'); + .on('ajax:send', function() { + App.checkDisabledState(link, 'Click me'); }) - .live('ajax:complete', function() { - checkEnabledState(link, 'Click me'); - start(); + .on('ajax:complete', function() { + setTimeout( function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 15); }) .trigger('click'); }); -asyncTest('a[data-remote][data-disable-with] re-enables when `ajax:before` event is cancelled', 6, function() { - var link = $('a[data-disable-with]').attr('data-remote', true); +asyncTest('a[data-remote][data-disable] re-enables when `ajax:before` event is cancelled', 6, function() { + var link = $('a[data-disable]').attr('data-remote', true); - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); link - .bind('ajax:before', function() { - checkDisabledState(link, 'clicking...'); + .on('ajax:before', function() { + App.checkDisabledState(link, 'Click me'); return false; }) .trigger('click'); setTimeout(function() { - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); start(); }, 30); }); -asyncTest('a[data-remote][data-disable-with] re-enables when `ajax:beforeSend` event is cancelled', 6, function() { - var link = $('a[data-disable-with]').attr('data-remote', true); +asyncTest('a[data-remote][data-disable] re-enables when `ajax:beforeSend` event is cancelled', 6, function() { + var link = $('a[data-disable]').attr('data-remote', true); - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); link - .bind('ajax:beforeSend', function() { - checkDisabledState(link, 'clicking...'); + .on('ajax:beforeSend', function() { + App.checkDisabledState(link, 'Click me'); return false; }) .trigger('click'); setTimeout(function() { - checkEnabledState(link, 'Click me'); + App.checkEnabledState(link, 'Click me'); start(); }, 30); }); -asyncTest('form[data-remote] input|button|textarea[data-disable-with] does not disable when `ajax:beforeSend` event is cancelled', 8, function() { +asyncTest('a[data-remote][data-disable] re-enables when `ajax:error` event is triggered', 6, function() { + var link = $('a[data-disable]').attr('data-remote', true).attr('href', '/error'); + + App.checkEnabledState(link, 'Click me'); + + link + .on('ajax:send', function() { + App.checkDisabledState(link, 'Click me'); + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(link, 'Click me'); + start(); + }, 30); +}); + +asyncTest('form[data-remote] input|button|textarea[data-disable] does not disable when `ajax:beforeSend` event is cancelled', 8, function() { var form = $('form[data-remote]'), input = form.find('input:text'), - button = $('Submit').appendTo(form), - textarea = $('born, lived, died.').appendTo(form), - submit = $('').appendTo(form); + button = $('Submit').appendTo(form), + textarea = $('born, lived, died.').appendTo(form), + submit = $('').appendTo(form); form - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { return false; }) .trigger('submit'); - checkEnabledState(input, 'john'); - checkEnabledState(button, 'Submit'); - checkEnabledState(textarea, 'born, lived, died.'); - checkEnabledState(submit, 'Submit'); + App.checkEnabledState(input, 'john'); + App.checkEnabledState(button, 'Submit'); + App.checkEnabledState(textarea, 'born, lived, died.'); + App.checkEnabledState(submit, 'Submit'); + + start(); +}); + +asyncTest('ctrl-clicking on a link does not disables the link', 6, function() { + var link = $('a[data-disable]'), e; + e = $.Event('click'); + e.metaKey = true; + App.checkEnabledState(link, 'Click me'); + + link.trigger(e); + App.checkEnabledState(link, 'Click me'); + + e = $.Event('click'); + e.ctrlKey = true; + + link.trigger(e); + App.checkEnabledState(link, 'Click me'); start(); +}); + +asyncTest('button[data-remote][data-disable] disables and re-enables', 6, function() { + var button = $('button[data-remote][data-disable]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:send', function() { + App.checkDisabledState(button, 'Click me'); + }) + .on('ajax:complete', function() { + setTimeout( function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 15); + }) + .trigger('click'); +}); + +asyncTest('button[data-remote][data-disable] re-enables when `ajax:before` event is cancelled', 6, function() { + var button = $('button[data-remote][data-disable]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:before', function() { + App.checkDisabledState(button, 'Click me'); + return false; + }) + .trigger('click'); + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); +}); + +asyncTest('button[data-remote][data-disable] re-enables when `ajax:beforeSend` event is cancelled', 6, function() { + var button = $('button[data-remote][data-disable]'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:beforeSend', function() { + App.checkDisabledState(button, 'Click me'); + return false; + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); +}); + +asyncTest('button[data-remote][data-disable] re-enables when `ajax:error` event is triggered', 6, function() { + var button = $('a[data-disable]').attr('data-remote', true).attr('href', '/error'); + + App.checkEnabledState(button, 'Click me'); + + button + .on('ajax:send', function() { + App.checkDisabledState(button, 'Click me'); + }) + .trigger('click'); + + setTimeout(function() { + App.checkEnabledState(button, 'Click me'); + start(); + }, 30); }); diff --git a/test/public/test/data-method.js b/test/public/test/data-method.js index 40e99210..32b90d70 100644 --- a/test/public/test/data-method.js +++ b/test/public/test/data-method.js @@ -5,16 +5,20 @@ module('data-method', { $('#qunit-fixture').append($('', { href: '/echo', 'data-method': 'delete', text: 'destroy!' })); + }, + teardown: function() { + $(document).off('iframe:loaded'); } }); function submit(fn, options) { + $(document).on('iframe:loaded', function(e, data) { + fn(data); + start(); + }); + $('#qunit-fixture').find('a') - .bind('iframe:loaded', function(e, data) { - fn(data); - start(); - }) - .trigger('click'); + .trigger('click'); } asyncTest('link with "data-method" set to "delete"', 3, function() { @@ -42,4 +46,30 @@ asyncTest('link "target" should be carried over to generated form', 1, function( }); }); +asyncTest('link with "data-method" and cross origin', 1, function() { + var data = {}; + + $('#qunit-fixture') + .append('') + .append(''); + + $(document).on('submit', 'form', function(e) { + $(e.currentTarget).serializeArray().map(function(item) { + data[item.name] = item.value; + }); + + return false; + }); + + var link = $('#qunit-fixture').find('a'); + + link.attr('href', 'http://www.alfajango.com'); + + link.trigger('click'); + + start(); + + notEqual(data.authenticity_token, 'cf50faa3fe97702ca1ae'); +}); + })(); diff --git a/test/public/test/data-remote.js b/test/public/test/data-remote.js index d9c2f6d7..215d8217 100644 --- a/test/public/test/data-remote.js +++ b/test/public/test/data-remote.js @@ -7,10 +7,23 @@ module('data-remote', { 'data-params': 'data1=value1&data2=value2', text: 'my address' })) + .append($('', { + 'data-url': '/echo', + 'data-remote': 'true', + 'data-params': 'data1=value1&data2=value2', + text: 'my button' + })) .append($('', { action: '/echo', 'data-remote': 'true', - method: 'post' + method: 'post', + id: 'my-remote-form' + })) + .append($('', { + href: '/echo', + 'data-remote': 'true', + disabled: 'disabled', + text: 'Disabed link' })) .find('form').append($('')); @@ -26,7 +39,7 @@ asyncTest('ctrl-clicking on a link does not fire ajaxyness', 0, function() { // follow links using `trigger('click')`, it only fires bindings. link .removeAttr('data-params') - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(false, 'ajax should not be triggered'); }); @@ -49,7 +62,7 @@ asyncTest('ctrl-clicking on a link still fires ajax for non-GET links and for li link .removeAttr('data-params') .attr('data-method', 'POST') - .bind('ajax:beforeSend', function() { + .on('ajax:beforeSend', function() { ok(true, 'ajax should be triggered'); }) .trigger(e); @@ -67,14 +80,40 @@ asyncTest('ctrl-clicking on a link still fires ajax for non-GET links and for li asyncTest('clicking on a link with data-remote attribute', 5, function() { $('a[data-remote]') - .bind('ajax:success', function(e, data, status, xhr) { - App.assert_callback_invoked('ajax:success'); - App.assert_request_path(data, '/echo'); + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); equal(data.params.data1, 'value1', 'ajax arguments should have key data1 with right value'); equal(data.params.data2, 'value2', 'ajax arguments should have key data2 with right value'); - App.assert_get_request(data); + App.assertGetRequest(data); }) - .bind('ajax:complete', function() { start() }) + .on('ajax:complete', function() { start() }) + .trigger('click'); +}); + +asyncTest('clicking on a link with disabled attribute', 0, function() { + $('a[disabled]') + .on("ajax:before", function(e, data, status, xhr) { + App.assertCallbackNotInvoked('ajax:success') + }) + .on('ajax:complete', function() { start() }) + .trigger('click') + + setTimeout(function() { + start(); + }, 13); +}); + +asyncTest('clicking on a button with data-remote attribute', 5, function() { + $('button[data-remote]') + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); + equal(data.params.data1, 'value1', 'ajax arguments should have key data1 with right value'); + equal(data.params.data2, 'value2', 'ajax arguments should have key data2 with right value'); + App.assertGetRequest(data); + }) + .on('ajax:complete', function() { start() }) .trigger('click'); }); @@ -92,30 +131,90 @@ asyncTest('changing a select option with data-remote attribute', 5, function() { ); $('select[data-remote]') - .bind('ajax:success', function(e, data, status, xhr) { - App.assert_callback_invoked('ajax:success'); - App.assert_request_path(data, '/echo'); + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); equal(data.params.user_data, 'optionValue2', 'ajax arguments should have key term with right value'); equal(data.params.data1, 'value1', 'ajax arguments should have key data1 with right value'); - App.assert_get_request(data); + App.assertGetRequest(data); }) - .bind('ajax:complete', function() { start() }) + .on('ajax:complete', function() { start() }) .val('optionValue2') .trigger('change'); }); asyncTest('submitting form with data-remote attribute', 4, function() { $('form[data-remote]') - .bind('ajax:success', function(e, data, status, xhr) { - App.assert_callback_invoked('ajax:success'); - App.assert_request_path(data, '/echo'); + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); equal(data.params.user_name, 'john', 'ajax arguments should have key user_name with right value'); - App.assert_post_request(data); + App.assertPostRequest(data); }) - .bind('ajax:complete', function() { start() }) + .on('ajax:complete', function() { start() }) .trigger('submit'); }); +asyncTest('submitting form with data-remote attribute should include inputs in a fieldset only once', 3, function() { + $('form[data-remote]') + .append('

') + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + equal(data.params.items.length, 1, 'ajax arguments should only have the item once') + App.assertPostRequest(data); + }) + .on('ajax:complete', function() { + $('form[data-remote], fieldset').remove() + start() + }) + .trigger('submit'); +}); + +asyncTest('submitting form with data-remote attribute submits input with matching [form] attribute', 5, function() { + $('#qunit-fixture') + .append($('')); + + $('form[data-remote]') + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); + equal(data.params.user_name, 'john', 'ajax arguments should have key user_name with right value'); + equal(data.params.user_data, 'value1', 'ajax arguments should have key user_data with right value'); + App.assertPostRequest(data); + }) + .on('ajax:complete', function() { start() }) + .trigger('submit'); +}); + +asyncTest('submitting form with data-remote attribute by clicking button with matching [form] attribute', 5, function() { + $('form[data-remote]') + .on('ajax:success', function(e, data, status, xhr) { + App.assertCallbackInvoked('ajax:success'); + App.assertRequestPath(data, '/echo'); + equal(data.params.user_name, 'john', 'ajax arguments should have key user_name with right value'); + equal(data.params.user_data, 'value2', 'ajax arguments should have key user_data with right value'); + App.assertPostRequest(data); + }) + .on('ajax:complete', function() { start() }); + + $('', { + type: "submit", + name: "user_data", + value: "value1", + form: "my-remote-form" + }) + .appendTo($('#qunit-fixture')); + + $('', { + type: "submit", + name: "user_data", + value: "value2", + form: "my-remote-form" + }) + .appendTo($('#qunit-fixture')) + .trigger('click'); +}); + asyncTest('form\'s submit bindings in browsers that don\'t support submit bubbling', 5, function() { var form = $('form[data-remote]'), directBindingCalled = false; @@ -123,16 +222,16 @@ asyncTest('form\'s submit bindings in browsers that don\'t support submit bubbli form .append($('')) - .bind('submit', function(event){ + .on('submit', function(event){ ok(event.type == 'submit', 'submit event handlers are called with submit event'); ok(true, 'binding handler is called'); directBindingCalled = true; }) - .bind('ajax:beforeSend', function(){ + .on('ajax:beforeSend', function(){ ok(true, 'form being submitted via ajax'); ok(directBindingCalled, 'binding handler already called'); }) - .bind('ajax:complete', function(){ + .on('ajax:complete', function(){ start(); }); @@ -150,11 +249,11 @@ asyncTest('returning false in form\'s submit bindings in non-submit-bubbling bro form .append($('')) - .bind('submit', function(){ + .on('submit', function(){ ok(true, 'binding handler is called'); return false; }) - .bind('ajax:beforeSend', function(){ + .on('ajax:beforeSend', function(){ ok(false, 'form should not be submitted'); }); @@ -167,3 +266,96 @@ asyncTest('returning false in form\'s submit bindings in non-submit-bubbling bro setTimeout(function(){ start(); }, 13); }); + +asyncTest('clicking on a link with falsy "data-remote" attribute does not fire ajaxyness', 0, function() { + $('a[data-remote]') + .attr('data-remote', 'false') + .on('ajax:beforeSend', function() { + ok(false, 'ajax should not be triggered'); + }) + .on('click', function() { + return false; + }) + .trigger('click'); + + setTimeout(function(){ start(); }, 20); +}); + +asyncTest('ctrl-clicking on a link with falsy "data-remote" attribute does not fire ajaxyness even if "data-params" present', 0, function() { + var link = $('a[data-remote]'), e; + e = $.Event('click'); + e.metaKey = true; + + link + .removeAttr('data-params') + .attr('data-remote', 'false') + .attr('data-method', 'POST') + .on('ajax:beforeSend', function() { + ok(false, 'ajax should not be triggered'); + }) + .on('click', function() { + return false; + }) + .trigger(e); + + e = $.Event('click'); + e.metaKey = true; + + link + .removeAttr('data-method') + .attr('data-params', 'name=steve') + .trigger(e); + + setTimeout(function(){ start(); }, 20); +}); + +asyncTest('clicking on a button with falsy "data-remote" attribute', 0, function() { + $('button[data-remote]:first') + .attr('data-remote', 'false') + .on('ajax:beforeSend', function() { + ok(false, 'ajax should not be triggered'); + }) + .on('click', function() { + return false; + }) + .trigger('click'); + + setTimeout(function(){ start(); }, 20); +}); + +asyncTest('submitting a form with falsy "data-remote" attribute', 0, function() { + $('form[data-remote]:first') + .attr('data-remote', 'false') + .on('ajax:beforeSend', function() { + ok(false, 'ajax should not be triggered'); + }) + .on('submit', function() { + return false; + }) + .trigger('submit'); + + setTimeout(function(){ start(); }, 20); +}); + +asyncTest('changing a select option with falsy "data-remote" attribute', 0, function() { + $('form') + .append( + $('', { + 'name': 'user_data', + 'data-remote': 'false', + 'data-params': 'data1=value1', + 'data-url': '/echo' + }) + .append($('', {value: 'optionValue1', text: 'option1'})) + .append($('', {value: 'optionValue2', text: 'option2'})) + ); + + $('select[data-remote=false]:first') + .on('ajax:beforeSend', function() { + ok(false, 'ajax should not be triggered'); + }) + .val('optionValue2') + .trigger('change'); + + setTimeout(function(){ start(); }, 20); +}); diff --git a/test/public/test/override.js b/test/public/test/override.js index 92119ea2..0dca60cc 100644 --- a/test/public/test/override.js +++ b/test/public/test/override.js @@ -32,7 +32,7 @@ asyncTest("the getter for an element's href is overridable", 1, function() { asyncTest("the getter for an element's href works normally if not overridden", 1, function() { $.rails.ajax = function(options) { - equal('/real/href', options.url); + equal(location.protocol + '//' + location.host + '/real/href', options.url); } $.rails.handleRemote($('#qunit-fixture').find('a')); start(); @@ -41,7 +41,7 @@ asyncTest("the getter for an element's href works normally if not overridden", 1 asyncTest("the event selector strings are overridable", 2, function() { var documentClickBindings = $._data(document, 'events').click, linkClickBinding = $.grep(documentClickBindings, function(a) { - return a.selector.indexOf('a[data-remote]') != -1; + return a.selector && a.selector.indexOf('a[data-remote]') != -1; })[0]; ok($.rails.linkClickSelector.indexOf(', a[data-custom-remote-link]') != -1, 'linkClickSelector contains custom selector'); diff --git a/test/public/test/settings.js b/test/public/test/settings.js index e23bf7ed..e516e063 100644 --- a/test/public/test/settings.js +++ b/test/public/test/settings.js @@ -1,36 +1,54 @@ var App = App || {}; -App.assert_callback_invoked = function(callback_name) { - ok(true, callback_name + ' callback should have been invoked'); +App.assertCallbackInvoked = function(callbackName) { + ok(true, callbackName + ' callback should have been invoked'); }; -App.assert_callback_not_invoked = function(callback_name) { - ok(false, callback_name + ' callback should not have been invoked'); +App.assertCallbackNotInvoked = function(callbackName) { + ok(false, callbackName + ' callback should not have been invoked'); }; -App.assert_get_request = function(request_env){ - equal(request_env['REQUEST_METHOD'], 'GET', 'request type should be GET'); +App.assertGetRequest = function(requestEnv){ + equal(requestEnv['REQUEST_METHOD'], 'GET', 'request type should be GET'); }; -App.assert_post_request = function(request_env){ - equal(request_env['REQUEST_METHOD'], 'POST', 'request type should be POST'); +App.assertPostRequest = function(requestEnv){ + equal(requestEnv['REQUEST_METHOD'], 'POST', 'request type should be POST'); }; -App.assert_request_path = function(request_env, path) { - equal(request_env['PATH_INFO'], path, 'request should be sent to right url'); +App.assertRequestPath = function(requestEnv, path) { + equal(requestEnv['PATH_INFO'], path, 'request should be sent to right url'); +}; + +App.getVal = function(el) { + return el.is('input,textarea,select') ? el.val() : el.text(); +}; + +App.disabled = function(el) { + return el.is('input,textarea,select,button') ? (el.is(':disabled') && el.data('ujs:disabled')) : el.data('ujs:disabled'); +}; + +App.checkEnabledState = function(el, text) { + ok(!App.disabled(el), el.get(0).tagName + ' should not be disabled'); + equal(App.getVal(el), text, el.get(0).tagName + ' text should be original value'); +}; + +App.checkDisabledState = function(el, text) { + ok(App.disabled(el), el.get(0).tagName + ' should be disabled'); + equal(App.getVal(el), text, el.get(0).tagName + ' text should be disabled value'); }; // hijacks normal form submit; lets it submit to an iframe to prevent // navigating away from the test suite -$(document).bind('submit', function(e) { +$(document).on('submit', function(e) { if (!e.isDefaultPrevented()) { var form = $(e.target), action = form.attr('action'), name = 'form-frame' + jQuery.guid++, iframe = $('