Update Masonry (v3.3.2) & imagesLoaded (v3.2.0) package

[Ninos Ego]

Masonry should be updated to version 3.3.0. The current version in use is v3.1.2.
Also I removed the deprecated package jquery.masonry.js. If you still want to support jquery-masonry as handler, you could also link to the version v3.3.0. This version supports both native & jquery style. See also:
​http://masonry.desandro.com/#initialize-with-jquery

Additionally I splitted imagesLoaded from masonry package & updated from v3.1.4 to v3.1.8. Isotope and masonry don't ship it by default. There are also theme/plugin-developers, which want to use imagesLoaded with isotope or other scripts/libraries or may just masonry withouth imagesLoaded (e.g. because it's buggy with the src-set attr & ff). They should have the opinion to load that lib without initializing masonry or the other way.

PS: jQuery should also be updated to v2.1.4. If you want I can create another patch :-)
PS²: With the attached patch it seems I cannot remove following file: /wp-includes/js/jquery/jquery.masonry.min.js

[Ninos Ego]

Use only lowercase for handling names..

[samuelsidler]

I'm not sure what substantial changes there are between Masonry 3.1.2 and 3.3.0, but we'd probably want to make sure it doesn't break anything on our end. How well has this been tested with WordPress?

If we were going to take this, it'd probably need to land before beta, which is this Wednesday (2 days).

Note: We updated jQuery to 1.11.3 in #32794. I don't think we plan to update to jQuery 2.x any time soon.

[Ninos Ego]

There're just small fixes:
​https://github.com/desandro/masonry/blob/master/changelog.md

I implemented that patch for a short time (some days) on my test environment. I'm also using masonry on fronend (intensively) and haven't found any bugs in font- and also backend.

The main feature is, that this masonry-version supports native js and also jQuery, so you don't need the two versions anymore. ImagesLoaded is also not shipped in package anymore (see description above). The API is still the same.

[rwky]

The masonry v 3.1.2 is being displayed very weird (content over the edges, grid not aligning right) on Google Chrome Version 45.0.2454.85 (64-bit), OS X 10.10.5 .
Just in case anyone is having this type of bug :) in cross browser compatibility.

[Ninos Ego]

Current version is 3.3.2 :)

[jorbin]

We shouldn't eliminate 'jquery-masonry' since doing so will break any attempt to load that handler. The handler should just load no script and have 'masonry' as a dependency.

imagesLoaded should be a dependency of masonry since it was in the old file. Eliminating it would break sites that depend on it being in masonry.

​https://github.com/desandro/masonry/compare/v3.1.3...v3.3.2 is the diff between versions.

We should find a few plugins and themes depending on masonry and make sure to test those. Anyone have suggestions?

@kovshenin, I see your name in some of the commits. Any thoughts here?

[Ninos Ego]

I would definitely remove 'jquery-masonry'. The version is very old. I don't think that so many themes use 'masonry', even less 'jquery-masonry'. By removing 'jquery-masonry' you'll not break much themes. Also sometime you need to force them to update their theme, you cannot stay backwardcompatible for ever.

Regarding the dependency of imagesLoaded, I would not add that. There are also people which want to use masonry without the imagesLoaded library (e.g. myself). Here again I'm sure you'll not break much themes, and if, they should update their theme (therefor you have major updates :D).

Attached my updated patch (with newest version of the masonry library).

PS: In one of my current themes I'm using masonry on many places and had no problems with that patch. Also the masonry feature of the famous page builder plugin 'VisualComposer' had no problems.

[grapplerulrich]

@Ninos Ego - To be able to update Masonry it would be best to just to do that. There are still a number of themes that still use jquery-masonry. I keep on seeing theme authors uploading themes that use it. Leaving it in core does not effect you.

I would also recommend creating a new ticket for adding "imagesLoaded". It is already excluded in v3.1.4 so that should not have any adverse effects.

[Ninos Ego]

@grapplerulrich sry but i did not understood your response completely. Do you want

1. to still support masonry v2 (jquery-masonry)
2. a fallback of the jquery-masonry handle (When using 'jquery-masonry' wp should load 'masonry')

After your answer I'll update my patch, than hopefully you can merge it into v4.4 :)

PS: imagesLoaded is still included in the wp-masonry package, so it should be part of this ticket:
https://core.trac.wordpress.org/browser/trunk/src/wp-includes/js/masonry.min.js#L12

[Ninos Ego]

Without jquery-masonry handle

[Ninos Ego]

With jquery-masonry handle

[Ninos Ego]

I've added two patches, think the second one is what you need.

PS: twentythirteen & twentyfourteen uses the old handle jquery-masonry. Not very professional for wp theme authors :D After merging I'll create a new patch for these two themes.

[grapplerulrich]

I do not have commit access but I have experience with contributing to WP. By only fixing one thing in a ticket makes it move faster normally.

The jquery-masonry handle needs to stay in WP core with the shiv for backwards compatibility.

I think it was a mistake to include imagesLoaded within the masonry file.

It would be good to check how many themes are using imagesloaded when using the masonry handle.

// Masonry v2 depended on jQuery. v3 does not. The older jquery-masonry handle is a shiv.
// It sets jQuery as a dependency, as the theme may have been implicitly loading it this way.
$scripts->add( 'masonry', "/wp-includes/js/masonry.min.js", array(), '3.3.2', 1 );
$scripts->add( 'imagesloaded', "/wp-includes/js/imagesloaded.min.js", array(), '3.2.0', 1 );
$scripts->add( 'jquery-masonry', "/wp-includes/js/jquery/jquery.masonry$dev_suffix.js", array( 'jquery', 'masonry', 'imagesloaded' ), '3.3.2', 1 );

[Ninos Ego]

jquery-masonry (without imagesLoaded)

[Ninos Ego]

jquery-masonry (with imagesLoaded)

[Ninos Ego]

@grapplerulrich I've added two new patches, so the devs can choose now :D

[sayontan]

As an aside, there is a pretty severe bug in the version of the imagesLoaded script (3.1.4) that is bundled with WP 4.4, which makes the script almost useless on FireFox. The details can be seen here: ​https://github.com/desandro/imagesloaded/issues/191. Is there any chance of including imagesLoaded version 3.2.0 (as per this patch) in the next release?

[ocean90]

For back-compat please make sure that imagesloaded is still a dependency of masonry after a split.

[grapplerulrich]

version 3.2 with the correct dependencies

[grapplerulrich]

The patch has been uploaded. I have not updated to 4.0 as it removes IE 8-9 support. We can discuss updating to 4.0 in a new ticket.

[ocean90]

In 37891:

External Libraries: Update Masonry to 3.3.2 and imagesLoaded to 3.2.0.

Also split imagesLoaded and Masonry into separate files so imagesLoaded can be used independently.

Diff Masonry: ​https://github.com/desandro/masonry/compare/v3.1.4...v3.3.2
Diff imagesLoaded: ​https://github.com/desandro/imagesloaded/compare/v3.1.4...v3.2.0

Props Ninos Ego, grapplerulrich.
Fixes #32802.

[jorbin]

In 38261:

External Libraries: Update Masonry shim to prevent error using isAnimated option

The isAnimated option throws an error and causes Masonry to stop functioning. Masonry.prototype.options is no longer defined in 3.3.2, this.options is and does the same. Masonry was updated to 3.3.2 in [37891].

Reported upstream: ​https://github.com/desandro/masonry-v2-3-shim/pull/1

Props stephenharris, ocean90, azaozz for testing and second sign off.
See #37666, #32802.

[jorbin]

In 38262:

External Libraries: Update Masonry shim to prevent error using isAnimated option

Merges [38261] to the 4.6 branch.

The isAnimated option throws an error and causes Masonry to stop functioning. Masonry.prototype.options is no longer defined in 3.3.2, this.options is and does the same. Masonry was updated to 3.3.2 in [37891].

Reported upstream: ​https://github.com/desandro/masonry-v2-3-shim/pull/1

Props stephenharris, ocean90, azaozz for testing and second sign off.
Fixes #37666.
See #32802.

[grapplerulrich]

@jorbin Seems we forgot to update the minified version of the file too? ​https://github.com/WordPress/WordPress/blob/master/wp-includes/js/jquery/jquery.masonry.min.js

[dfavor]

Please provide a link to unminified imagesloaded.min.js + for future versions of this code, include both minified + unminified versions.

Currently something's amiss with imagesloaded.min.js + there's no debugging it, because it's minified.

​https://www.webpagetest.org/result/161021_C0_1MMB shows the problem.

imagesloaded.min.js stuck for 80+ seconds.

The imagesloaded.min.js code requires being debugged + either fixed or guards added which protect it from being called in odd ways by... whatever code calls it.

[dfavor]

Just realized this ticket is closed. I'll open a new issue ticket.