Foundation-sites: Problems with jQuery 3

Created on 27 Jun 2016 · 32Comments · Source: foundation/foundation-sites

What happend?
Please update the deprecated method calls.

e.g.
sample.load(fn()) to sample.on('load', fn())

How can we reproduce this bug?

Use Foundation 5 in a project via NodeJs
--> dependency in package.json: jQuery >= 2.x.x
----> jQuery 3.0.0 is installed (breaking changes)

What did you expect to happen?
Foundation should not throw any error. Please update the code so that it don't use deprecated methods.

What happened instead?
Foundation throws error.

Thanks

Source

tobias-kutter

👍13

Most helpful comment

@Baedda It should be. I just update the release notes highlighting this for the PR in question that fixed it.

We decided not to change the default to jQuery 3 until the minor release, but projects using 3 should now work.

kball on 21 Oct 2016

👍2 🎉1

All 32 comments

This is also happening in Foundation 6. Thanks!

BobSeu on 27 Jun 2016

Same thing happened to me. Update would be very nice :)

TobiasFeld on 30 Jun 2016

👍1

Further verification using https://github.com/jquery/jquery-migrate (sorry for the screen grab).

pmaceachern on 6 Jul 2016

I am running into the same problem, does anyone from foundation team know the best way to solve this problem?

pratikpparikh on 11 Jul 2016

👍1

I guess this could be solved by adding a jQuery 3 Test, collect the JQMIGRATE Warnings and migrate/change the code step by step.

DaSchTour on 12 Jul 2016

I got the problem with the deprecated load function in foundation.util.triggers.js, too. It would be really nice to have a fix here with the next version.
If you guys want to include a patch on your side you can change line 65 from:
$(window).load(function () {
to:
$(window).on('load', function () {

I´ve created a pull request for this:
https://github.com/zurb/foundation-sites/pull/9040

Baedda on 21 Jul 2016

Just making some noise here. I have the same problem, inside init in foundation.js:345, there is a call to .load that ends up here. Foundation 5.5.3, jQuery 3.1.0.

Hotfixing the file in bower_components in my project for now.

Elephant-Vessel on 4 Aug 2016

I am having the same issue when bootstrapping it to aurelia. can we get these load(callback) changed to .on('load', callback)

samuelmolinski on 5 Aug 2016

should be fixed by https://github.com/zurb/foundation-sites/pull/8923

mbrevda on 14 Aug 2016

🎉1

@tobias-kutter can you confirm this has been fixed?

Owlbertz on 23 Sep 2016

it still occurs in Foundation 6 for site.

max8hine on 30 Sep 2016

It's also not fixed in Foundation 5.5.3...

tobias-kutter on 30 Sep 2016

@max8hine what version are you using?

Owlbertz on 30 Sep 2016

@Owlbertz I am using 6.2.3 i caught it from npm foundation-sites. and binding the main js file with jQuery 3 by using webpack. but i didn't do any testing on this error, but i found the error in Console panel.

max8hine on 3 Oct 2016

Same as @max8hine, tried to use jQuery 3.1 with Foundation (Sites) 6.2.2, which produces the following error:

jquery_error

ShaneKilkelly on 17 Oct 2016

I have the exact same problem.
Any thoughts to fix it?

jraack on 19 Oct 2016

This is fixed in 6.2.4, which will be released TOMORROW. :)

kball on 19 Oct 2016

🎉1

Do you also release a fixed version for Foundation 5? We don't migrate to 6 till now...

tobias-kutter on 19 Oct 2016

@kball is this really fixed with 6.2.4? Can´t find anything about this issue in the release notes
https://github.com/zurb/foundation-sites/releases/

Baedda on 21 Oct 2016

@Baedda It should be. I just update the release notes highlighting this for the PR in question that fixed it.

We decided not to change the default to jQuery 3 until the minor release, but projects using 3 should now work.

kball on 21 Oct 2016

👍2 🎉1

It doesn't work with the latest jQuery 3.1.1 I made this pen to prove it.

h0r0m4n on 28 Nov 2016

@h0r0man you are using 6.2.3 in your pen. Changing it to 6.2.4 fixes the errors.

DaSchTour on 28 Nov 2016

👍2

I noted that 6.3 still didn't bump to jQuery 3 yet. Was this delayed for some reason?

memoht on 16 Dec 2016

@memoht I think jQuery 3 is supported, but package was not changed. But minimum version should still be jQuery 2

DaSchTour on 16 Dec 2016

After upgrading my test project to latest jquery

bower i --save jquery

and FS 6.3.0

bower i --save foundation-sites

verifying

bower list
    bower check-new     Checking for new versions of the project dependencies...
    test-site /srv/www/test
    ├── foundation-icon-fonts#afed003521
    ├─┬ foundation-sites#6.3.0
    │ ├── jquery#3.1.1 incompatible with ~2.2.0 (2.2.4 available, latest is 3.1.1)
    │ └── what-input#4.0.4
    └── jquery#3.1.1

updating the project still warns about "Code incompatibilities" re: jquery 3 "vs" FS6

bower update
    bower not-cached    https://github.com/zurb/foundation-icon-fonts.git#*
    bower resolve       https://github.com/zurb/foundation-icon-fonts.git#*
    bower cached        https://github.com/zurb/foundation-sites.git#6.3.0
    bower validate      6.3.0 against https://github.com/zurb/foundation-sites.git#^6.3.0
    bower cached        https://github.com/jquery/jquery-dist.git#3.1.1
    bower validate      3.1.1 against https://github.com/jquery/jquery-dist.git#^3.1.1
    bower download      https://github.com/zurb/foundation-icon-fonts/archive/master.tar.gz
    bower cached        https://github.com/jquery/jquery-dist.git#2.2.4
    bower validate      2.2.4 against https://github.com/jquery/jquery-dist.git#~2.2.0
    bower cached        https://github.com/ten1seven/what-input.git#4.0.4
    bower validate      4.0.4 against https://github.com/ten1seven/what-input.git#~4.0.3
    bower extract       foundation-icon-fonts#* archive.tar.gz
    bower resolved      https://github.com/zurb/foundation-icon-fonts.git#afed003521

    Please note that,
        foundation-sites#6.3.0 depends on jquery#~2.2.0 which resolved to jquery#2.2.4
        test-site depends on jquery#^3.1.1 which resolved to jquery#3.1.1
    Resort to using jquery#^3.1.1 which resolved to jquery#3.1.1
    Code incompatibilities may occur.

What's the current 'official' stance on jQuery?
If it's 'supported', what about these errors/warnings?
If it's NOT supported, what's the target version of FS to get full support?

ghost on 16 Dec 2016

👍1

Considering 6.3 was more than a minor release, I am not comfortable implementing jQuery 3 with Foundation until it gets official support. Still, it would be nice to move forward. This is literally the only thing in my app tied to jQuery 2 still.

memoht on 16 Dec 2016

@memoht Some combination of posts, including

https://github.com/zurb/foundation-sites/issues/8834

led me to understand that it's "Fine(tm)" to use ... and was even kinda-sorta-maybe supported. ish. And would be more so with FS >= v630

But since still seeing these warning/complaints, looking for some clarification.

ghost on 16 Dec 2016

@kball @colin-marshall @Owlbertz
ping?

ghost on 19 Dec 2016

It should "Just work" - all known conflicts have been removed. It looks like the bower.json dependency spec got missed (It's at ~2.2.0, and should be ^2.2.0 like in package.json). I'll submit a PR to fix.

kball on 20 Dec 2016

err, should be >= not ^

kball on 20 Dec 2016

@kball @rafibomb
great, thanks.
if this could get merged to _release_ tag, and updates pushed to pkg managers, it'll help with rollout -- without the need for intervention.

ghost on 20 Dec 2016

This is not fixed.

$(window).on("load", function (e) {}) currently does not work with jQuery 3.2.1