History

Ross Kaffenberger 04cbaa1475 Use ES module syntax for application.js.tt and docs This change swaps the CommonJS require() syntax in the Webpacker application.js pack template file and in documentation examples with ES module import syntax. Benefits of this change include: Provides continuity with the larger frontend community: Arguably, one of the main draws in adopting Webpacker is its integration with Babel to support ES module syntax. For a fresh Rails install with Webpacker, the application.js file will be the first impression most Rails developers have with webpack and Webpacker. Most of the recent documentation and examples they will find online for using other libraries will be based on ES module syntax. Reduces confusion: Developers commonly add ES imports to their application.js pack, typically by following online examples, which means mixing require() and import statements in a single file. This leads to confusion and unnecessary friction about differences between require() and import. Embraces browser-friendliness: The ES module syntax forward-looking and is meant to be supported in browsers. On the other hand, require() syntax is synchronous by design and not browser-supported as CommonJS originally was adopted in Node.js for server-side JavaScript. That webpack supports require() syntax is merely a convenience. Encourages best practices regarding optimization: webpack can statically analyze ES modules and "tree-shake", i.e., strip out unused exports from the final build (given certain conditions are met, including `sideEffects: false` designation in package.json).		2020-06-16 15:12:12 -04:00
..
rails-ujs	Check that request is same-origin prior to including CSRF token in XHRs	2020-05-15 16:15:00 -07:00
MIT-LICENSE	Bump license years from 2019 to 2020 [ci skip]	2020-01-01 15:10:31 +05:30
README.md	Use ES module syntax for application.js.tt and docs	2020-06-16 15:12:12 -04:00
rails-ujs.coffee	Reorganize rails-ujs files	2017-03-30 14:41:17 -04:00

README.md

Ruby on Rails unobtrusive scripting adapter

This unobtrusive scripting support file is developed for the Ruby on Rails framework, but is not strictly tied to any specific backend. You can drop this into any application to:

force confirmation dialogs for various actions;
make non-GET requests from hyperlinks;
make forms or hyperlinks submit data asynchronously with Ajax;
have submit buttons become automatically disabled on form submit to prevent double-clicking.

These features are achieved by adding certain data attributes to your HTML markup. In Rails, they are added by the framework's template helpers.

Optional prerequisites

Note that the data attributes this library adds are a feature of HTML5. If you're not targeting HTML5, these attributes may make your HTML to fail validation. However, this shouldn't create any issues for web browsers or other user agents.

Installation

npm

npm install @rails/ujs --save

Yarn

yarn add @rails/ujs

Ensure that .yarnclean does not include assets if you use yarn autoclean.

Usage

Asset pipeline

In a conventional Rails application that uses the asset pipeline, require rails-ujs in your application.js manifest:

//= require rails-ujs

ES2015+

If you're using the Webpacker gem or some other JavaScript bundler, add the following to your main JS file:

import Rails from "@rails/ujs"
Rails.start()

How to run tests

Run bundle exec rake ujs:server first, and then run the web tests by visiting http://localhost:4567 in your browser.

License

rails-ujs is released under the MIT License.