Skip to content

Commit ff5936a

Browse files
authored
Update README.md
1 parent c9729f8 commit ff5936a

File tree

1 file changed

+12
-7
lines changed

1 file changed

+12
-7
lines changed

README.md

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,8 @@ class App extends Component {
3030
}
3131
```
3232

33-
3. Install the React VT Chrome Developer Tool from the Chrome store:
34-
https://chrome.google.com/webstore/detail/react-vt/aphjepidficfgphkbggojoemgpmianhi?hl=en
33+
3. Install the React VT Chrome Developer Tool from the [Chrome Store](https://chrome.google.com/webstore/detail/react-vt/aphjepidficfgphkbggojoemgpmianhi?hl=en).
34+
3535

3636
4. Run your React application in Chrome
3737

@@ -41,8 +41,8 @@ https://chrome.google.com/webstore/detail/react-vt/aphjepidficfgphkbggojoemgpmia
4141

4242
### Terminology
4343
* Assertion Block: An assertion block is a collection of actions and tests to define your assertion. This is analogous to *it* statements in Mocha tests. At least one test or action is required for an assertion block to be valid.
44-
* Action: Actions can be added to your assertion block to build your test case. Click, double click, right click, and enter are available as actions. Enzyme exports are currently unsupported for Enter actions.
45-
* Test: Basic equal, not equal, greater than and less than comparisons can be done on props, state, and text nodes.
44+
* Action: Actions can be added to your assertion block to build your test case. Click, double click, right click, and enter are available as actions. **Enzyme exports are currently unsupported for Enter actions**.
45+
* Test: Equal, not equal, greater than and less than comparisons can be done on props, state, and text nodes.
4646

4747
### Creating an assertion block
4848
1. Click on new assertion block and enter a name - e.g. 'should render a button'. This will be the statement that will appear on an exported Enzyme test:
@@ -53,7 +53,7 @@ it('should render a button', () => {...});
5353
3. To create a test:
5454
1. Select target
5555
* Node: Selected tree node, which refers to a component
56-
* Component: Specify a component o test the number of components (length) or a particular component (index)
56+
* Component: Specify a component to test the number of components (length) or a particular component (index)
5757
* ID: Select an element by ID to test text content
5858
* Class: Select elements by class to test the number of elements that match the className (length) or a particular element of the class (index)
5959
* Tag: Select a tag type to select elements that are not categorized as class or ID
@@ -67,6 +67,11 @@ it('should render a button', () => {...});
6767

6868
### Other Notes
6969
1. Multiple actions and tests can be defined in one assertion block. Once you're ready to test, save the assertion block. Saved assertion blocks are stored in LocalStorage and are restored the next time React VT is opened.
70-
2. To run through your actions and tests, execute them in your React application while React VT Developer Tool is open to view live test results.
71-
3. Once you're satisfied with your tests, you can export them as an Enzyme file and use it as a basis to start writing your own Enzyme tests.
70+
2. To run through your actions and tests, execute them in your React application while React VT Developer Tool is open to view live test results (e.g. clicking the button that you've specified as an action in your assertion block).
71+
3. Tests will not run until the actions that precede them are completed.
72+
73+
![Image of Block](https://github.com/brIAN-3/react-vt/blob/master/src/BlockScreenshot.png)
74+
75+
E.g. Test to check the value of Square will not run until the click action on Square has occurred.
76+
4. Once you're satisfied with your tests, you can export them as an Enzyme file and use it as a basis to start writing your own Enzyme tests.
7277

0 commit comments

Comments
 (0)