I’ve got a handy little bookmarklet that I use to check whether any variables have slipped out in the to global namespace (i.e. on to the window
object).
[Globals]()
Note that all global variables (including functions) that have been added by your page, will be written to via console.log
.
The bookmarklet will also prompt to filter out globals, i.e. if you don’t care about functions, just filter it out.
[](https://training.leftlogic.com/buy/terminal/cli2?coupon=BLOG\&utm_source=blog\&utm_medium=banner\&utm_campaign=remysharp-discount)
[READER DISCOUNTSave $50 on terminal.training](https://training.leftlogic.com/buy/terminal/cli2?coupon=BLOG\&utm_source=blog\&utm_medium=banner\&utm_campaign=remysharp-discount)
[I’ve published 38 videos for new developers, designers, UX, UI, product owners and anyone who needs to conquer the command line today.](https://training.leftlogic.com/buy/terminal/cli2?coupon=BLOG\&utm_source=blog\&utm_medium=banner\&utm_campaign=remysharp-discount)
[$49 - only from this link](https://training.leftlogic.com/buy/terminal/cli2?coupon=BLOG\&utm_source=blog\&utm_medium=banner\&utm_campaign=remysharp-discount)
It won’t work in IE because it writes to the console.log
- but globals are globals - so it can just as easily be tested in Firefox.
How it works[](#how-it-works)
It’s fairly simple really. The bookmarklet creates a hidden iframe and loops through all the attributes on the window
object removing the common ones.
Then there’s a small tweak to remove a few manually (addEventListener, document, location, navigator and window), partly because it’s an iframe, partly because I set the location to [about:blank]().
Every thing that remains was put there by the particular page.
The code[](#the-code)
The code is simply a compressed bookmarklet version of the following:
var differences = {},
exceptions,
globals = {},
ignoreList = (prompt('Ignore filter (comma sep)?', '') || '').split(','),
i = ignoreList.length,
iframe = document.createElement('iframe');
while (i--) {
globals[ignoreList[i]] = 1
}
for (i in window) {
differences[i] = {
'type': typeof window[i],
'val': window[i]
}
}
iframe.style.display = 'none';
document.body.appendChild(iframe);
iframe.src = 'about:blank';
iframe = iframe.contentWindow || iframe.contentDocument;
for (i in differences) {
if (typeof iframe[i] != 'undefined') delete differences[i];
else if (globals[differences[i].type]) delete differences[i]
}
exceptions = 'addEventListener,document,location,navigator,window'.split(',');
i = exceptions.length;
while (--i) {
delete differences[exceptions[i]]
}
console.dir(differences);
And there it is :)
Published 1-Nov 2007 under #bookmarklet & #code & #debugging & #global & #javascript. [Edit this post](https://github.com/remy/remysharp.com/blob/main/public/blog/detect-global-variables.md)
Comments
Lock Thread
Login
Add Comment[M ↓ Markdown]()
[Upvotes]()[Newest]()[Oldest]()

Felquis Gimenes
0 points
8 years ago
Hi Remy, I really enjoyed your post. But already is 2015 and I was wondering if there’s some tool built in developer tools to help us find globals.
I hope you’ll read this comment :)

rem
0 points
8 years ago
I’d start here: [https://www.npmjs.com/packa…;](https://www.npmjs.com/package/globals)
?
Anonymous
0 points
14 years ago
Hey, this sounds like a great idea. However, if I wanted to run it on Firefox without Firebug installed, any ideas? Instead of console.log, should I just alert? document.write? I’m going to play with it, but if you have already solved the problem, no reason for me to reinvent the (digital) wheel.
I’m using Firefox 3.x, and I get "console not defined" when I click the \[analyze] button. I’m just ass-u-me’ing that console is a Firebug object.
If you fixed it somehow (e.g. a giant alert), then it would be compatible with IE, also.
[Commento](https://commento.io)