How to know what objects were added to window by the current page code?

Question

When I visit some page, like an SPA, I know some objects are added to window by its code.

Is there a way to know what are native browser objects/methods, and which were added by the app?

Answer 1

calling the window variable basicly give you an overview from all the content inside of it. I guess if you want to known how much functions it currently includes you could do something like:

Object.keys(window).length; //or just Object.keys for the names

To known if new functions have been added to the window object need to known the number of keys their where before they where included or just by knowning the static number. To just give some example. Here on stackoverflow the window object only contains 246 keys. However on something like google I counted 1597 keys. So it really depends on the app you are using.

So what you could do is write a function that checks if the amount of keys have been increased and when that happends taking out the key and moving it into a array inside the function.

That just what I get from your question.

Answer 2

I think you are looking for Mutation Observers. With them you can listen for newly added or removed DOM elements. I believe you also get notified of attribute and text changes.

Here is a link to a short article about them. Mutation Observers

Hope this helps!

Answer 3

Suppose you have two separate tabs. One that doesn't add anything to window (which is hard to find), one that have added some properties.

have both open.

in the clean one do : a = Object.keys(window); JSON.stringify(a);

copy the result and move that to the tab that have added some properties to window. then do a = JSON.parse(<Ctrl + v>) and b = Object.keys(window)

and finally : c = b.filter(p=>a.indexOf(p)=== -1)

now c contains names of all properties that have been added to window object by that tab;

HOT TIP: Firefox Developer Edition does that by default : a screenshot of how it works Note that window's default properties are separated in a different property (called [default properties])