Scriptbar Snippets 🚀
Handy and easy to understand snippets to keep in your browser

#Intermediate, #Debug

Break point on property access

This is a very handy debugging tool to stop page javascript execution upon a registered object properties getter or setter acccess


  • Omg the cookie is being changed, but where? Give me a breakpoint when JS changes my cookies!

    • debugAccess(document, 'cookie');
  • Some JS is getting the scrollTop value causing massive Recalculate Styles costs.. Who is the perpetrator?

    • debugAccess(document.body,'scrollTop', true)

Common error

  • TypeError: can't redefine non-configurable property "x". See


/* * Inspired by */ (function AddBreakPointOnPropertyAccessFunction(window) { function debugAccess(obj, prop, debugGet) { const origValue = obj[prop]; Object.defineProperty(obj, prop, { get: function () { if (debugGet) debugger; return origValue; }, set: function (val) { debugger; return origValue = val; }, }); }; window.debugAccess = debugAccess; })(window);
Built with ❤️ by @domnguyen and everyone on the internet 🚀