console.diff(...)
Extension Actions
- Extension status: Featured
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.
Motivation:
Track object mutations during runtime and/or while debugging with intention to find expected or unexpected changes.
Note: this extension utilises content scripts, so after immediate installation or an update, make sure to refresh the inspected tab before using its functionality.
API:
// compare left and right arguments
console.diff(
{ a: 1, b: 1, c: 3 },
{ a: 1, b: 2, d: 3 }
);
// with a single argument behaves the same as `console.diffPush`
console.diff(Date.now());
// shifts sides - previous right side becomes left, new value becomes right
console.diffPush(Date.now());
// update left side only
console.diffLeft(Date.now());
// update right side only
console.diffRight(Date.now());
Read more at: https://github.com/zendive/jsdiff
Latest reviews
- 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.
- 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.
- 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 :)
- 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 :)
- Anonymous
- Tried it and I already use it on a regular basis. I hope the developer will keep maintaining it.