-2

I have been building a third party javascript widget which renders a recommendation engine type widget on host sites. I have successfully deployed my widget on 4 websites before hitting this strange issue with this website. This website uses a floating.menu.js for their navigation buttons and this particular script is also calling my javascript apart from host's html markup so my widget gets rendered twice and it completely messes up my styling. Upon inspecting in console in chrome developer tools, it shows that VMxx type script is also running on the page apart from my own third party script. Does anyone know how to prevent these type of script from interefering with my script or how should I debug this issue at all. I

ankits
  • 305
  • 1
  • 3
  • 13
  • 1
    You need to provide specific details, there's no way we can answer such a vague, general question without seeing the code. – Barmar Feb 20 '15 at 09:29
  • Can't understand these elitist high pointers voting down the answer, or else how can I explain this question. I don't think I can provide any code or will be able to simulate the environment. The idea was that if anyone else had faced the similar issue in the past, he could share his 2 cents, definitely not the SO I have known, pathetic !! Moving to redditt or google group, pathetic !! – ankits Feb 20 '15 at 09:33
  • Please go to the [Help Center](http://stackoverflow.com/help) to learn how to ask good questions here. We can't read your mind or guess what your code is doing. – Barmar Feb 20 '15 at 09:36
  • @Barmar I do agree and understand this and I can share my javascript but the issue is not with my JS but with another JS that's being used on the host website which for some reason is also executing my script so my widget gets rendered twice. I'll try to simulate this on jsfiddle to the best of my abilities. – ankits Feb 20 '15 at 09:36

1 Answers1

1

1) You need to make sure your script is isolated from other scripts as much as possible by using something like the following:

(function () {

  var myPrivateFunction = function () {...};

  var myPublicFunction = function () {...};

  window.myWidget = {
    myPublicFunction: myPublicFunction
  };

}());

Using this method, you have full control over which functions are accessible outside your script.

2) If it's important for your script to only be executed once, you need to safeguard against multiple calls. Look into the "singleton pattern" (Simplest/Cleanest way to implement singleton in JavaScript?) for one option on how to handle this.

Community
  • 1
  • 1
Brandon Gano
  • 6,430
  • 1
  • 25
  • 25
  • Thanks , this indeed get me thinking into limiting the scope of some of my functions and exposing only what's necessary for the publisher to render my widget. – ankits Feb 21 '15 at 22:53