Running HTML responses through `DOMParser#parseFromString` results in
complete `HTMLDocument` instances with unnecessary surrounding tags.
For example:
new DOMParser().parseFromString('<p>hello</p>', 'text/html')
Will output:
<html>
<head></head>
<body>
<p>hello</p>
</body>
</html>
This is passed to the `ajax:success` handler as `event.detail[0]`
(`data`), but cannot be used directly without first traversing the
document.
To resolve this, only XML content is passed through `parseFromString`,
while HTML content is treated as plain-text.
This matches the behavior of jquery-ujs, which relied on jQuery's
response-type inference.
Because the UJS library creates a script tag to process responses it
normally requires the script-src attribute of the content security
policy to include 'unsafe-inline'.
To work around this we generate a per-request nonce value that is
embedded in a meta tag in a similar fashion to how CSRF protection
embeds its token in a meta tag. The UJS library can then read the
nonce value and set it on the dynamically generated script tag to
enable it to execute without needing 'unsafe-inline' enabled.
Nonce generation isn't 100% safe - if your script tag is including
user generated content in someway then it may be possible to exploit
an XSS vulnerability which can take advantage of the nonce. It is
however an improvement on a blanket permission for inline scripts.
It is also possible to use the nonce within your own script tags by
using `nonce: true` to set the nonce value on the tag, e.g
<%= javascript_tag nonce: true do %>
alert('Hello, World!');
<% end %>
Fixes#31689.
Improves 049a3374aa85f33091f0e7cba8635edd4b4786bd:
* Attempt native `preventDefault()` before stepping in
* Fix that calling `preventDefault()` more than once would throw an error
* Fix that non-cancelable events could be canceled
Make various wording tweaks to cater to users who are viewing the README
on NPM. Notably, don't highlight Yarn specifically in the installation
instructions -- even though this is the preferred tool of choice
especially in the Ruby community, some people still use NPM (and,
really, ES2015+ syntax has nothing to do with NPM or Yarn).
The existing UJS event behavior relies on browsers not sending events for
various events when an element is disabled. For example, imagine the following:
<button type="submit" disabled="disabled">Click me</button>
The above button is disabled, so browsers will not trigger a click event and
all UJS behavior is prevented. However, imagine a button like this:
<button type="submit" disabled="disabled"><strong>Click me</strong></button>
The above is treated differently by browsers such as Chrome/Safari. These
browsers do not consider the strong tag to be disabled, and will trigger click
events. UJS has logic to walk up the DOM to find an associated element subject
to UJS behavior. But, this logic does not take into account the disabled
status of the element.
I originally thought we could simply change the selectors used to match
elements to ignore disabled elements. However, UJS disables some elements as
part of the event chain. So, an element might match early in the chain and
then fail to match later. Instead of changing the selectors I added a callback
to the chain that calls `stopEverything` if an element is disabled when the
event chain begins.
