Skip to content

Commit

Permalink
v1.1.0 (#5)
Browse files Browse the repository at this point in the history
* update jsondiffpatch to 0.3.11 (https://www.npmjs.com/package/jsondiffpatch)

* Allow object comparison cross the tabs #2

* comparing with an empty object #3

* Reinject console.diff api on host page reload #4
  • Loading branch information
zendive authored Feb 22, 2019
1 parent fae6a96 commit fe02777
Show file tree
Hide file tree
Showing 30 changed files with 535 additions and 1,736 deletions.
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -60,4 +60,5 @@ typings/
# os
.DS_Store

*.zip
*.zip
package-lock.json
13 changes: 0 additions & 13 deletions .jshintrc

This file was deleted.

46 changes: 27 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,28 +1,36 @@
![jsdiff](./src/img/panel-icon64.png)
![jsdiff](./src/img/panel-icon28.png) [available at chrome web-store](https://chrome.google.com/webstore/detail/jsdiff-devtool/iefeamoljhdcpigpnpggeiiabpnpgonb)
---
Chrome devtools extension
intended to display result of in-memory object comparisons with
the help of dedicated commands invoked via console.
Chrome devtools extension intended to display result of deep in-memory object
comparisons with the help of dedicated console commands.

[find at chrome web-store](https://chrome.google.com/webstore/detail/jsdiff-devtool/iefeamoljhdcpigpnpggeiiabpnpgonb)

Example
===
### API
```javascript
console.diff(left, right);
console.diffLeft(left);
console.diffRight(right);
console.diffPush(next); // private case of console.diff with single argument
console.diff(left, right); // compare left and right
console.diff(next); // shorthand of diffPush while single argumented
console.diffLeft(left); // update object on the left side only
console.diffRight(right); // update object on the right side only
console.diffPush(next); // shifts sides, right becomes left, next becomes right
```
![screenshot](./doc/screenshot-01.png)

Usage basics
===
Left side for old state, right side for new.
To track changes of the same object in timed manner you can push it with `diffPush` command,
that will shift objects from right to left, showing differences with previous push state.

Based on
===
### Usage basics
Historicly, left side represents the old state and right side the new state.
Things that are present on the left side but missing on the right side are colour-coded as red (old).
Things that are missing on the left side but present on the right side are colour-coded as green (new).
To track changes of the same variable in timed manner you can push it with `diffPush` command,
that will shift objects from right to left, showing differences with previous push state.
You can compare objects from different tabs (sites).


### Screenshot
![screenshot](./src/img/screenshot-01.png)


### Gotcha
Comparred objects shouldn't contain functions or self-recurrent references, like DOM elements or view instances have.


### Based on
- [jsondiffpatch](https://github.com/benjamine/jsondiffpatch) by Benjamín Eidelman
- [vuejs](https://github.com/vuejs) by Evan You
Binary file removed doc/screenshot-00.png
Binary file not shown.
Binary file removed doc/screenshot-01.png
Binary file not shown.
609 changes: 0 additions & 609 deletions jsdiff.js

This file was deleted.

11 changes: 7 additions & 4 deletions manifest.json
Original file line number Diff line number Diff line change
@@ -1,11 +1,13 @@
{
"name": "JSDiff Devtool",
"description": "Add console.diff() to your devtools...",
"version": "1.0",
"name": "console.diff(...)",
"description": "Deep compare complex in-memory objects inside browser devtools panel with console.diff command.",
"version": "1.1",
"manifest_version": 2,
"minimum_chrome_version": "64.0",
"devtools_page": "src/jsdiff-devtools.html",
"icons": {
"28": "src/img/panel-icon28.png",
"64": "src/img/panel-icon64.png",
"128": "src/img/panel-icon128.png"
},
"background": {
Expand All @@ -19,6 +21,7 @@
"http://*/*",
"https://*/*",
"file:///*",
"clipboardWrite"
"clipboardWrite",
"tabs"
]
}
46 changes: 46 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
{
"name": "jsdiff",
"version": "1.1.0",
"description": "![jsdiff](./src/img/panel-icon64.png) --- Chrome devtools extension intended to display result of in-memory object comparisons with the help of dedicated commands invoked via console.",
"private": true,
"directories": {
"doc": "doc"
},
"scripts": {
"test": "echo \"no test\" && exit 1",
"dev": "webpack --progress --watch",
"prod": "webpack --progress -p"
},
"repository": {
"type": "git",
"url": "git+https://github.com/zendive/jsdiff.git"
},
"keywords": [
"devtools",
"chrome",
"extension"
],
"author": "Block Alexander",
"license": "proprietary",
"bugs": {
"url": "https://github.com/zendive/jsdiff/issues"
},
"homepage": "https://github.com/zendive/jsdiff#readme",
"devDependencies": {
"clean-webpack-plugin": "~1.0.1",
"css-loader": "~2.1.0",
"file-loader": "^3.0.1",
"node-sass": "~4.11.0",
"sass-loader": "~7.1.0",
"style-loader": "~0.23.1",
"vue-loader": "~15.6.2",
"vue-template-compiler": "~2.6.6",
"webpack": "~4.29.0",
"webpack-cli": "~3.2.1"
},
"dependencies": {
"jsondiffpatch": "~0.3.11",
"moment": "~2.24.0",
"vue": "~2.6.6"
}
}
170 changes: 0 additions & 170 deletions src/css/jsondiffpatch-formatter.css

This file was deleted.

61 changes: 0 additions & 61 deletions src/css/style.css

This file was deleted.

7 changes: 0 additions & 7 deletions src/css/style.css.map

This file was deleted.

Loading

0 comments on commit fe02777

Please sign in to comment.