Question

So, I’ve written a little javascript widget. All a user has to do is paste a script tag into the page, and right below it I insert a div with all of the content the user has requested.

Many sites do similar things, such as Twitter, Delicious and even StackOverflow.

What I’m curious about is how to test this widget to make sure that it will work properly on everyone’s webpage. I’m not using an iframe, so I really want to make sure that this code will work when inserted most places. I know it looks the same in all browsers.

Suggestions? Or should I just build one hundred web pages and insert my script tag and see if it works? I would hope there is an easier way than that.

Answer 1

Once you have confirmed that your javascript works cross-browser in a controlled environment, here are some things that might cause problems when used on an actual website:

CSS

• You’re using a CSS class that is already being used (for a different purpose) by the target website
• You’re using positioning that might interfere with the site’s CSS
• The elements you are using are being styled by the website’s CSS (you might want to use some sort of “reset” CSS that applies only to your widget)

HTML

• You’re creating elements with the same id attribute as an element that already exists on the website
• You’re specifying a name attribute that is already being used (while name can be used for multiple elements, you may not be expecting that)

Javascript

• What is the expected behaviour without Javascript enabled? If your script creates everything, is it acceptable for nothing to be present without JS?