diff options
Diffstat (limited to 'actionview/app')
15 files changed, 181 insertions, 131 deletions
diff --git a/actionview/app/assets/javascripts/MIT-LICENSE b/actionview/app/assets/javascripts/MIT-LICENSE index befcbdc7b7..28e1b12496 100644 --- a/actionview/app/assets/javascripts/MIT-LICENSE +++ b/actionview/app/assets/javascripts/MIT-LICENSE @@ -1,4 +1,4 @@ -Copyright (c) 2007-2017 Rails Core team +Copyright (c) 2007-2018 Rails Core team Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the diff --git a/actionview/app/assets/javascripts/README.md b/actionview/app/assets/javascripts/README.md index 92f3e8a3b3..8198011b02 100644 --- a/actionview/app/assets/javascripts/README.md +++ b/actionview/app/assets/javascripts/README.md @@ -1,5 +1,4 @@ -Ruby on Rails unobtrusive scripting adapter. -======================================== +# 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: @@ -8,40 +7,47 @@ This unobtrusive scripting support file is developed for the Ruby on Rails frame - 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][data] to your HTML markup. In Rails, they are added by the framework's template helpers. +These features are achieved by adding certain [`data` attributes][data] to your HTML markup. In Rails, they are added by the framework's template helpers. -Requirements ------------- +## Optional prerequisites -- HTML5 doctype (optional). +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][validator]. However, this shouldn't create any issues for web browsers or other user agents. -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 npm ------------- +### NPM -Run `npm install rails-ujs --save` to install the rails-ujs package. + npm install rails-ujs --save + +### Yarn + + yarn add rails-ujs -Installation using Yarn ------------- +## Usage -Run `yarn add rails-ujs` to install the rails-ujs package. +### Asset pipeline -Usage ------------- - -Require `rails-ujs` into your application.js manifest. +In a conventional Rails application that uses the asset pipeline, require `rails-ujs` in your `application.js` manifest: ```javascript //= require rails-ujs ``` -How to run tests ------------- +### ES2015+ + +If you're using the Webpacker gem or some other JavaScript bundler, add the following to your main JS file: -Run `bundle exec rake ujs:server` first, and then run the web tests by visiting [[http://localhost:4567]] in your browser. +```javascript +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](MIT-LICENSE). [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" diff --git a/actionview/app/assets/javascripts/config.coffee b/actionview/app/assets/javascripts/config.coffee deleted file mode 100644 index a93325e903..0000000000 --- a/actionview/app/assets/javascripts/config.coffee +++ /dev/null @@ -1,34 +0,0 @@ -#= export Rails - -@Rails = - # Link elements bound by rails-ujs - linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]:not([disabled]), a[data-disable-with], a[data-disable]' - - # Button elements bound by rails-ujs - buttonClickSelector: - selector: 'button[data-remote]:not([form]), button[data-confirm]:not([form])' - exclude: 'form button' - - # Select elements bound by rails-ujs - inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]' - - # Form elements bound by rails-ujs - formSubmitSelector: 'form' - - # Form input elements bound by rails-ujs - formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form 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 - formDisableSelector: '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 - formEnableSelector: '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 file input elements - fileInputSelector: 'input[name][type=file]:not([disabled])' - - # Link onClick disable selector with possible reenable after remote submission - 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]' diff --git a/actionview/app/assets/javascripts/rails-ujs.coffee b/actionview/app/assets/javascripts/rails-ujs.coffee index df889ce067..bd6e9bb881 100644 --- a/actionview/app/assets/javascripts/rails-ujs.coffee +++ b/actionview/app/assets/javascripts/rails-ujs.coffee @@ -1,75 +1,39 @@ -# -# Unobtrusive JavaScript -# https://github.com/rails/rails-ujs -# -# Released under the MIT license -# -#= require ./config -#= require_tree ./utils -#= require_tree ./features +#= require ./rails-ujs/BANNER +#= export Rails +#= require_self +#= require_tree ./rails-ujs/utils +#= require_tree ./rails-ujs/features +#= require ./rails-ujs/start -{ - fire, delegate - getData, $ - refreshCSRFTokens, CSRFProtection - enableElement, disableElement - handleConfirm - handleRemote, formSubmitButtonClick, handleMetaClick - handleMethod -} = Rails +@Rails = + # Link elements bound by rails-ujs + linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]:not([disabled]), a[data-disable-with], a[data-disable]' -# For backward compatibility -if jQuery? and not jQuery.rails - jQuery.rails = Rails - jQuery.ajaxPrefilter (options, originalOptions, xhr) -> - CSRFProtection(xhr) unless options.crossDomain + # Button elements bound by rails-ujs + buttonClickSelector: + selector: 'button[data-remote]:not([form]), button[data-confirm]:not([form])' + exclude: 'form button' -Rails.start = -> - # Cut down on the number of issues from people inadvertently including - # rails-ujs twice by detecting and raising an error when it happens. - throw new Error('rails-ujs has already been loaded!') if window._rails_loaded + # Select elements bound by rails-ujs + inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]' - # 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.addEventListener 'pageshow', -> - $(Rails.formEnableSelector).forEach (el) -> - enableElement(el) if getData(el, 'ujs:disabled') - $(Rails.linkDisableSelector).forEach (el) -> - enableElement(el) if getData(el, 'ujs:disabled') + # Form elements bound by rails-ujs + formSubmitSelector: 'form' - delegate document, Rails.linkDisableSelector, 'ajax:complete', enableElement - delegate document, Rails.linkDisableSelector, 'ajax:stopped', enableElement - delegate document, Rails.buttonDisableSelector, 'ajax:complete', enableElement - delegate document, Rails.buttonDisableSelector, 'ajax:stopped', enableElement + # Form input elements bound by rails-ujs + formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form button:not([type]), input[type=submit][form], input[type=image][form], button[type=submit][form], button[form]:not([type])' - delegate document, Rails.linkClickSelector, 'click', handleConfirm - delegate document, Rails.linkClickSelector, 'click', handleMetaClick - delegate document, Rails.linkClickSelector, 'click', disableElement - delegate document, Rails.linkClickSelector, 'click', handleRemote - delegate document, Rails.linkClickSelector, 'click', handleMethod + # Form input elements disabled during form submission + formDisableSelector: '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' - delegate document, Rails.buttonClickSelector, 'click', handleConfirm - delegate document, Rails.buttonClickSelector, 'click', disableElement - delegate document, Rails.buttonClickSelector, 'click', handleRemote + # Form input elements re-enabled after form submission + formEnableSelector: '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' - delegate document, Rails.inputChangeSelector, 'change', handleConfirm - delegate document, Rails.inputChangeSelector, 'change', handleRemote + # Form file input elements + fileInputSelector: 'input[name][type=file]:not([disabled])' - delegate document, Rails.formSubmitSelector, 'submit', handleConfirm - delegate document, Rails.formSubmitSelector, 'submit', handleRemote - # Normal mode submit - # Slight timeout so that the submit button gets properly serialized - delegate document, Rails.formSubmitSelector, 'submit', (e) -> setTimeout((-> disableElement(e)), 13) - delegate document, Rails.formSubmitSelector, 'ajax:send', disableElement - delegate document, Rails.formSubmitSelector, 'ajax:complete', enableElement + # Link onClick disable selector with possible reenable after remote submission + linkDisableSelector: 'a[data-disable-with], a[data-disable]' - delegate document, Rails.formInputClickSelector, 'click', handleConfirm - delegate document, Rails.formInputClickSelector, 'click', formSubmitButtonClick - - document.addEventListener('DOMContentLoaded', refreshCSRFTokens) - window._rails_loaded = true - -if window.Rails is Rails and fire(document, 'rails:attachBindings') - Rails.start() + # Button onClick disable selector with possible reenable after remote submission + buttonDisableSelector: 'button[data-remote][data-disable-with], button[data-remote][data-disable]' diff --git a/actionview/app/assets/javascripts/rails-ujs/BANNER.js b/actionview/app/assets/javascripts/rails-ujs/BANNER.js new file mode 100644 index 0000000000..47ecd66003 --- /dev/null +++ b/actionview/app/assets/javascripts/rails-ujs/BANNER.js @@ -0,0 +1,5 @@ +/* +Unobtrusive JavaScript +https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts +Released under the MIT license + */ diff --git a/actionview/app/assets/javascripts/features/confirm.coffee b/actionview/app/assets/javascripts/rails-ujs/features/confirm.coffee index 72b5aaa218..72b5aaa218 100644 --- a/actionview/app/assets/javascripts/features/confirm.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/features/confirm.coffee diff --git a/actionview/app/assets/javascripts/features/disable.coffee b/actionview/app/assets/javascripts/rails-ujs/features/disable.coffee index e8cce7da40..90aa3bdf0e 100644 --- a/actionview/app/assets/javascripts/features/disable.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/features/disable.coffee @@ -2,6 +2,10 @@ { matches, getData, setData, stopEverything, formElements } = Rails +Rails.handleDisabledElement = (e) -> + element = this + stopEverything(e) if element.disabled + # Unified function to enable an element (link, button and form) Rails.enableElement = (e) -> element = if e instanceof Event then e.target else e diff --git a/actionview/app/assets/javascripts/features/method.coffee b/actionview/app/assets/javascripts/rails-ujs/features/method.coffee index d04d9414dd..d04d9414dd 100644 --- a/actionview/app/assets/javascripts/features/method.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/features/method.coffee diff --git a/actionview/app/assets/javascripts/features/remote.coffee b/actionview/app/assets/javascripts/rails-ujs/features/remote.coffee index 852587042c..b3448dabac 100644 --- a/actionview/app/assets/javascripts/features/remote.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/features/remote.coffee @@ -62,7 +62,7 @@ Rails.handleRemote = (e) -> fire(element, 'ajax:send', [xhr]) else fire(element, 'ajax:stopped') - xhr.abort() + return false success: (args...) -> fire(element, 'ajax:success', args) error: (args...) -> fire(element, 'ajax:error', args) complete: (args...) -> fire(element, 'ajax:complete', args) diff --git a/actionview/app/assets/javascripts/rails-ujs/start.coffee b/actionview/app/assets/javascripts/rails-ujs/start.coffee new file mode 100644 index 0000000000..55595ac96f --- /dev/null +++ b/actionview/app/assets/javascripts/rails-ujs/start.coffee @@ -0,0 +1,70 @@ +{ + fire, delegate + getData, $ + refreshCSRFTokens, CSRFProtection + enableElement, disableElement, handleDisabledElement + handleConfirm + handleRemote, formSubmitButtonClick, handleMetaClick + handleMethod +} = Rails + +# For backward compatibility +if jQuery? and jQuery.ajax? and not jQuery.rails + jQuery.rails = Rails + jQuery.ajaxPrefilter (options, originalOptions, xhr) -> + CSRFProtection(xhr) unless options.crossDomain + +Rails.start = -> + # Cut down on the number of issues from people inadvertently including + # rails-ujs twice by detecting and raising an error when it happens. + throw new Error('rails-ujs has already been loaded!') if window._rails_loaded + + # 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.addEventListener 'pageshow', -> + $(Rails.formEnableSelector).forEach (el) -> + enableElement(el) if getData(el, 'ujs:disabled') + $(Rails.linkDisableSelector).forEach (el) -> + enableElement(el) if getData(el, 'ujs:disabled') + + delegate document, Rails.linkDisableSelector, 'ajax:complete', enableElement + delegate document, Rails.linkDisableSelector, 'ajax:stopped', enableElement + delegate document, Rails.buttonDisableSelector, 'ajax:complete', enableElement + delegate document, Rails.buttonDisableSelector, 'ajax:stopped', enableElement + + delegate document, Rails.linkClickSelector, 'click', handleDisabledElement + delegate document, Rails.linkClickSelector, 'click', handleConfirm + delegate document, Rails.linkClickSelector, 'click', handleMetaClick + delegate document, Rails.linkClickSelector, 'click', disableElement + delegate document, Rails.linkClickSelector, 'click', handleRemote + delegate document, Rails.linkClickSelector, 'click', handleMethod + + delegate document, Rails.buttonClickSelector, 'click', handleDisabledElement + delegate document, Rails.buttonClickSelector, 'click', handleConfirm + delegate document, Rails.buttonClickSelector, 'click', disableElement + delegate document, Rails.buttonClickSelector, 'click', handleRemote + + delegate document, Rails.inputChangeSelector, 'change', handleDisabledElement + delegate document, Rails.inputChangeSelector, 'change', handleConfirm + delegate document, Rails.inputChangeSelector, 'change', handleRemote + + delegate document, Rails.formSubmitSelector, 'submit', handleDisabledElement + delegate document, Rails.formSubmitSelector, 'submit', handleConfirm + delegate document, Rails.formSubmitSelector, 'submit', handleRemote + # Normal mode submit + # Slight timeout so that the submit button gets properly serialized + delegate document, Rails.formSubmitSelector, 'submit', (e) -> setTimeout((-> disableElement(e)), 13) + delegate document, Rails.formSubmitSelector, 'ajax:send', disableElement + delegate document, Rails.formSubmitSelector, 'ajax:complete', enableElement + + delegate document, Rails.formInputClickSelector, 'click', handleDisabledElement + delegate document, Rails.formInputClickSelector, 'click', handleConfirm + delegate document, Rails.formInputClickSelector, 'click', formSubmitButtonClick + + document.addEventListener('DOMContentLoaded', refreshCSRFTokens) + window._rails_loaded = true + +if window.Rails is Rails and fire(document, 'rails:attachBindings') + Rails.start() diff --git a/actionview/app/assets/javascripts/utils/ajax.coffee b/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee index 9af515beda..cc0e037428 100644 --- a/actionview/app/assets/javascripts/utils/ajax.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee @@ -14,21 +14,21 @@ AcceptHeaders = Rails.ajax = (options) -> options = prepareOptions(options) xhr = createXHR options, -> - response = processResponse(xhr.response, xhr.getResponseHeader('Content-Type')) + response = processResponse(xhr.response ? xhr.responseText, xhr.getResponseHeader('Content-Type')) if xhr.status // 100 == 2 options.success?(response, xhr.statusText, xhr) else options.error?(response, xhr.statusText, xhr) options.complete?(xhr, xhr.statusText) - # Call beforeSend hook - options.beforeSend?(xhr, options) - # Send the request + + if options.beforeSend? && !options.beforeSend(xhr, options) + return false + if xhr.readyState is XMLHttpRequest.OPENED xhr.send(options.data) - else - fire(document, 'ajaxStop') # to be compatible with jQuery.ajax prepareOptions = (options) -> + options.url = options.url or location.href options.type = options.type.toUpperCase() # append data to url if it's a GET request if options.type is 'GET' and options.data @@ -63,10 +63,10 @@ processResponse = (response, type) -> if typeof response is 'string' and typeof type is 'string' if type.match(/\bjson\b/) try response = JSON.parse(response) - else if type.match(/\bjavascript\b/) + else if type.match(/\b(?:java|ecma)script\b/) script = document.createElement('script') - script.innerHTML = response - document.body.appendChild(script) + script.text = response + document.head.appendChild(script).parentNode.removeChild(script) else if type.match(/\b(xml|html|svg)\b/) parser = new DOMParser() type = type.replace(/;.+/, '') # remove something like ';charset=utf-8' diff --git a/actionview/app/assets/javascripts/utils/csrf.coffee b/actionview/app/assets/javascripts/rails-ujs/utils/csrf.coffee index 4eb5ebb414..4eb5ebb414 100644 --- a/actionview/app/assets/javascripts/utils/csrf.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/utils/csrf.coffee diff --git a/actionview/app/assets/javascripts/utils/dom.coffee b/actionview/app/assets/javascripts/rails-ujs/utils/dom.coffee index 6bef618147..3d3c5bb330 100644 --- a/actionview/app/assets/javascripts/utils/dom.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/utils/dom.coffee @@ -5,6 +5,13 @@ m = Element.prototype.matches or Element.prototype.oMatchesSelector or Element.prototype.webkitMatchesSelector +# Checks if the given native dom element matches the selector +# element:: +# native DOM element +# selector:: +# css selector string or +# a javascript object with `selector` and `exclude` properties +# Examples: "form", { selector: "form", exclude: "form[data-remote='true']"} Rails.matches = (element, selector) -> if selector.exclude? m.call(element, selector.selector) and not m.call(element, selector.exclude) diff --git a/actionview/app/assets/javascripts/utils/event.coffee b/actionview/app/assets/javascripts/rails-ujs/utils/event.coffee index 8d3ff007ea..a7eee52060 100644 --- a/actionview/app/assets/javascripts/utils/event.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/utils/event.coffee @@ -11,9 +11,26 @@ if typeof CustomEvent isnt 'function' evt = document.createEvent('CustomEvent') evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail) evt + CustomEvent.prototype = window.Event.prototype + # Fix setting `defaultPrevented` when `preventDefault()` is called + # http://stackoverflow.com/questions/23349191/event-preventdefault-is-not-working-in-ie-11-for-custom-events + { preventDefault } = CustomEvent.prototype + CustomEvent.prototype.preventDefault = -> + result = preventDefault.call(this) + if @cancelable and not @defaultPrevented + Object.defineProperty(this, 'defaultPrevented', get: -> true) + result + # Triggers a custom event on an element and returns false if the event result is false +# obj:: +# a native DOM element +# name:: +# string that corrspends to the event you want to trigger +# e.g. 'click', 'submit' +# data:: +# data you want to pass when you dispatch an event fire = Rails.fire = (obj, name, data) -> event = new CustomEvent( name, @@ -31,6 +48,17 @@ Rails.stopEverything = (e) -> e.stopPropagation() e.stopImmediatePropagation() +# Delegates events +# to a specified parent `element`, which fires event `handler` +# for the specified `selector` when an event of `eventType` is triggered +# element:: +# parent element that will listen for events e.g. document +# selector:: +# css selector; or an object that has `selector` and `exclude` properties (see: Rails.matches) +# eventType:: +# string representing the event e.g. 'submit', 'click' +# handler:: +# the event handler to be called Rails.delegate = (element, selector, eventType, handler) -> element.addEventListener eventType, (e) -> target = e.target diff --git a/actionview/app/assets/javascripts/utils/form.coffee b/actionview/app/assets/javascripts/rails-ujs/utils/form.coffee index 5fa337b518..736cab08db 100644 --- a/actionview/app/assets/javascripts/utils/form.coffee +++ b/actionview/app/assets/javascripts/rails-ujs/utils/form.coffee @@ -10,7 +10,7 @@ Rails.serializeElement = (element, additionalParam) -> params = [] inputs.forEach (input) -> - return unless input.name + return if !input.name || input.disabled if matches(input, 'select') toArray(input.options).forEach (option) -> params.push(name: input.name, value: option.value) if option.selected |