jQuery 3.6.3 Released: A Quick Selector Fix

Posted on by

Last week, we released jQuery 3.6.2. There were several changes in that release, but the most important one addressed an issue with some new selectors introduced in most browsers, like :has(). We wanted to release jQuery 3.6.3 quickly because an issue was reported that revealed a problem with our original fix. More details on that below.

As usual, the release is available on our cdn and the npm package manager. Other third party CDNs will probably have it soon as well, but remember that we don’t control their release schedules and they will need some time. Here are the highlights for jQuery 3.6.3.

Using CSS.supports the right way

After the issue with :has that was fixed in jQuery 3.6.2, we started using CSS.supports( "selector(SELECTOR)") to determine whether a selector would be valid if passed directly to querySelectorAll. When CSS.supports returned false, jQuery would then fall back to its own selector engine (Sizzle). Apparently, our implementation had a bug. In CSS.supports( "selector(SELECTOR)"), SELECTOR needed to be a <complex-selector> and not a <complex-selector-list>. For example:

CSS.supports("selector(div)"); // true
CSS.supports("selector(div, span)"); // false

This meant that all complex selector lists were passed through Sizzle instead of querySelectorAll. That’s not necessarily a problem in most cases, but it does mean that some level 4 selectors that were supported in browsers but not in Sizzle, like :valid, no longer worked if it was part of a selector list (e.g. "input:valid, div"). It should be noted this currently only affects Firefox, but it will be true in all browsers as they roll out changes to CSS.supports.

This has now been fixed in jQuery 3.6.3 and it is the only functional change in this release.

Upgrading

We do not expect compatibility issues when upgrading from a jQuery 3.0+ version. To upgrade, have a look at the new 3.5 Upgrade Guide. If you haven’t yet upgraded to jQuery 3+, first have a look at the 3.0 Upgrade Guide.

The jQuery Migrate plugin will help you to identify compatibility issues in your code. Please try out this new release and let us know about any issues you experienced.

If you can’t yet upgrade to 3.5+, Daniel Ruf has kindly provided patches for previous jQuery versions.

Download

You can get the files from the jQuery CDN, or link to them directly:

https://code.jquery.com/jquery-3.6.3.js

https://code.jquery.com/jquery-3.6.3.min.js

You can also get this release from npm:

npm install jquery@3.6.3

Slim build

Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version. These files are also available in the npm package and on the CDN:

https://code.jquery.com/jquery-3.6.3.slim.js

https://code.jquery.com/jquery-3.6.3.slim.min.js

These updates are already available as the current versions on npm and Bower. Information on all the ways to get jQuery is available at https://jquery.com/download/. Public CDNs receive their copies today, please give them a few days to post the files. If you’re anxious to get a quick start, use the files on our CDN until they have a chance to update.

Thanks

Thank you to all of you who participated in this release by submitting patches, reporting bugs, or testing, including Michal Golebiowski-Owczarek and the whole jQuery team.

Changelog

Full changelog: 3.6.3

Build

  • remove stale Insight package from custom builds (81d5bd17)
  • Updating the 3.x-stable version to 3.6.3-pre. (2c5b47c4)

Selector

jQuery 3.6.2 Released!

Posted on by

You probably weren’t expecting another release so soon, but jQuery 3.6.2 has arrived! The main impetus for this release was the introduction of some new selectors in Chrome. More on that below.

As usual, the release is available on our cdn and the npm package manager. Other third party CDNs will probably have it soon as well, but remember that we don’t control their release schedules and they will need some time. Here are the highlights for jQuery 3.6.2.

undefined and whitespace-only CSS variables

jQuery 3.6.1 introduced a minor regression where attempting to retrieve a value for a custom CSS property that didn’t exist (i.e. $elem.css("--custom")) threw an error instead of returning undefined. This has been fixed in 3.6.2. Related to that, we also made sure that whitespace-only values return the same thing across all browsers. The spec requires that CSS variable values be trimmed, but browsers are inconsistent in their trimming. We now return undefined for whitespace-only values to make it consistent with older jQuery and across the different browsers.

.contains() with <template>

An issue was recently reported that showed that a <template>‘s document had its documentElement property set to null, in compliance with the spec. While it made sense semantically for a template to not yet be tied to a document, it made for an unusual case, specifically in jQuery.contains() and any methods relying on it. That included manipulation and selector methods. Fortunately, the fix was simple.

It wasn’t Ralph that broke the internet

The internet experienced a bit of a rumble when Chrome recently introduced some new selectors, the most pertinent of which being :has(). It was a welcome addition, and one celebrated by the jQuery team, but a change to the spec meant that :has() used what’s called “forgiving parsing”. Essentially, even if the arguments for :has() were invalid, the browser returned no results instead of throwing an error. That was problematic in cases where :has() contained another jQuery selector extension (e.g. :has(:contains("Item"))) or contained itself (:has(div:has(a))). Sizzle relied on errors like that to know when to trust native querySelectorAll and when to run the selector through Sizzle. Selectors that used to work were broken in all jQuery versions dating back to the earliest jQuery versions.

And yet, this little drama didn’t last long. The Chrome team quickly implemented a workaround to fix previous jQuery versions in the vast majority of cases. Safari handled their implementation of :has() a little differently and didn’t have the same problem. But, there’s still an important issue open to determine how to address this in the CSS spec itself. The CSSWG has since resolved the issue.

jQuery has taken steps to ensure that any forgiving parsing doesn’t break future jQuery versions, even if previous jQuery versions would still be affected.

Upgrading

We do not expect compatibility issues when upgrading from a jQuery 3.0+ version. To upgrade, have a look at the new 3.5 Upgrade Guide. If you haven’t yet upgraded to jQuery 3+, first have a look at the 3.0 Upgrade Guide.

The jQuery Migrate plugin will help you to identify compatibility issues in your code. Please try out this new release and let us know about any issues you experienced.

If you can’t yet upgrade to 3.5+, Daniel Ruf has kindly provided patches for previous jQuery versions.

Download

You can get the files from the jQuery CDN, or link to them directly:

https://code.jquery.com/jquery-3.6.2.js

https://code.jquery.com/jquery-3.6.2.min.js

You can also get this release from npm:

npm install jquery@3.6.2

Slim build

Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version. These files are also available in the npm package and on the CDN:

https://code.jquery.com/jquery-3.6.2.slim.js

https://code.jquery.com/jquery-3.6.2.slim.min.js

These updates are already available as the current versions on npm and Bower. Information on all the ways to get jQuery is available at https://jquery.com/download/. Public CDNs receive their copies today, please give them a few days to post the files. If you’re anxious to get a quick start, use the files on our CDN until they have a chance to update.

Thanks

Thank you to all of you who participated in this release by submitting patches, reporting bugs, or testing, including sashashura, Anders Kaseorg, Michal Golebiowski-Owczarek, and the whole jQuery team.

Changelog

Full changelog: 3.6.2

CSS

  • Return undefined for whitespace-only CSS variable values (#5120) (8bea1dec)
  • Don’t trim whitespace of undefined custom property (#5105, c0db6d70)

Selector

Tests

  • Remove a workaround for a Firefox XML parsing issue (965391ab)
  • Make Ajax tests pass in iOS 9 (d051e0e3)

jQuery 3.6.1 Maintenance Release

Posted on by

jQuery 3.6.1 has been released! It’s been a while since our previous release. We were looking at fixing some elusive edge cases related to focus and blur, but we never quite got the fix right. If there’s any area of jQuery that’s hard to change, it’s likely related to focus somehow. We’re leaving those as-is for now and will address them in the future, especially since the changes may end up warranting a major version release. See gh-4856 and gh-4950 for more details.

That said, this release still comes with some important fixes, detailed below.

As usual, the release is available on our cdn and the npm package manager. Other third party CDNs will probably have it soon as well, but remember that we don’t control their release schedules and they will need some time. Here are the highlights for jQuery 3.6.1:

Infrastructure Improvements

We’ve done a lot of work in this release to update some of our testing and build infrastructure, including migrating CI from Travis CI to GitHub Actions, testing on Node 16 instead of Node 15, loading our testing listener over https, and adding more accurate testing for custom builds. We also removed some old links from comments in some files in the repo. These links were to URLs that have since been compromised. While these files were never distributed in a release, they still existed in the GitHub source and have been removed.

Not losing focus

There’s still one fix related to focus in this release. Our special event handling for focus remained attached even after jQuery focus handlers were removed, which broke any subsequent manual focus triggers. For example,

$elem
  .on("focus", function() {})
  .off("focus")
  .trigger("focus");

would not trigger focus.

Skipping falsey in addClass( array )

Without any size increase, we added support for skipping over any falsey values in an array passed to addClass or removeClass.

This makes code like:

elem.addClass( [ "a", "", "b" ] );

add both the a & b classes.

Aligning with the spec for custom CSS property values

A change to the CSS spec requires that custom properties be trimmed. Whitespace is now trimmed for custom CSS property values. Before, something like --prop: value ; would retain the leading and trailing spaces in the value, returning ” value “.

Appending scripts with HTML comments

An issue was discovered with our regex that strips HTML comments from scripts when they are appended, which ended up removing parts of the executable script in certain edge cases. Fortunately, our fix was to rely more on the browsers, but we still need to strip CDATA sections for IE in the 3.x branch. That will be removed in 4.0.

A performance boost for jQuery.trim

While jQuery.trim has already been removed on the main branch in favor of native String#trim in preparation for the next major release, it’s still needed on the 3.x branch for some browsers that branch supports, such as Android 4.0. There were certain edge cases that were incredibly slow due to the structure of our regex. That has since been changed and the speed-up is significant.

Upgrading

We do not expect compatibility issues when upgrading from a jQuery 3.0+ version. To upgrade, have a look at the new 3.5 Upgrade Guide. If you haven’t yet upgraded to jQuery 3+, first have a look at the 3.0 Upgrade Guide.

The jQuery Migrate plugin will help you to identify compatibility issues in your code. Please try out this new release and let us know about any issues you experienced.

If you can’t yet upgrade to 3.5+, Daniel Ruf has kindly provided patches for previous jQuery versions.

Download

You can get the files from the jQuery CDN, or link to them directly:

https://code.jquery.com/jquery-3.6.1.js

https://code.jquery.com/jquery-3.6.1.min.js

You can also get this release from npm:

npm install jquery@3.6.1

Slim build

Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version. These files are also available in the npm package and on the CDN:

https://code.jquery.com/jquery-3.6.1.slim.js

https://code.jquery.com/jquery-3.6.1.slim.min.js

These updates are already available as the current versions on npm and Bower. Information on all the ways to get jQuery is available at https://jquery.com/download/. Public CDNs receive their copies today, please give them a few days to post the files. If you’re anxious to get a quick start, use the files on our CDN until they have a chance to update.

Thanks

Thank you to all of you who participated in this release by submitting patches, reporting bugs, or testing, including fecore1, Richard Gibson, Simon Legner, Michal Golebiowski-Owczarek, Vladimir Sitnikov, Timo Tijhof, Christian Oliff, ygj6, and the whole jQuery team.

Changelog

Full changelog: 3.6.1

CSS

  • Skip falsy values in `addClass( array )`, compress code (#4998, 9b34bdb1)
  • Justify use of rtrim on CSS property values (a1373e2e)
  • Remove a redundant extension from rtrimCSS inclusion in curCSS (509eeb89)
  • Trim whitespace surrounding CSS Custom Properties values (#4926, 219ccf5c)

Deprecated

  • Improve $.trim performance for strings with lots of whitespace (69940100)

Docs

  • Update webpack website in README (410d5cf0)
  • add link to preview the new CLAs (b24e83bd)
  • Replace `#NUMBER` Trac issue references with `trac-NUMBER` (95e34b69)
  • remove expired links from old jquery source (c3c4d207)
  • Remove links to Web Archive from source (#4981, 4b0d8900)
  • Update the URL to the latest jQuery build in CONTRIBUTING.md (4bb7d069)
  • Remove the CLA checkbox in the pull request template (93406490)

Event

  • Don’t break focus triggering after `.on(focus).off(focus)` (#4867, b3e4a7eb)

Manipulation

Tests

  • Exclude tests based on compilation flags, not API presence (3.x version) (#5069, bc165128)
  • Workaround an XML parsing bug in Firefox (be3bd560)
  • lock colors version to 1.4.0 (fa70e8fd)
  • Skip ETag AJAX tests on TestSwarm (81fa1e2a)
  • Allow statusText to be “success” in AJAX tests (7439e221)
  • Disable CSS Custom Properties tests in old Safari/iOS (e9f77267)
  • Make Karma browser timeout larger than the QUnit one (a51eec74)
  • Don’t remove csp.log in the cspClean action of mock.php (ba81326f)
  • Load the TestSwarm listener via HTTPS (f6f07204)
  • Switch background image from online file to local 1×1.jpg (8d20cb97)
  • Strip untypical callback parameter characters from mock.php (b14b62c8)

Infrastructure

  • Update GitHub Actions (0f6c3d9e)
  • Add dependabot.yml config (GitHub Actions) (5a363017)
  • Test on Node 17, update Grunt & `karma-*` packages (9bc0df70)
  • Separate the install step from running tests in GitHub Actions (cb35067f)
  • remove travis.yml and travis mentions from core (#4984) (55669883)
  • Migrate CI to GitHub Actions (b39cfa15)
  • Test on Node.js 16 instead of 15 (f12cac60)
  • Take core-js from the external directory as well (752b8981)
  • Updating the 3.x-stable version to 3.6.1-pre. (3642471e)