Skip to content

Commit 1c9c6fd

Browse files
committed
.withKey docs
1 parent 09e269a commit 1c9c6fd

1 file changed

Lines changed: 11 additions & 2 deletions

File tree

README.md

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ Suppose you have the following JSX.
3434
<TodoApp className="todo-app">
3535
<TodoInput />
3636
<TodoList>
37-
<TodoItem priority="High">Item 1</TodoItem>
38-
<TodoItem priority="Low">Item 2</TodoItem>
37+
<TodoItem priority="High" key="HighPriority">Item 1</TodoItem>
38+
<TodoItem priority="Low" key="LowPriority">Item 2</TodoItem>
3939
</TodoList>
4040

4141
<div className="items-count">Items count: <span>{this.state.itemCount}</span></div>
@@ -66,6 +66,15 @@ const itemsCount = ReactSelector('TodoApp div span');
6666

6767
Warning: if you specify a DOM element's tag name, React selectors search for the element among the component's children without looking into nested components. For instance, for the JSX above the `ReactSelector('TodoApp div')` selector will be equal to `Selector('.todo-app > div')`.
6868

69+
#### Selecting components by the component key
70+
To obtain a component by the key use `withKey` method.
71+
72+
```js
73+
import { ReactSelector } from 'testcafe-react-selectors';
74+
75+
const item = ReactSelector('TodoItem').withKey('HighPriority');
76+
```
77+
6978
#### Selecting components by property values
7079

7180
React selectors allow you to select elements that have a specific property value. To do this, use the `withProps` method. You can pass the property and its value as two parameters or an object.

0 commit comments

Comments
 (0)