Exit intent: JS errors when attempting to add custom JS

[#1]

Hello, 

I'm trying to run an expirment that will show and exit overlay at a critical point in our funnel. We're using wisepops. 

The JS provided by Wisepops is: 

<script type="text/javascript">
  (function() {var s = document.createElement('script');s.type = 'text/javascript';s.async = true;
  s.src=document.location.protocol + '//loader.wisepops.com/default/index/get-loader?user_id=24320';
  var s2 = document.getElementsByTagName('script')[0];s2.parentNode.insertBefore(s, s2);})();
</script>

I've tried two methods to adding the JS;

1 Adding the raw JS to the < edit code > window. 

2 Saving the JS above into a file, uploading it to our server and using "Load external Javascript" tutorial and code example here: http://developers.optimizely.com/javascript/code-samples/index.html#helpers-external-js

When I add the raw JS to the code editor I get the following error when I click "Apply"

"Error evaluating variation javascript&colon;
SyntaxError: Unexpected token < (line 54, col 12193)"

When I use method 2 the overlay won't load, however does when I apply the raw JS directly to the page. 

Any idea how to get this use case off the ground or if you're loading an exit overlay into a variation how are you doing it?

Thanks,

Lee

[#2]

@GFP - When you add the code to the variation, did you include the <script> portion?  You only want to add this part:

  (function() {var s = document.createElement('script');s.type = 'text/javascript';s.async = true;
  s.src=document.location.protocol + '//loader.wisepops.com/default/index/get-loader?user_id=24320';
  var s2 = document.getElementsByTagName('script')[0];s2.parentNode.insertBefore(s, s2);})();

[#3]

Sure did. The board stripped the script element before I posted it.

[#4 · Accepted solution]

@GFP

The code snippet is actually a function that loads another JS file.  So you have a few options:

1- Add the code snippet (but do not include the <script> tags) into your variation's code.  This will cause the wisepops code to be added only to users in the B Variation.

2- Use the code provided by Optimizely to load the JS file directly.  In this case, you do not want to load a file that contains the function that loads the wisepops library, you want to load the library.  Where the example has

loadScript('http://www.example.com/test.js', function() {

You want to use:

loadScript('https://loader.wisepops.com/default/index/get-loader?user_id=24320', function() {

Each of these approaches should accomplish the same thing - the wisepops code is now added to the page.  What you do to make it work and the content inside of the exit pop, I have no clue, but you should at least now have it ready to work with.

[#5]

Thank you Jason, option 1 worked nicely.

[#6]

Hey Jason,

I'm trying to integrate Optimonk over wisepops now. I'm stripping the &lt;script&gt; tags and dropping the JS into the editor however the pop is not loading. This looks slightly different to the wisepops code, just wondering if you could let me know how to get this one up and running?

<script type="text/javascript">
    (function(e,a){
        var t,r=e.getElementsByTagName("head")[0],c=e.location.protocol;
        t=e.createElement("script");t.type="text/javascript";
        t.charset="utf-8";t.async=!0;t.defer=!0;
        t.src=c+"//front.optimonk.com/public/"+a+"/js/preload.js";r.appendChild(t);
    })(document,"11711");
</script>

[#7]

@GFP - The same approach should work

1- Add the function directly to the variation:

    (function(e,a){
        var t,r=e.getElementsByTagName("head")[0],c=e.location.protocol;
        t=e.createElement("script");t.type="text/javascript";
        t.charset="utf-8";t.async=!0;t.defer=!0;
        t.src=c+"//front.optimonk.com/public/"+a+"/js/preload.js";r.appendChild(t);
    })(document,"11711");

Or load the URL using loadScript:

loadScript('https://front.optimonk.com/public/11711/js/preload.js', function() {