Darren Cook
Darren Cook

Reputation: 28928

Cannot see javascript object properties in Firefox

When I run this function in Firefox (Firefox 20, Linux) I just see {};{}:

es.addEventListener('error', function(e){document.getElementById('debug').innerHTML+="ERR:"+JSON.stringify(e)+";"+JSON.stringify(es)+"<br/>";},false);

BTW, es is an EventSource object, and e is an Event object.

So, I tried this alternative:

function objToString (obj) {
    var str = '';
    for (var p in obj) {
        if (obj.hasOwnProperty(p)) {
            str += p + '::' + obj[p] + '\n';
        }
    }
    return str;
}

//...

es.addEventListener('error', function(e){document.getElementById('debug').innerHTML+="ERR:"+objToString(e)+";"+objToString(es)+"<br/>";},false);

And still get nothing output. So I tried this approach, and still get nothing, both for toString() and for the keys. (toSource() was the same too.)

es.addEventListener('error', function(e){document.getElementById('debug').innerHTML+="ERR:"+e.toString()+";"+Object.keys(e).toString()+";"+es.toString()+";"+Object.keys(es).toString()+"<br/>";},false);

Still nothing. This seemed unfair, as by using Firebug to set a breakpoint, I could see both objects had lots of properties. Then I tried in Chrome, and discovered all three techniques work. And all three also work in Opera.

So, what is going on with Firefox? Is there some limitation with viewing the properties of built-in objects? Is it a security thing that I can override by setting some Firefox property?


NOTE: the post that was earlier marked as a duplicate (How to get error event details in Firefox using addEventListener?) is a different question. I can access e.type, es.url, etc. in all browsers, including Firefox. What is different in Firefox is that es.toString() returns an empty string, JSON.stringify sees an empty object, Object.Keys(es) returns an empty array, etc.

Upvotes: 2

Views: 296

Answers (1)

Passerby
Passerby

Reputation: 10070

OK, extending from comment:

Because in Firefox/Gecko, many DOM-related properties sits in prototype chain, not in object instance's own property (e.g. clientHeight in Element.prototype, not in any element instance), so obj.hasOwnProperty(p) will false, and Object.keys will return an empty array.

Compare

Object.getPrototypeOf(document.documentElement)

In Chrome:

HTMLHtmlElement {insertAdjacentHTML: function, insertAdjacentText: function, click: function, insertAdjacentElement: function, getAttribute: function…}
    constructor: function HTMLHtmlElement() { [native code] }
    __proto__: HTMLElement
        click: function click() { [native code] }
        constructor: function HTMLElement() { [native code] }
        /*... all native functions */
        __proto__: Node

In Firefox:

(list all constants, properties, methods in plain first-level; heck, Firefox's native console result is hard to copy).

Upvotes: 1

Related Questions