Question

Firebug for Firefox has a nice feature, called “Break on property change”, where I can mark any property of any object, and it will stop JavaScript execution right before the change.

I’m trying to achieve the same in Google Chrome, and I can’t find the function in Chrome debugger. How do I do this in Google Chrome?

Answer 1

If you don’t mind messing around with the source, you could redefine the property with an accessor.

// original object
var obj = {
    someProp: 10
};

// save in another property
obj._someProp = obj.someProp;

// overwrite with accessor
Object.defineProperty(obj, 'someProp', {
    get: function () {
        return obj._someProp;
    },

    set: function (value) {
        debugger; // sets breakpoint
        obj._someProp = value;
    }
});