Compare objects in memory with console.diff(old, new) devtools function
An extension for developers that enhances the console API by incorporating the ability to compare objects and adds a JSDiff tab (parallel to Elements, Network panels) within your dev-tools for viewing the results.
Note: before using, immediately after fresh installation, - make sure to refresh inspected tab or restart browser.
API:
// compare left and right
console.diff(left, right);
// shorthand for console.diffPush(next)
console.diff(next);
// update object on the left side only
console.diffLeft(left);
// update object on the right side only
console.diffRight(right);
// shifts sides, right becomes left, next becomes right
console.diffPush(next);
Read more at: https://github.com/zendive/jsdiff
Latest reviews
- (2023-06-20) Peter Tandler: When use have complex JS objects and need to know what changed, this is so extremely helpful! Thanks for sharing! Save me already hours.
- (2021-08-27) Isaac Drew: Incredibly useful. I don't think much maintenance will be required for an extension like this, but if there is I hope they'll keep it up :)
- (2018-04-30) Tried it and I already use it on a regular basis. I hope the developer will keep maintaining it.
Latest issues
- (2022-07-06, v:2.0) D Sherwin: Removing the console.log message at the beginnig
Any way to remove that console.log message that pops up every time I load a page. It clutters my log messages for my own code. - (2021-04-07, v:2.0) Jupiterian (Jupiterian): I cannot find jsdiff panel inside devtools
I cannot find jsdiff panel (tab) inside devtools. I verified that the extension is installed and enabled. Where can I find this inside devtools? I am running localhost. - (2020-03-26, v:1.1) Abdallah Meddah: Console.diff()
I tried it on google chrome, I'm getting VM58331:1 Uncaught TypeError: console.diff is not a function ( extension is installed and activated and can access all sites)