Skip to content

Commit fe02777

Browse files
authored
v1.1.0 (#5)
* 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
1 parent fae6a96 commit fe02777

30 files changed

+535
-1736
lines changed

.gitignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -60,4 +60,5 @@ typings/
6060
# os
6161
.DS_Store
6262

63-
*.zip
63+
*.zip
64+
package-lock.json

.jshintrc

-13
This file was deleted.

README.md

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

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

9-
Example
10-
===
7+
### API
118
```javascript
12-
console.diff(left, right);
13-
console.diffLeft(left);
14-
console.diffRight(right);
15-
console.diffPush(next); // private case of console.diff with single argument
9+
console.diff(left, right); // compare left and right
10+
console.diff(next); // shorthand of diffPush while single argumented
11+
console.diffLeft(left); // update object on the left side only
12+
console.diffRight(right); // update object on the right side only
13+
console.diffPush(next); // shifts sides, right becomes left, next becomes right
1614
```
17-
![screenshot](./doc/screenshot-01.png)
1815

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

25-
Based on
26-
===
17+
### Usage basics
18+
Historicly, left side represents the old state and right side the new state.
19+
Things that are present on the left side but missing on the right side are colour-coded as red (old).
20+
Things that are missing on the left side but present on the right side are colour-coded as green (new).
21+
To track changes of the same variable in timed manner you can push it with `diffPush` command,
22+
that will shift objects from right to left, showing differences with previous push state.
23+
You can compare objects from different tabs (sites).
24+
25+
26+
### Screenshot
27+
![screenshot](./src/img/screenshot-01.png)
28+
29+
30+
### Gotcha
31+
Comparred objects shouldn't contain functions or self-recurrent references, like DOM elements or view instances have.
32+
33+
34+
### Based on
2735
- [jsondiffpatch](https://github.com/benjamine/jsondiffpatch) by Benjamín Eidelman
2836
- [vuejs](https://github.com/vuejs) by Evan You

doc/screenshot-00.png

-290 KB
Binary file not shown.

doc/screenshot-01.png

-271 KB
Binary file not shown.

jsdiff.js

-609
This file was deleted.

manifest.json

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
{
2-
"name": "JSDiff Devtool",
3-
"description": "Add console.diff() to your devtools...",
4-
"version": "1.0",
2+
"name": "console.diff(...)",
3+
"description": "Deep compare complex in-memory objects inside browser devtools panel with console.diff command.",
4+
"version": "1.1",
55
"manifest_version": 2,
66
"minimum_chrome_version": "64.0",
77
"devtools_page": "src/jsdiff-devtools.html",
88
"icons": {
9+
"28": "src/img/panel-icon28.png",
10+
"64": "src/img/panel-icon64.png",
911
"128": "src/img/panel-icon128.png"
1012
},
1113
"background": {
@@ -19,6 +21,7 @@
1921
"http://*/*",
2022
"https://*/*",
2123
"file:///*",
22-
"clipboardWrite"
24+
"clipboardWrite",
25+
"tabs"
2326
]
2427
}

package.json

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
{
2+
"name": "jsdiff",
3+
"version": "1.1.0",
4+
"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.",
5+
"private": true,
6+
"directories": {
7+
"doc": "doc"
8+
},
9+
"scripts": {
10+
"test": "echo \"no test\" && exit 1",
11+
"dev": "webpack --progress --watch",
12+
"prod": "webpack --progress -p"
13+
},
14+
"repository": {
15+
"type": "git",
16+
"url": "git+https://github.com/zendive/jsdiff.git"
17+
},
18+
"keywords": [
19+
"devtools",
20+
"chrome",
21+
"extension"
22+
],
23+
"author": "Block Alexander",
24+
"license": "proprietary",
25+
"bugs": {
26+
"url": "https://github.com/zendive/jsdiff/issues"
27+
},
28+
"homepage": "https://github.com/zendive/jsdiff#readme",
29+
"devDependencies": {
30+
"clean-webpack-plugin": "~1.0.1",
31+
"css-loader": "~2.1.0",
32+
"file-loader": "^3.0.1",
33+
"node-sass": "~4.11.0",
34+
"sass-loader": "~7.1.0",
35+
"style-loader": "~0.23.1",
36+
"vue-loader": "~15.6.2",
37+
"vue-template-compiler": "~2.6.6",
38+
"webpack": "~4.29.0",
39+
"webpack-cli": "~3.2.1"
40+
},
41+
"dependencies": {
42+
"jsondiffpatch": "~0.3.11",
43+
"moment": "~2.24.0",
44+
"vue": "~2.6.6"
45+
}
46+
}

src/css/jsondiffpatch-formatter.css

-170
This file was deleted.

src/css/style.css

-61
This file was deleted.

src/css/style.css.map

-7
This file was deleted.

0 commit comments

Comments
 (0)