Rich-text Reply

Variation code not accepting .on()

plac3bodk 01-08-16
Accepted Solution

Variation code not accepting .on()

Hi there

 

I've been experiencing some issues once in a while with the Variation Code Editor.

 

For example, I was setting up a test today, where I rearranged the left menu on a webshop, and for that I had to make a script that, on click, added a class to the clicked element, and at the same time removed this class from any other element.

 

I made it all work in jsfiddle, but when I pasted it into the Variation Code Editor, it gives me the following warning.

 

I've experienced this and other similar errors once in a while.

 

Is there a way to disable code validation? Since I know the script is working as it should.

.on() fail.PNG
plac3bodk 01-08-16
 

Re: Variation code not accepting .on()

[ Edited ]

Alright. So I figured out what the problem was.

Optimizely includes trimmed jQuery 1.6.4 by default.

But from the Optimizely "home screen" click Settings > JavaScript, check
'Include trimmed jQuery (1.11.3) in project code (recommended)'
and click save.

I guess .on() wasn't added to the jQuery library until 1.7.x

So if anyone else are experiencing problems with the Variation Code Editor not accepting valid code, try changing the jQuery version to 1.11.3

JDahlinANF 01-08-16
 

Re: Variation code not accepting .on()

Just as FYI... 

 

since you know the code works when you run it in your console, you could reference

window.$('xxx').on() 

which would force it to wait before executing and use your window-scoped version of jQuery

 

This technique is also useful for when you want to use a custom function defined within your site's JS file or perhaps use a method that comes in via jQuery extension/plugin

.

plac3bodk 01-11-16
 

Re: Variation code not accepting .on()

Thanks nap0leon

 

That's good to know Smiley Happy

cubelodyte 04-12-16
 

Re: Variation code not accepting .on()

Henrik,

Thanks for the heads-up. 

I've been using the solution mentioned by Jason for so long that I hadn't noticed the availability of jQuery newer than 1.6.4. 

 

Commentary

I find it a little odd that the newer version of jQuery (1.11.3) is listed in the middle of the choices. Skim-readers like myself are likely to continue to miss this. 

Scott Ehly
Manager of Site Optimization
sehly@rentpath.com

'The single biggest problem with communication is the illusion that it has taken place.' - George Bernard Shaw
plac3bodk 04-12-16
 

Re: Variation code not accepting .on()

[ Edited ]

@cubelodyte I totally agree with you.

 

I didn't figure it out until I started reading the jQuery documentation for .on() and saw that it wasn't introduced until v.7.x.x and remebered seing a couple of different versions in the Optimizely settings.

 

What I don't understand is why the newest (stable) version of jQuery isn't automacially chosen for new accounts/projects.

I can't imagine that I'm the first trying to use a newer method not supported by the default jQuery version in Optimizely.

 

Anyways. Now I know where to look, if Optimizely tells me a method isn't a method Smiley Happy

 

Guess they haven't A/B tested the sort order of the jQuery versions. *mic drop*

cubelodyte 04-12-16
 

Re: Variation code not accepting .on()

Jason, 

Another method I've found effective is to eschew the alias "$" and use the fully qualified "jQuery":

 

    jQuery(document).on('eventName', function(event, data){
        return stuff;
      }, {});

Maybe there's something I'm still missing about 'scope'.

 

I have another question for you:

Does window.$('') really cause the variation to "wait" when used in variation code?

 

I've used this in the experiment JS (formerly Global JS) and depending on the page load timings, I've been forced to put the code inside 

 

$( document ).ready(function() {
});

 

In the case of one site, I recently had to move it to

 

window.onload = function() {
});

 

 

Scott Ehly
Manager of Site Optimization
sehly@rentpath.com

'The single biggest problem with communication is the illusion that it has taken place.' - George Bernard Shaw