Skip to content

Commit 3fdc39e

Browse files
authored
Update readme.md
1 parent 719c47d commit 3fdc39e

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

readme.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,33 @@ After installing both the Chrome extension and the npm package, just open up you
3131

3232
Then open up your Chrome DevTools. There'll be a new tab called React-Time-Travel.
3333

34+
## Features
35+
36+
### Recording
37+
38+
Whenever state is changed (whenever setState is called), this extension will create a snapshot of the current state tree and record it. Each snapshot will be displayed in Chrome DevTools under the React-Time-Travel panel.
39+
40+
### Viewing
41+
42+
You can click on a snapshot to view your app's state. State can be visualized in a JSON or a tree.
43+
44+
The selected snapshot can also be diffed/compared with the current dom.
45+
46+
### Jumping
47+
48+
The most important feature of all. Jumping to any previous recorded snapshot. Hitting the jump button on any snapshot will change the dom by setting their state. One important thing to note. This library does not work well when mixing React with direct DOM manipulation. Since DOM manipulation doesn't change any React state, this library cannot record or even detect that change. Of course, you should be avoiding mixing the two in the first place.
49+
50+
### Others
51+
52+
Other handy features include:
53+
* multiple tabs support
54+
* a slider to move through snapshots quickly
55+
* a play button to move through snapshots automatically
56+
* a pause which button stops recording each snapshot
57+
* a lock button to freeze the DOM in place. setState will lose all functionality while the extension is locked
58+
* a persist button to keep snapshots upon refresh. handy when changing code and debugging
59+
* export/import the current snapshots in memory
60+
3461
## Authors
3562

3663
* **Ryan Dang** - [@rydang](https://github.com/rydang)

0 commit comments

Comments
 (0)